【云速建站】對接微信公眾號、快捷支付、小程序

時(shí)間：2023-08-12 18:00:01 | 來源：網(wǎng)站運(yùn)營

時(shí)間：2023-08-12 18:00:01 來源：網(wǎng)站運(yùn)營

【云速建站】對接微信公眾號、快捷支付、小程序：目錄：

1. 綁定微信公眾號
2. 使用微信快捷登錄
3. 使用微信支付
4. 使用微信小程序
5. 使用微信推送消息
6. 微信相關(guān)常見問題

云速建站提供了對接微信公眾號、小程序的能力，可以通過公眾號、小程序訪問網(wǎng)站并完成下單支付，這個(gè)對于網(wǎng)站的拓展是幫助很大的。

下面介紹一下具體的配置流程。

1 綁定微信公眾號及使用

1.1 明確公眾號類型及其對應(yīng)的能力范圍

主要是公眾號管理和自定義菜單這兩個(gè)涉及公眾號跳轉(zhuǎn)網(wǎng)站的菜單，公眾號管理是綁定公眾號，使網(wǎng)站和公眾號匹配從而實(shí)現(xiàn)通過公眾號訪問網(wǎng)站；自定義菜單設(shè)置公眾號的菜單項(xiàng)。一般能申請服務(wù)號，認(rèn)證基本是沒有問題的，如果是訂閱號的話，如果沒有進(jìn)行認(rèn)證，那么自定義菜單是設(shè)置不了的，因?yàn)樽远x菜單是只有認(rèn)證的訂閱號、服務(wù)號才可以設(shè)置（這里指的是在網(wǎng)站后臺這里做設(shè)置）。推薦使用認(rèn)證的公眾號。

1.2 綁定公眾號

綁定公眾號因?yàn)樯婕暗搅斯娞柡途W(wǎng)站的對接，需要分別配置網(wǎng)站后臺和公眾平臺。

首先，我們登錄微信公眾平臺

1.2.1 獲取公眾號賬號信息

登錄微信公眾平臺https://mp.weixin.qq.com，在設(shè)置-公眾號設(shè)置-賬號詳情下，我們需要獲取的信息有：名稱、微信號、類型、認(rèn)證情況。

1.2.2 配置業(yè)務(wù)域名、JS域名、網(wǎng)頁授權(quán)域名

設(shè)置-公眾號設(shè)置-功能設(shè)置下，需要設(shè)置以下內(nèi)容

在這三個(gè)設(shè)置頁面中，可以看到一個(gè)需要下載并上傳到網(wǎng)站后臺的文件，三個(gè)提示的文件是一樣的，下載一個(gè)即可，把文件先下載到本地保存。

1.2.3 獲取APPid、APPsecret

然后打開開發(fā)-基本配置，在這里需要獲取的信息是：appid、APPsecret；需要配置IP白名單。如果是第一次綁定，需要重置一下APPsecret，否則提交時(shí)會報(bào)錯(cuò)。

1.2.4 配置白名單

配置白名單，點(diǎn)擊“查看”

點(diǎn)擊修改后，把IP填寫進(jìn)去最后確認(rèn)修改即可。填寫的白名單IP為114.115.185.211、114.115.223.181。上面是我配置白名單后的截圖。

1.2.5 上傳配置文件

現(xiàn)在，登錄云速建站后臺（https://console.huaweicloud.com/webmobile/?region=cn-north-1#/cloudsite/website），我們先把剛才下載的TXT文件上傳到網(wǎng)站后臺。點(diǎn)擊后臺管理

點(diǎn)擊頁面右側(cè)的站點(diǎn)編輯，進(jìn)入編輯界面

在編輯頁面的左側(cè)菜單項(xiàng)中，點(diǎn)擊文件菜單，上傳文件

1.2.6 綁定公眾號

接下來就到綁定公眾號了，在后臺管理-微信管理-公眾號管理處

把剛才獲取的公眾號信息填寫到相應(yīng)欄位，點(diǎn)擊下一步

返回公眾平臺，點(diǎn)擊基本配置-服務(wù)器配置的修改配置按鈕

然后這里需要注意的是，現(xiàn)在網(wǎng)站后臺和公眾平臺需要配置的都已經(jīng)配置完成了，但是都需要點(diǎn)擊保存，保存是有順序要求的。需要先保存網(wǎng)站后臺的配置，然后在保存公眾平臺的配置。

1、保存網(wǎng)站后臺配置

保存后可以在界面看到如下圖顯示

2、保存公眾平臺配置

提交成功后，記得把服務(wù)啟用

自此，微信公眾號的綁定就已經(jīng)完成了。

1.3 維護(hù)公眾號到網(wǎng)站的跳轉(zhuǎn)鏈接

1.3.1 認(rèn)證的公眾號編輯公眾號菜單

進(jìn)入網(wǎng)站后臺-微信管理-自定義菜單，點(diǎn)擊“+”號添加菜單

添加完菜單項(xiàng)后，需要給菜單設(shè)置動(dòng)作，以響應(yīng)用戶點(diǎn)擊菜單。

點(diǎn)擊生鮮超市菜單，然后選擇跳轉(zhuǎn)到網(wǎng)頁

點(diǎn)擊關(guān)于我們菜單，選擇發(fā)送消息

所有菜單設(shè)置動(dòng)作都維護(hù)后，點(diǎn)擊發(fā)表

1.3.2 效果

微信關(guān)注公眾號，進(jìn)入公眾號后，可以看到剛才添加的菜單項(xiàng)，并且點(diǎn)擊關(guān)于我們，顯示后臺設(shè)置的消息

點(diǎn)擊生鮮超市菜單，進(jìn)入網(wǎng)站，并且自動(dòng)完成登錄

1.4 注意事項(xiàng)

1.4.1 網(wǎng)站綁定了證書

如果網(wǎng)站綁定了ssl證書，配置項(xiàng)里邊需要填寫IP地址處，http需要換為https。如原地址為

http://XXX.com，綁定證書后，需要填寫https://XXX.com。

1.4.2 發(fā)布自定義菜單報(bào)錯(cuò)

如果發(fā)布自定義菜單時(shí)，提示上圖信息，請檢查一下①是否配置了白名單，白名單是否正確 ②如果白名單確認(rèn)沒問題的話，可以試著重置一下APPsecret，可能是由于首次綁定而沒有重置APPsecret。

2 使用微信快捷登錄

2.1 使用要求

微信開放平臺完善開發(fā)者資料時(shí)，需要填寫企業(yè)信息即需要有工商登記。此外，創(chuàng)建網(wǎng)站應(yīng)用需要填寫網(wǎng)站域名等信息，提交審核后，審核方是會登錄網(wǎng)站查看網(wǎng)站內(nèi)容的，所以在網(wǎng)站編輯完成后再來提交審核會相對好點(diǎn)，如果網(wǎng)站尚未編輯完成就提交審核，不能保證審核通過。

2.2 維護(hù)微信快捷登錄

2.2.1 注冊成為開發(fā)者

微信開放平臺地址： https://open.weixin.qq.com/cgi-bin/frame?t=home/web_tmpl&lang=zh_CN

微信開放平臺的賬號和微信公眾平臺的賬號是分開的，并且注冊了公眾平臺的郵箱不可再用于注冊開放平臺。

2.2.2 創(chuàng)建網(wǎng)站應(yīng)用

登錄微信開放平臺，點(diǎn)擊創(chuàng)建網(wǎng)站應(yīng)用

按照欄位要求填寫基本信息

填寫網(wǎng)站信息（這里的授權(quán)回調(diào)域、官網(wǎng)地址都是填寫后臺管理處綁定的那個(gè)域名），提交審核

審核通過后，獲取到appid和APPsecret，并申請開通微信登錄，如下圖（點(diǎn)擊應(yīng)用可以看到審核情況，如果長時(shí)間未審核通過，會給出原因，這時(shí)可按照提示修改或者聯(lián)系微信開放平臺的客服咨詢）

2.2.3 網(wǎng)站后臺添加微信登錄

登錄解決方案控制臺，地址：https://console.huaweicloud.com/webmobile/?region=cn-north-1#/cloudsite/website

進(jìn)入后臺管理

找到會員-第三方賬號，點(diǎn)擊

編輯微信登錄

把微信開放平臺獲取的appid、APPsecret填寫進(jìn)去，保存

保存后，微信登錄處于未激活狀態(tài)，點(diǎn)擊未激活

激活成功

2.2.4 網(wǎng)站頁面維護(hù)微信登錄方式

點(diǎn)擊后臺管理頁的站點(diǎn)編輯，進(jìn)入編輯界面

把會員控件拖拽到頁面

可以看到控件中已顯示一個(gè)微信的小圖標(biāo)，點(diǎn)擊圖標(biāo)使用微信登錄。

此外，可以點(diǎn)擊控件的樣式設(shè)置，找到第三方賬號，更改微信登錄的圖標(biāo)

3 使用微信支付

3.1 申請條件

1、 必須是經(jīng)過微信認(rèn)證的服務(wù)號，才可以申請開通微信支付。

2、 網(wǎng)站綁定的域名已備案成功。

3.2 申請微信支付

登錄微信公眾平臺https://mp.weixin.qq.com，點(diǎn)擊微信支付，按照頁面提示步驟填寫相應(yīng)資料完成支付申請

審核通過后，在微信支付下可以看到如下圖界面

3.3 配置微信支付需要獲取的信息

3.3.1 在微信公眾平臺獲取的信息

1、在公眾平臺-微信支付-商戶信息頁中，獲取商戶號、公司名稱

2、在公眾平臺-設(shè)置-公眾號設(shè)置-賬號詳情頁中，獲取微信號

3、在公眾平臺-基本配置頁中，獲取appid、APPsecret（APPsecret在綁定微信公眾號時(shí)已經(jīng)獲取過了，直接復(fù)制使用即可）

3.3.2 在微信商戶平臺獲取的信息

在商戶平臺-賬戶中心-API安全頁中，①下載證書，解壓備用；②設(shè)置32位的API秘鑰

3.4 配置微信支付

3.4.1 云速建站后臺管理配置

打開后臺管理-電子商戶設(shè)置-支付設(shè)置

找到微信支付，點(diǎn)擊后邊的編輯

填寫信息如下，點(diǎn)擊確定

配置完成后，請確保支付方式是開啟狀態(tài)（張開的眼睛圖標(biāo)），否則支付界面也是看不到該支付方式的。

3.4.2 微信商戶平臺配置

在商戶平臺-產(chǎn)品中心-我的產(chǎn)品中開啟支付方式

在商戶平臺-產(chǎn)品中心-開發(fā)配置中，填寫支付的授權(quán)目錄

注意授權(quán)目錄這里，提示框中的頂級域名指的是網(wǎng)站后臺管理處綁定的域名。另外，如果網(wǎng)站添加了證書，這里的http必須替換為https。

自此，微信支付就已經(jīng)配置完成了。

3.5 微信支付配置后不成功的解決步驟

微信支付配置完成后，如果支付過程出現(xiàn)問題，請按照以下幾點(diǎn)檢查配置

3.5.1 檢查公眾平臺帳號中的微信支付帳號和商戶平臺中的帳號是否一致

登錄微信公眾平臺-微信支付-商戶信息中查看商戶號

3.5.2 如果用戶訪問時(shí)一直在刷新，原因是公眾平臺的appid 或appscrert密鑰不正確

登錄微信公眾平臺-開發(fā)-基本配置，在此查看appid、APPsecret，然后檢查下配置過程中填寫這兩項(xiàng)值的地方是否填寫正確

3.5.3 檢查“收款方名稱”是否填寫了簡稱

登錄微信公眾平臺-微信支付-商戶信息

3.5.4 重置32位密鑰并不能包含簡單的連續(xù)字母或數(shù)字。（重點(diǎn)）已經(jīng)做過的也還需要再做一次

登錄商戶平臺-API安全

3.5.5 若使用微信支付報(bào)URL未注冊錯(cuò)誤，優(yōu)先檢查授權(quán)目錄是否正確

報(bào)錯(cuò)如下圖

登錄商戶平臺-產(chǎn)品中心-開發(fā)配置

檢查授權(quán)目錄是否填寫正確，重點(diǎn)檢查是否用授權(quán)目錄中的域名訪問的，注意必須是小寫字母，不能用大寫

1.支付授權(quán)目錄：綁定的域名+/wxpay/
2.掃碼支付回調(diào)鏈接 http://綁定域名/wxcallback.shtml

3.5.6 在商戶平臺商品大全中檢查 配置的支付是否開啟

3.5.7 檢查帳號類型是不是特約商戶，系統(tǒng)不支持特約商戶，請申請普通類型商戶

登錄商戶平臺-商戶信息中查看賬號類型

3.5.8 商家存在未配置的參數(shù)，請聯(lián)系商家解決

1，當(dāng)前調(diào)起H5支付的域名（微信側(cè)從referer中獲?。┡c申請H5支付時(shí)提交的授權(quán)域名不一致，如需添加或修改授權(quán)域名，

請登陸商戶號對應(yīng)的商戶平臺--"產(chǎn)品中心"--"開發(fā)配置"自行配置
2，如果設(shè)置了回跳地址redirect_url，請確認(rèn)設(shè)置的回跳地址的域名與申請H5支付時(shí)提交的授權(quán)域名是否一致

4 使用微信小程序

4.1 使用條件

網(wǎng)站必須添加了ssl證書，使用的域名已備案成功

4.2 申請小程序

在微信公眾平臺-小程序中，注冊認(rèn)證小程序。

認(rèn)證成功后，在開發(fā)-開發(fā)設(shè)置這里獲取小程序的appid、APPsecret，并配置服務(wù)器域名

這里4個(gè)域名都填寫站點(diǎn)編輯中生成小程序時(shí)選擇的那個(gè)域名。（如果網(wǎng)站僅綁定了一個(gè)域名，這里直接填寫該域名即可）

填寫完成后，點(diǎn)擊保存提交。

4.3 生成小程序

進(jìn)入后臺管理-站點(diǎn)編輯，點(diǎn)擊小程序圖標(biāo)切換到小程序編輯界面

小程序頁面編輯和PC、手機(jī)端的頁面編輯是一樣的，這里不多敘述。

在完成小程序頁面編輯后，點(diǎn)擊頁面右上角的生成按鈕，填寫頁面信息。如果不需要小程序的支付功能，支付商戶號和支付秘鑰這兩項(xiàng)可以不填。

保存完成后，把生成的壓縮包，下載到本地并解壓

4.4 發(fā)布小程序

4.4.1 下載微信開發(fā)者工具

https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

這里使用小程序平臺的管理員賬號登錄

4.4.2 導(dǎo)入小程序

登錄后，選擇小程序項(xiàng)目

導(dǎo)入項(xiàng)目，按欄位提示填寫信息。目錄選擇4.3下載解壓的小程序應(yīng)用包所在目錄，appid填寫4.2獲取到的id

4.4.3 編譯上傳

添加完項(xiàng)目后，進(jìn)入項(xiàng)目頁面，編譯、上傳即完成發(fā)布操作

注：上傳前應(yīng)先預(yù)覽一下小程序，看是否能正常打開預(yù)覽

填寫版本號，備注，確認(rèn)上傳

4.4.4 提交審核

登錄小程序后臺，進(jìn)入版本管理，提交審核

審核信息填寫

標(biāo)題：建議填寫商家的品牌名稱；

所在服務(wù)類目：建議選擇經(jīng)營類目；

標(biāo)簽：建議選擇填寫和自己品牌相關(guān)的標(biāo)簽

4.4.5 發(fā)布

審核通過后，進(jìn)入管理-版本管理，提交發(fā)布，小程序才會上線

4.5 把發(fā)布的小程序添加到附近的小程序

審核通過后，在剛才填寫的地址附近搜附近的小程序，就可以看到發(fā)布的小程序應(yīng)用了。

4.6 小程序頁面路徑獲取

在開發(fā)者工具中，頁面的左下角處

4.7 小程序綁定已有商戶號開通微信支付

登錄微信商戶平臺，點(diǎn)擊微信支付“申請”按鈕，進(jìn)入選擇開通方式頁，兩種方式一旦選擇后不可更改，這里選綁定一游微信支付商戶號

點(diǎn)擊“綁定”按鈕，進(jìn)入綁定已有商戶號流程

注：目前僅支持綁定主體一致且完成所有開戶流程的新接口普通類型商戶號，其他類型均不支持，詳情如下：
商戶號與appid的認(rèn)證主體不一致；
商戶號未走完所有開戶流程，包括未驗(yàn)證身份、未簽署協(xié)議等情況；
商戶號是老tenpay接口的商戶 號，未完成新接口升級；
商戶號是境外類型商戶號；
商戶號是服務(wù)商類型商戶號；
商戶號因違規(guī)處罰導(dǎo)致的限制；
另外，選擇該種方式請確認(rèn)你的業(yè)務(wù)模式和經(jīng)營范圍是否與“綁定的商戶號”一致。如不一致，請走新申請流程獲取新的商戶號。

點(diǎn)擊提交后，跳轉(zhuǎn)到成功提示頁面

也可在商戶平臺-產(chǎn)品中心-appid授權(quán)管理中查看申請單的處理情況

5 使用微信推送消息

5.1 申請模板消息權(quán)限

登錄到公眾平臺，點(diǎn)擊功能下的添加功能模塊

在插件庫中找到模板消息并申請開通

提交申請后，等待審核通過

5.2 后臺查詢消息模板

在推送模板下找到訂單支付，自動(dòng)發(fā)送選擇是，點(diǎn)擊后面的編輯按鈕

在彈出窗口中可以獲取到該消息模板對應(yīng)的公眾平臺中的模板編號，然后去公眾平臺模板庫中搜索并添加

5.3 添加模板

返回到公眾平臺，在功能-模板消息，點(diǎn)擊進(jìn)入模板庫

搜索想要的模板庫添加到我的模板中（5.2中在后臺獲取的模板編號，這里以訂單支付成功通知為例）

添加模板后，獲取到該模板的模板id，返回后臺，把模板id填寫到配置項(xiàng)中。

{first.DATA}/{remark.DATA}等模板配置項(xiàng)如果不知道填寫內(nèi)容是消息體的哪部分，可以在公眾平臺中，點(diǎn)擊該模板的詳情查看

因?yàn)檫x訂單支付是發(fā)送給管理員的，所以需要在這里把管理員賬號維護(hù)進(jìn)來

5.4 設(shè)置綁定引導(dǎo)流程

進(jìn)入后臺管理-微信管理-微信應(yīng)用

1、如果設(shè)置了自動(dòng)登錄，消息模板這里就不用維護(hù)引導(dǎo)綁定公眾號的操作了，微信消息推送到這里就配置完成了。

2、如果設(shè)置的彈出登錄，則需要維護(hù)一個(gè)引導(dǎo)流程引導(dǎo)用戶綁定賬號到公眾號上。

自定義一個(gè)菜單，這里我起名為綁定，讓綁定菜單跳轉(zhuǎn)到引導(dǎo)頁面。引導(dǎo)頁面的URL為：

http:// + 網(wǎng)站域名 + /index.php?_m=wp_weixin&_a=entrance，
例如：網(wǎng)站域名 是：http://abcd.com，引導(dǎo)頁路徑是：http://abcd.com/index.php?_m=wp_weixin&_a=entrance

5.5 測試效果

以自動(dòng)登錄為例（因?yàn)樵O(shè)置自動(dòng)登錄可以少維護(hù)引導(dǎo)流程）

微信關(guān)注公眾號，進(jìn)入網(wǎng)站，下單支付。微信中收到提醒消息

后臺微信推送消息處也可以看到推送記錄

6 微信相關(guān)常見問題

6.1 自定義菜單發(fā)布提示appid not bind weapp

可能原因有一下幾種，請檢查是否都正確配置
1. 原因是小程序和公眾號沒有關(guān)聯(lián)
2. 自定義菜單錄入時(shí)填寫的appid錯(cuò)誤
3. 公眾號不是認(rèn)證的服務(wù)號
4. 自定義菜單中有多個(gè)項(xiàng)目鏈接到不同的小程序，其中一個(gè)小程序沒有關(guān)聯(lián)

6.2 自定義菜單發(fā)布，提示invadlid access_token，請重新嘗試

1． 檢查公眾號appid、APPsecret是否正確
2． 檢查IP白名單填寫是否正確（114.115.185.211、114.115.223.181）

6.3 該公眾號暫時(shí)無法提供服務(wù),請稍后再試

1． 檢查PC站點(diǎn)是否開啟，站點(diǎn)必須是開啟狀態(tài)
2． 檢查IP白名單是否正確填寫（114.115.185.211、114.115.223.181）
3． 如果用戶安了ssl證書，配置公眾步驟中的URL需要填https://域名
4． 公眾平臺中服務(wù)器配置是否啟用

6.4 微信登錄報(bào)錯(cuò)，redirect_uri域名與后臺配置不一致，錯(cuò)誤碼10003

原因是公眾號配置的回調(diào)域名與請求的域名不一致，請檢查網(wǎng)頁授權(quán)域名是否填寫正確
網(wǎng)頁授權(quán)域名填寫請參考1.2.2（域名不能是空頭域名http://xxx.com）。
如果是從手機(jī)站底部菜單點(diǎn)擊進(jìn)入報(bào)此錯(cuò)，如下圖

進(jìn)入后臺管理-站點(diǎn)管理-設(shè)置-手機(jī)訪問，檢查配置的域名是否和網(wǎng)頁授權(quán)域名一致

云速建站之對接微信.pdf

更多精彩內(nèi)容，請滑至頂部點(diǎn)擊右上角關(guān)注小宅哦~

---

來源：華為云社區(qū)原創(chuàng) 作者：建站小哥