`

微信JSSDK接口 - 接口配置

 
阅读更多

微信JS-SDK说明文档:https://mp.weixin.qq.com/wiki/11/74ad127cc054f6b80759c40f77ec03db.html

 

步骤一:绑定域名

              登录微信公众平台,进入“公众号设置”下的“功能设置”,绑定“JS接口安全域名”,如果使用支付类接口,先确保支付目录在该安全域名下。

 

步骤二:引入JS文件

              在需要调用JS接口的页面引入JS文件:http://res.wx.qq.com/open/js/jweixin-1.0.0.js

              如果页面启用了https协议,还需引入:https://res.wx.qq.com/open/js/jweixin-1.0.0.js,否则无法在iOS9.0以上系统中使用JSSDK。 

 

步骤三:通过config接口注入权限验证配置

              在用户使用微信接口之前,微信平台需要对用户进行权限验证。

wx.config({
    debug: true,   // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数
    appId: '',     // 必填,公众号的唯一标识
    timestamp: ,   // 必填,生成签名的时间戳
    nonceStr: '',  // 必填,生成签名的随机串
    signature: '', // 必填,签名
    jsApiList: []  // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
});

    其中,appId可从微信公众平台的”基本配置“中获取,timestamp、nonceStr、signature按照规则获取,具体步骤参照:http://hellolove.iteye.com/blog/2327557

 

步骤四:通过ready接口处理成功验证

 

wx.ready(function(){
    // config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后
    // config是一个客户端的异步操作
    // 对于页面加载时就需要调用接口的操作,则需要把相关接口放在ready函数中以确保正确执行;
    // 对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
});

 

步骤五:通过error 接口处理失败验证

 

wx.error(function(res){
    // config信息验证失败会执行error函数
    // 如签名过期导致验证失败,具体错误信息可在debug模式下查看,也可以在返回的res参数中查看
});

 

 
分享到:
评论

相关推荐

    微信JSSDK-PHP版,分享朋友圈分享朋友DEMO,js-weixin-1.4.0版,有使用说明

    1. **微信JSSDK**:JSSDK提供了多种功能接口,包括获取微信用户基本信息、分享、扫一扫、支付、地理位置、摇一摇等。通过在网页中引入JSSDK的JS库,并配置好对应的接口权限,可以实现丰富的交互体验。 2. **PHP后端...

    详解vue中使用微信jssdk

    jsApiList属性是用户需要使用的微信JSSDK接口列表,当开发者需要使用某个接口时,需要在列表中声明,否则无法调用该接口。如果调用的接口没有在jsApiList中声明,微信会报错提示未授权。 当以上配置都正确无误后,...

    微信jssdk+java版+jsp源码

    微信开发入门教程 jssdk,通过config接口注入权限验证配置java+jsp微信开发教程,功能:扫描二维码,拍照、本地选图,图片预览,上传图片,下载图片,获取当前网络状态,查看地理位置,获取当前地理位置打开地图,...

    jQuery+ashx配置使用微信jssdk调用分享扫一扫接口

    使用ajax+ashx配置微信jssdk,调用分享接口,微信扫一扫接口示例

    asp版的微信JSSDK

    在jssdk_config.asp中,你需要根据当前页面的具体需求,选择要使用的JSSDK接口,并生成config配置。config包括appId、timestamp、nonceStr、signature这四个必须参数,以及可选的jsApiList,表示需要使用的JS接口...

    微信JSSDK实例

    4. 调用微信JSSDK提供的接口,如`wx.ready`监听SDK加载成功事件,`wx.error`处理错误信息。 5. 根据需求,使用相应的接口实现分享、图片选取、语音识别等功能。 在实际开发过程中,开发者还需要注意微信JSSDK的权限...

    springboot-wexin史上最全接入微信JSSDK菜鸟教程

    创建了WxInitController,提供了初始化微信JSSDK配置信息的接口。 处理获取分享URL的请求,并调用服务层方法来初始化微信JSSDK配置。 3.微信服务层: WxService负责业务逻辑处理,包括获取微信AccessToken、...

    微信jssdk在iframe页面失效问题的解决措施

    微信jssdk的使用依赖于微信客户端的签名验证,而微信客户端会检测调用页面的域名是否与配置的合法域名一致。在iframe中使用jssdk,可能不会通过这种合法域名的校验,因为它被视为一个嵌入页面,而非微信客户端直接...

    thinkPHP微信分享接口JSSDK用法实例

    完成以上步骤后,你需要在前端页面中引入微信JSSDK,并进行配置。主要步骤如下: 1. 引入微信JSSDK的库文件:在HTML页面的部分,插入微信JSSDK的CDN链接。 2. 初始化JSSDK:在页面加载完成后,使用获取到的jsapi_...

    Java微信公众平台开发(13) 微信JSSDK中Config配置

    主要为大家详细介绍了Java微信公众平台开发第十三步,微信JSSDK中Config配置,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

    Vue 应用中结合vux使用微信 jssdk的方法

    vux微信分享说明 分享接口只有认证公众号才能使用,域名必须备案且在微信后台设置。 先确认已经满足使用jssdk的要求再进行开发。...jssdk需要请求签名配置接口,你可以直接使用 VUX 基于 Axios 封装的 AjaxPlugin

    weixin-jssdk-flask:简单的微信 jssdk 服务器端实现 with Flask

    4. **配置 JSSDK**:将生成的 signature、nonceStr、timestamp 以及 jsapi_ticket 返回给前端,前端根据这些信息配置 JSSDK,然后就可以在网页上使用微信的特定功能了。 在 "weixin-jssdk-flask" 项目中,你可以...

    微信支付 jssdk 微支付

    2. **初始化JSSDK**:在网页中引入微信JSSDK的JS文件,并通过`wx.config()`方法配置必要的参数,如appID、timestamp、nonceStr、signature等,这些参数都需要通过服务器动态获取,以防止被篡改。 3. **支付接口调用...

    微信jssdk开发java+jsp源码

    微信开发入门教程 jssdk,通过config接口注入权限验证配置java+jsp微信开发教程,功能:扫描二维码,拍照、本地选图,图片预览,上传图片,下载图片,获取当前网络状态,查看地理位置,获取当前地理位置打开地图,...

    关于微信jssdk实现多图片上传的一点心得分享

    首先在common.js里封装一个函数,在需要调用jsSDK的页面引用此方法即可实现微信的信息配置 function signatureJSSDK() { var url = [removed].href.split('#')[0];//后台需要此页面的url来生成参数 $.ajax({ ...

    php微信分享jssdk

    4. **生成签名(Signature)**:微信JSSDK要求每个页面加载时,必须提供一个由当前URL、nonceStr(随机字符串)、timestamp(时间戳)、jsapi_ticket(JSAPI Ticket)生成的签名,用于安全验证。 5. **配置JSSDK**:...

    微信开发之微信jssdk录音功能开发示例

    首先,我们需要引入微信JSSDK并进行配置。在项目中,我们需要在HTML页面中引入微信JSSDK的JS文件,并在页面加载完成后调用微信的`wx.config`方法进行配置,确保JSSDK能够正常工作。配置时需要提供包括AppID、...

    jssdk所有接口的源码,官方实例

    jssdk源码,部分功能需要配置你自己公号的appid、域名等信息才可以用,比如拍照,视频等

    二维码和JS微信支付功能-已测试

    这个标识随后会传递给前端,前端通过微信JSSDK将标识转化为一个支付按钮,用户点击按钮后,微信支付H5页面弹出,用户确认支付信息并完成支付。 实现这两种支付功能,都需要在`lib/WxPayConfig`配置微信账户的相关...

Global site tag (gtag.js) - Google Analytics