wechat jssdk 다운로드 - wechat jssdk 소스 코드 다운로드

wechat-jssdk

NodeJS 및 웹과 WeChat JSSDK 통합 NodeJS 및 웹과 WeChat JS-SDK 통합.

한국어 |

주요 기능

?섬기는 사람
?브라우저 측
?OAuth 웹 인증
?위챗 쿠폰
?위챗페이
?위챗 애플릿
?매장 이용
?전체 데모

사용방법

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

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

Wechat 구성 항목

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

기타 지원되는 설정에는 기본적으로 WeChat API의 주소인 기본값이 있으며 변경되지 않습니다. ./lib/config.js 확인할 수 있습니다.

WeChat 환경 설정

1. 위챗 공개 플랫폼으로 이동

MP_verify_XHZon7GAGRdcAFxx.txt 와 같은 파일을 다운로드하여 웹사이트의 루트 디렉터리(예: http://yourdomain.com/MP_verify_XHZon7GAGRdcAFxx.txt )에 넣으면 WeChat이 링크를 확인합니다.

2. 그런 다음 브라우저가 확인 정보를 얻을 수 있도록 express/koa 앱에 인터페이스를 제공합니다. @see 데모

 //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 공식 인터페이스 문서를 참조하세요.

OAuth

기본적으로 생성된 WeChat 인증 URL은 wx.oauth.snsUserInfoUrl 및 wx.oauth.snsUserBaseUrl 이며, 기본 콜백 URL은 wechatConfig 에 구성된 wechatRedirectUrl 입니다. wx.oauth. generateOAuthUrl(customUrl, scope, state) 호출하여 콜백을 사용자 정의할 수도 있습니다. 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 설정하면 카드 및 쿠폰 기능에 대한 서버 측 지원을 지원합니다. 데모를 참조하세요.
카드 및 쿠폰 API를 보려면 카드 api를 참조하세요.

위챗페이

payment: true 결제에 필요한 기타 구성도 함께 설정해야 합니다.
참조 데모.
결제 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를 확인하세요.
Store와 함께 제공: FileStore , MongoStore , 기본값은 FileStore 이며 wechat-info.json 파일에 저장됩니다.

아피스

API 위키 보기

데모

v3.1.0 이후 데모 페이지에는 쿠폰 및 결제에 대한 사용 사례 테스트가 추가되었습니다. demo/wechat-config-sample.js demo/wechat-config.js 에 복사하세요.
그런 다음 결제 기능을 사용해야 하는 경우 appId , appSecret 및 결제 구성과 같은 기타 구성을 수정합니다.

./demo/index.js 에서 자신만의 appId 및 appSecret 설정한 다음 npm start 또는 npm run dev 실행하고 WeChat 개발자 도구를 사용하여 테스트하세요.