微信公众号H5页面开发--微信JS-SDK引用

微信公众号H5页面开发–微信JS-SDK引用

微信提供了微信公众号开发者手册，官方地址：https://mp.weixin.qq.com/

公众号内许多复杂的业务场景，都是通过网页形式来提供服务，这时需要用到： 微信JS-SDK。以地理位置接口为例进行阐述。

写在前面 非常重要！

• 微信公众号接口必须以http://或https://开头，分别支持80端口和443端口。
• 由于微信7.0版本升级了对https的安全限制，在微信7.0版本及以上版本使用http协议访问定位组件会导致定位失败。尤其是安卓，所以必须升级https。

1. 域名绑定

微信公众号请求网页授权之前，开发者需要先登记授权回调域名。
注意：这里填写的是域名，且为全域名。授权后该域名下的其他页面都可以授权，例如：www.qq.com为回调域名，配置以后此域名下面的页面http://www.qq.com/music.html 、 http://www.qq.com/login.html 都可以进行OAuth2.0鉴权。
官方：微信公众平台 >> 微信网页开发 >> 微信网页授权

2.js文件引入

官方：
在需要调用JS接口的页面引入如下JS文件，（支持https）：http://res.wx.qq.com/open/js/jweixin-1.4.0.js
如需进一步提升服务稳定性，当上述资源不可访问时，可改访问：http://res2.wx.qq.com/open/js/jweixin-1.4.0.js （支持https）。
备注：支持使用 AMD/CMD 标准模块加载方法加载

3.通过config接口注入权限验证配置信息

所有引用微信JS-SDK的页面都需要提供权限验证信息，否则无法调用。同样的URL只需要配置一次即可，URL发生变化时需要重新调用配置信息进行验证。

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

这里涉及到两类配置信息的获取，一类是appId所属的公众号标识类配置信息，另一类是签名。JS接口列表可以根据需求在微信公众平台附录中获取。这里所写的是两个地理接口的相关js接口：
jsApiList: ['openLocation','getLocation'] // 必填，需要使用的JS接口列表

1. 公众号标识
   微信提供了微信公众帐号测试号，绑定个人微信号即可使用。申请地址：https://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/login
   进入后，第一行就提供了appID和appsecret。不同微信号绑定的微信公众测试号提供的appID和appsecret不同，如果多人参与开发，要注意区分。

接口配置信息主要用于消息接口的配置。公众号是以微信用户的一个联系人形式存在的，消息会话是公众号与用户交互的基础。在这里填写的URL主要用于接收用户信息，进行业务操作后返回信息，没有单独的页面链接。如果不是H5开发的话这里可以空着不写。