當(dāng)前位置：首頁 > 运维知识 > windows >内容正文

windows

SAP系统和微信集成的系列教程之五：如何将SAP UI5应用嵌入到微信公众号菜单中

發(fā)布時(shí)間：2023/12/19 windows 26 豆豆

生活随笔收集整理的這篇文章主要介紹了 SAP系统和微信集成的系列教程之五：如何将SAP UI5应用嵌入到微信公众号菜单中小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

這是Jerry 2020年的第86篇文章，也是汪子熙公眾號(hào)總共第268篇原創(chuàng)文章。

2020年即將到達(dá)尾聲了。

Jerry所在團(tuán)隊(duì)的產(chǎn)品經(jīng)理，已經(jīng)開始讓大家把圣誕節(jié)期間的休假情況，維護(hù)在公司wiki里，以便安排假期值班人員：

Jerry借這篇文章的機(jī)會(huì)，提前祝各位粉絲圣誕快樂。

今天抽點(diǎn)時(shí)間，繼續(xù)填前些日子挖的一個(gè)坑。

本系列的英文版Jerry寫作于2017年，這個(gè)教程總共包含十篇文章，發(fā)表在SAP社區(qū)上。

系列目錄

(1)?微信開發(fā)環(huán)境的搭建

(2)?如何通過微信公眾號(hào)消費(fèi)API

(3)?微信用戶關(guān)注公眾號(hào)之后，自動(dòng)在SAP C4C系統(tǒng)創(chuàng)建客戶主數(shù)據(jù)

(4)?如何將SAP C4C主數(shù)據(jù)變化推送給微信公眾號(hào)

(5) 如何將SAP UI5應(yīng)用嵌入到微信公眾號(hào)菜單中(本文)

(6) 如何通過OAuth2獲取微信用戶信息并顯示在SAP UI5應(yīng)用中

(7) 使用Redis存儲(chǔ)微信用戶和公眾號(hào)的對(duì)話記錄

(8) 微信公眾號(hào)的地圖集成

(9) 如何將微信用戶發(fā)送到微信公眾號(hào)的消息保存到SAP C4C系統(tǒng)

(10) 如何在SAP C4C系統(tǒng)直接回復(fù)消息給微信公眾號(hào)的訂閱者

最近有不少朋友在微信上向我咨詢SAP系統(tǒng)和微信公眾號(hào)集成的問題，因此我把當(dāng)時(shí)寫的英文版翻譯成中文，重新發(fā)布在我的公眾號(hào)上。

需要注意的是，時(shí)隔三年，微信公眾號(hào)的開發(fā)流程可能有所變化，請(qǐng)大家自行鑒別。和微信公眾號(hào)集成的系統(tǒng)，我三年前選擇的是SAP Cloud for Customer.

本文的內(nèi)容很簡(jiǎn)單，用一句話就能概括：利用微信公眾號(hào)的菜單項(xiàng)，啟動(dòng)一個(gè)SAP UI5應(yīng)用，并運(yùn)行在微信的內(nèi)嵌瀏覽器里。

如下圖“Jerry List”菜單項(xiàng)所示：

我們提前把SAP UI5應(yīng)用部署在云平臺(tái)上，得到該應(yīng)用的url，然后直接將url綁定到“Jerry List”這個(gè)公眾號(hào)菜單即可。最后，點(diǎn)擊公眾號(hào)菜單后，這個(gè)SAP UI5應(yīng)用在微信瀏覽器里打開的效果如下：

下面是實(shí)現(xiàn)細(xì)節(jié)。

使用微信開發(fā)文檔里提到的公眾號(hào)菜單創(chuàng)建API，創(chuàng)建一個(gè)新的名為Jerry List的菜單，url字段指定成部署到云平臺(tái)上的SAP UI5應(yīng)用的url:

url: https://api.weixin.qq.com/cgi-bin/menu/create?access_token=4_otQpSMfcwvmcL-T-DovhnozCAYCpy6wiKU3t4LUeZcQOF_i85a9NbpKpx7seLyEeHlrxl1rtlztL0miJthojqlqHqJArx7sm5OUdnsAupPpUwGr2EWljdJrLlrAVDNcADACKU

Access Token使用如下的API調(diào)用，通過app id和app secret換取：

https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=&secret=.

將SAP UI5應(yīng)用部署到云平臺(tái)上，得到url：

http://wechatjerry.herokuapp.com/ui5/

確保該url直接在瀏覽器里訪問能夠正常工作：

上面這個(gè)UI5應(yīng)用的完整源代碼，可以在我的Github上找到。

這個(gè)nodejs應(yīng)用，調(diào)用第6行的app.use方法，將webapp文件夾下的SAP UI5應(yīng)用，通過/ui5暴露給用戶。

本系列下一篇即第六篇文章，Jerry會(huì)介紹如何通過OAuth 2協(xié)議，在SAP UI5應(yīng)用里獲取微信用戶信息并顯示。感謝閱讀。