Интеграция WeChat JSSDK с NodeJS и Web Интеграция WeChat JS-SDK с NodeJS и Web.
Английский | Примечания к выпуску
npm install wechat-jssdk --save
# 或者
yarn add wechat-jssdk
const { Wechat } = require ( 'wechat-jssdk' ) ;
const wx = new Wechat ( wechatConfig ) ;
wechatConfig
имеет следующий формат:
{
//第一个为设置网页授权回调地址
wechatRedirectUrl : "http://yourdomain.com/wechat/oauth-callback" ,
wechatToken : "xxx" , //第一次在微信控制台保存开发者配置信息时使用
appId : "xxx" ,
appSecret : "xxx" ,
card : true , //开启卡券支持,默认关闭
payment : true , //开启支付支持,默认关闭
merchantId : '' , //商户ID
paymentSandBox : true , //沙箱模式,验收用例
paymentKey : '' , //必传,验签密钥,TIP:获取沙箱密钥也需要真实的密钥,所以即使在沙箱模式下,真实验签密钥也需要传入。
//pfx 证书
paymentCertificatePfx : fs . readFileSync ( path . join ( process . cwd ( ) , 'cert/apiclient_cert.p12' ) ) ,
//默认微信支付通知地址
paymentNotifyUrl : `http://your.domain.com/api/wechat/payment/` ,
//小程序配置
"miniProgram" : {
"appId" : "mp_appid" ,
"appSecret" : "mp_app_secret" ,
}
}
Другие поддерживаемые настройки имеют значения по умолчанию, которые по сути являются адресами API WeChat и не изменяются. Вы можете проверить ./lib/config.js
.
1. Перейдите на общедоступную платформу WeChat.
Загрузите файл типа MP_verify_XHZon7GAGRdcAFxx.txt
и поместите его в корневой каталог веб-сайта, например http://yourdomain.com/MP_verify_XHZon7GAGRdcAFxx.txt
. WeChat проверит ссылку.
2. Затем предоставьте интерфейс в вашем приложении express/koa для браузера, чтобы получить информацию для проверки, @см. демо.
//express app:
router . get ( '/get-signature' , ( req , res ) => {
wx . jssdk . getSignature ( req . query . url ) . then ( signatureData => {
res . json ( signatureData ) ;
} ) ;
} ) ;
//koa2/koa-router app:
router . get ( '/get-signature' , async ctx => {
ctx . body = await wx . jssdk . getSignature ( ctx . request . query . url ) ;
} ) ;
3. После получения подписи переходите к следующему шагу использования браузера.
const WechatJSSDK = require ( 'wechat-jssdk/dist/client.umd' ) ;
//ES6 import
import WechatJSSDK from 'wechat-jssdk/dist/client.umd' ;
//没有打包的话直接script扔到html,然后从`window`获取, e.g:
const wechatObj = new window . WechatJSSDK ( config )
config
должен быть:
const config = {
//前4个是微信验证签名必须的参数,第2-4个参数为类似上面 '/get-signature' 从node端获取的结果
'appId' : 'xxx' ,
'nonceStr' : 'xxx' ,
'signature' : 'xxx' ,
'timestamp' : 'xxx' ,
//下面为可选参数
'debug' : true , //开启 debug 模式
'jsApiList' : [ ] , //设置所有想要使用的微信jsapi列表, 默认值为 ['updateAppMessageShareData','updateTimelineShareData','onMenuShareTimeline', 'onMenuShareAppMessage'],分享到朋友圈及聊天记录
'customUrl' : '' //自定义微信js链接
}
const wechatObj = new WechatJSSDK ( config ) ;
wechatObj . initialize ( )
. then ( w => {
//set up your share info, "w" is the same instance as "wechatObj"
} )
. catch ( err => {
console . error ( err ) ;
} ) ;
После успешной проверки подписи вы можете настроить общий контент:
По умолчанию sdk регистрирует только
updateAppMessageShareData
,updateTimelineShareData
,onMenuShareTimeline(wx即将废弃)
,onMenuShareAppMessage(wx即将废弃)
//自定义分享到聊天窗口
//内部调用 `wechatObj.callWechatApi('updateAppMessageShareData', {...})`, 语法糖而已
wechatObj . updateAppMessageShareData ( {
type : 'link' ,
title : 'title' ,
link : location . href ,
imgUrl : '/logo.png' ,
desc : 'description' ,
success : function ( ) { } ,
fail : function ( ) { } ,
complete : function ( ) { } ,
cancel : function ( ) { }
} ) ;
//自定义分享到朋友圈
//语法糖
wechatObj . updateTimelineShareData ( {
type : 'link' ,
title : 'title' ,
link : location . href ,
imgUrl : '/logo.png'
} ) ;
Чтобы получить исходный объект WeChat wx
, вы можете получить его через wechatObj.getOriginalWx()
.
Если первая проверка не удалась, вы можете обновить информацию о подписи в обратном вызове error
и повторно отправить запрос на проверку:
wechatObj.signSignature(newSignatureConfig);
, newSignatureConfig
должен содержать только:
{
'nonceStr': 'xxx',
'signature': 'xxx',
'timestamp': 'xxx',
}
Вызов других интерфейсов WeChat:
wechatObj.callWechatApi(apiName, apiConfig)
apiName
и apiConfig
см. в официальной документации интерфейса WeChat.
URL-адреса авторизации WeChat по умолчанию — это wx.oauth.snsUserInfoUrl
и wx.oauth.snsUserBaseUrl
, а URL-адрес обратного вызова по умолчанию — это wechatRedirectUrl
настроенный в wechatConfig
. Вы также можете настроить обратный вызов, вызвав wx.oauth. generateOAuthUrl(customUrl, scope, state)
адрес
//callback url handler
//如"wechatRedirectUrl"配置为 "http://127.0.0.1/wechat/oauth-callback", 你的路由需要为:
router . get ( '/wechat/oauth-callback' , function ( req , res ) {
//得到code,获取用户信息
wx . oauth . getUserInfo ( req . query . code )
. then ( function ( userProfile ) {
console . log ( userProfile )
res . render ( "demo" , {
wechatInfo : userProfile
} ) ;
} ) ;
} ) ;
СОВЕТ: Убедитесь, что указанное выше доменное имя адреса перенаправления установлено в настройках авторизованного адреса обратного вызова в WeChat.
Установите card: true
в wechatConfig для поддержки серверной поддержки функций карт и купонов, см. демонстрацию.
Чтобы просмотреть API карт и купонов, обратитесь к API карточек.
Установите payment: true
в wechatConfig для поддержки серверной поддержки функции оплаты WeChat. Другие необходимые конфигурации для оплаты также необходимо настроить вместе.
Справочная демо-версия.
Чтобы просмотреть платежные API, обратитесь к платежным API.
Используйте серверную поддержку мини-программы (см. интерфейс) и задайте в конфигурации appId
и appSecret
мини-программы:
const { Wechat , MiniProgram } = require ( 'wechat-jssdk' ) ;
const wechatConfig = {
"appId" : "appid" ,
"appSecret" : "app_secret" ,
//...other configs
//...
//小程序配置
"miniProgram" : {
"appId" : "mp_appid" ,
"appSecret" : "mp_app_secret" ,
}
} ;
const wx = new Wechat ( wechatConfig ) ;
//调用小程序接口
wx . miniProgram . getSession ( 'code' ) ;
//手动实例化 MiniProgram
const miniProgram = new MiniProgram ( {
miniProgram : {
"appId" : "mp_appid" ,
"appSecret" : "mp_app_secret" ,
}
} )
Магазин используется для настройки сохранения токенов хранилища (например, файлов, баз данных и т. д.) и реализации собственного магазина. Ознакомьтесь с API.
Поставляется с магазином: FileStore
, MongoStore
, по умолчанию — FileStore
, хранится в файле wechat-info.json
.
Посмотреть вики API
После версии 3.1.0 на демонстрационную страницу добавлены тесты вариантов использования купонов и платежей. Скопируйте demo/wechat-config-sample.js
в demo/wechat-config.js
,
Затем измените appId
, appSecret
и другие конфигурации, например конфигурации оплаты, если вам нужно использовать функцию оплаты.
Задайте свои собственные appId
и appSecret
в ./demo/index.js
, затем npm start
или npm run dev
и используйте инструменты разработчика WeChat для тестирования.
Если вы считаете этот проект полезным, купите мне кофе
Массачусетский технологический институт @ Джейсон, 2016 – настоящее время