wechat jssdk Télécharger - wechat jssdk Téléchargement du code source

wechat-jssdk

Intégration WeChat JSSDK avec NodeJS et Web Intégration WeChat JS-SDK avec NodeJS et Web.

Anglais | Notes de version

Fonctions principales

?Serveur
?Côté navigateur
?Autorisation Web OAuth
?Coupons WeChat
?WeChat Payer
?Applet WeChat
?Utiliser les magasins
?Démo complète

Comment utiliser

npm install wechat-jssdk --save
# 或者
yarn add wechat-jssdk

 const { Wechat } = require ( 'wechat-jssdk' ) ;
const wx = new Wechat ( wechatConfig ) ;

Éléments de configuration Wechat

wechatConfig est au format suivant :

 {
  //第一个为设置网页授权回调地址
  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" ,
  }
}

Les autres paramètres pris en charge ont des valeurs par défaut, qui sont essentiellement les adresses de l'API WeChat et ne changeront pas. Vous pouvez vérifier ./lib/config.js .

Configurer l'environnement WeChat

1. Accédez à la plateforme publique WeChat

Téléchargez un fichier comme MP_verify_XHZon7GAGRdcAFxx.txt et placez-le dans le répertoire racine du site Web, tel que http://yourdomain.com/MP_verify_XHZon7GAGRdcAFxx.txt . WeChat vérifiera le lien.

2. Fournissez ensuite une interface dans votre application express/koa pour que le navigateur obtienne les informations de vérification, @see démo

 //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. Après avoir obtenu la signature, passez à l'étape suivante d'utilisation du navigateur.

Côté navigateur

 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 devrait être :

 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 ) ;
  } ) ;

Après avoir vérifié avec succès la signature, vous pouvez personnaliser votre contenu de partage :

Par défaut, le SDK enregistre uniquement updateAppMessageShareData , updateTimelineShareData , onMenuShareTimeline(wx即将废弃) et 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'
} ) ;

Pour obtenir l'objet WeChat original wx , vous pouvez l'obtenir via wechatObj.getOriginalWx() .
Si la première vérification échoue, vous pouvez mettre à jour les informations de signature dans error et renvoyer la demande de vérification :
wechatObj.signSignature(newSignatureConfig); , newSignatureConfig doit uniquement contenir :

 {
  'nonceStr': 'xxx',
  'signature': 'xxx',
  'timestamp': 'xxx',
}

Appelez d'autres interfaces WeChat :
wechatObj.callWechatApi(apiName, apiConfig)
apiName et apiConfig veuillez vous référer à la documentation officielle de l'interface WeChat.

OAuth

Les URL d'autorisation WeChat générées par défaut sont wx.oauth.snsUserInfoUrl et wx.oauth.snsUserBaseUrl , et l'URL de rappel par défaut est wechatRedirectUrl configurée dans wechatConfig . Vous pouvez également personnaliser le rappel en appelant wx.oauth. generateOAuthUrl(customUrl, scope, state) adresse

 //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
            } ) ;
          } ) ;
} ) ;

CONSEIL : assurez-vous que le nom de domaine de l'adresse de redirection ci-dessus a été défini dans les paramètres d'adresse de rappel autorisée dans WeChat.

Coupons WeChat

Définir card: true dans wechatConfig pour prendre en charge la prise en charge côté serveur des fonctions de carte et de coupon, reportez-vous à la démo.
Pour afficher les API des cartes et des coupons, reportez-vous aux API des cartes.

Paiement WeChat

Définir payment: true dans wechatConfig pour prendre en charge la prise en charge côté serveur de la fonction de paiement WeChat. D'autres configurations nécessaires au paiement doivent également être définies ensemble.
Démo de référence.
Pour afficher les API de paiement, reportez-vous aux API de paiement

Mini-programme

Utilisez le support côté serveur du mini programme (voir l'interface) et définissez appId et appSecret du mini programme dans la configuration :

 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" ,
  }
} )

Utiliser les magasins

Store est utilisé pour personnaliser la persistance des jetons de stockage (tels que les fichiers, les bases de données, etc.) et implémenter votre propre Store. Veuillez consulter l'API.
Livré avec Store : FileStore , MongoStore , la valeur par défaut est FileStore , stockée dans le fichier wechat-info.json .

Apis

Afficher le wiki de l'API

Démo

Après la v3.1.0, la page de démonstration ajoute des tests de cas d'utilisation pour les coupons et les paiements, copiez demo/wechat-config-sample.js dans demo/wechat-config.js ,
Modifiez ensuite appId , appSecret et d'autres configurations telles que les configurations de paiement si vous devez utiliser la fonction de paiement.

Définissez vos propres appId et appSecret dans ./demo/index.js , puis npm start ou npm run dev et utilisez les outils de développement WeChat pour tester.