# 接口权限配置 使用 `wx.config` 进行接口权限配置。 ```js wx.config({ debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。 appId: parm.appId, // 必填，公众号的唯一标识 timestamp: parm.timestamp, // 必填，生成签名的时间戳 nonceStr: parm.nonceStr, // 必填，生成签名的随机串 signature: parm.signature , // 必填，签名 jsApiList: [] // 必填，需要使用的JS接口列表 }) ``` ## 1 获取配置参数 其中 `timestamp` 是当前时间戳， `nonceStr` 是一段随机字串，可以自定义。 ### 1.1 获取 AppID 其中 AppID 从左边菜单的"**开发 - 基本配置 - 公众号开发信息**" 中可以看到: :-:  ### 1.2 获取 signature 要获取 `signature` ，首先得生成一个 `access_token`。 #### 1.2.1 获取 access_token access_token是公众号的全局唯一接口调用凭据，公众号调用各接口时都需使用access_token。开发者需要进行妥善保存。access_token的存储至少要保留512个字符空间。access_token的有效期目前为2个小时，需定时刷新，重复获取将导致上次获取的access_token失效。 获取地址: ``` https 请求方式 : GET https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET ``` 打开 https://mp.weixin.qq.com/debug 进行调试获取 access_token，输入自己的 `AppID` 和 `AppSecret` 即可: :-:  获取`access_token`之前需要在白名单中添加自己的IP，否则将无法调用成功。 具体操作为: 打开 "**开发 - 基本设置 - 公众号开发信息**" 进行设置: :-:  参考阅读: https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421140183 #### 1.2.2 获取 jsapi_ticket 生成签名之前必须先了解一下jsapi_ticket，jsapi_ticket是公众号用于调用微信JS接口的临时票据。正常情况下，jsapi_ticket的有效期为7200秒，通过access_token来获取。由于获取jsapi_ticket的api调用次数非常有限，频繁刷新jsapi_ticket会导致api调用受限，影响自身业务，开发者必须在自己的服务全局缓存jsapi_ticket 。 获取地址: ``` https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi ``` 获取成功返回的大概是这样 :-:  可以看到，已经拿到门票了 (ticket) #### 1.2.3 生成 signature 签名生成规则如下：参与签名的字段包括noncestr（随机字符串）, 有效的jsapi_ticket, timestamp（时间戳）, url（当前网页的URL，不包含#及其后面部分） 。对所有待签名参数按照字段名的ASCII 码从小到大排序（字典序）后，使用URL键值对的格式（即key1=value1&key2=value2…）拼接成字符串string1。这里需要注意的是所有参数名均为小写字符。对string1作sha1加密，字段名和字段值都采用原始值，不进行URL 转义。 即signature=sha1(string1)。 示例： ``` noncestr=Wm3WZYTPz0wzccnW jsapi_ticket=sM4AOVdWfPE4DxkXGEs8VMCPGGVi4C3VM0P37wVUCFvkVAy_90u5h9nbSlYy3-Sl-HhTdfl2fzFy1AOcHKP7qg timestamp=1414587457 url=http://mp.weixin.qq.com?params=value ``` 步骤1. 对所有待签名参数按照字段名的ASCII 码从小到大排序（字典序）后，使用URL键值对的格式（即key1=value1&key2=value2…）拼接成字符串string1： ``` jsapi_ticket=sM4AOVdWfPE4DxkXGEs8VMCPGGVi4C3VM0P37wVUCFvkVAy_90u5h9nbSlYy3-Sl-HhTdfl2fzFy1AOcHKP7qg&noncestr=Wm3WZYTPz0wzccnW×tamp=1414587457&url=http://mp.weixin.qq.com?params=value ``` 步骤2. 对string1进行sha1签名，得到signature： ``` 0f9de62fce790f9a083d5c99e95740ceb90c27ed ``` #### 1.2.4 注意事项 1. 签名用的noncestr和timestamp必须与wx.config中的nonceStr和timestamp相同。 2. 签名用的url必须是调用JS接口页面的完整URL。 3. 出于安全考虑，开发者必须在服务器端实现签名的逻辑。 ### 1.3 错误解决 如出现invalid signature 等错误请参看以下解决办法: 调用config 接口的时候传入参数 debug: true 可以开启debug模式，页面会alert出错误信息。以下为常见错误及解决方法： 1. invalid url domain当前页面所在域名与使用的appid没有绑定，请确认正确填写绑定的域名，仅支持80（http）和443（https）两个端口，因此不需要填写端口号。 2. invalid signature签名错误。建议按如下顺序检查： 1. 确认签名算法正确，可用http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=jsapisign 页面工具进行校验。 2. 确认config中nonceStr（js中驼峰标准大写S）, timestamp与用以签名中的对应noncestr, timestamp一致。 3. 确认url是页面完整的url(请在当前页面alert(location.href.split('#')[0])确认)，包括'http(s)://'部分，以及'？'后面的GET参数部分,但不包括'#'hash后面的部分。 4. 确认 config 中的 appid 与用来获取 jsapi_ticket 的 appid 一致。 5. 确保一定缓存access_token和jsapi_ticket。 6. 确保你获取用来签名的url是动态获取的，动态页面可参见实例代码中php的实现方式。如果是html的静态页面在前端通过ajax将url传到后台签名，前端需要用js获取当前页面除去'#'hash部分的链接（可用location.href.split('#')[0]获取,而且需要encodeURIComponent），因为页面一旦分享，微信客户端会在你的链接末尾加入其它参数，如果不是动态获取当前链接，将导致分享后的页面签名失败。 3. the permission value is offline verifying这个错误是因为config没有正确执行，或者是调用的JSAPI没有传入config的jsApiList参数中。建议按如下顺序检查： 1. 确认config正确通过。 2. 如果是在页面加载好时就调用了JSAPI，则必须写在wx.ready的回调中。 3. 确认config的jsApiList参数包含了这个JSAPI。 4. permission denied该公众号没有权限使用这个JSAPI，或者是调用的JSAPI没有传入config的jsApiList参数中（部分接口需要认证之后才能使用）。 5. function not exist当前客户端版本不支持该接口，请升级到新版体验。 6. 为什么6.0.1版本config:ok，但是6.0.2版本之后不ok（因为6.0.2版本之前没有做权限验证，所以config都是ok，但这并不意味着你config中的签名是OK的，请在6.0.2检验是否生成正确的签名以保证config在高版本中也ok。） 7. 在iOS和Android都无法分享（请确认公众号已经认证，只有认证的公众号才具有分享相关接口权限，如果确实已经认证，则要检查监听接口是否在wx.ready回调函数中触发） 8. 服务上线之后无法获取jsapi_ticket，自己测试时没问题。（因为access_token和jsapi_ticket必须要在自己的服务器缓存，否则上线后会触发频率限制。请确保一定对token和ticket做缓存以减少2次服务器请求，不仅可以避免触发频率限制，还加快你们自己的服务速度。目前为了方便测试提供了1w的获取量，超过阀值后，服务将不再可用，请确保在服务上线前一定全局缓存access_token和jsapi_ticket，两者有效期均为7200秒，否则一旦上线触发频率限制，服务将不再可用）。 9. uploadImage怎么传多图（目前只支持一次上传一张，多张图片需等前一张图片上传之后再调用该接口） 10. 没法对本地选择的图片进行预览（chooseImage接口本身就支持预览，不需要额外支持） 11. 通过a链接(例如先通过微信授权登录)跳转到b链接，invalid signature签名失败（后台生成签名的链接为使用jssdk的当前链接，也就是跳转后的b链接，请不要用微信登录的授权链接进行签名计算，后台签名的url一定是使用jssdk的当前页面的完整url除去'#'部分） 12. 出现config:fail错误（这是由于传入的config参数不全导致，请确保传入正确的appId、timestamp、nonceStr、signature和需要使用的jsApiList） 13. 如何把jsapi上传到微信的多媒体资源下载到自己的服务器（请参见文档中uploadVoice和uploadImage接口的备注说明） 14. Android通过jssdk上传到微信服务器，第三方再从微信下载到自己的服务器，会出现杂音（微信团队已经修复此问题，目前后台已优化上线） 15. 绑定父级域名，是否其子域名也是可用的（是的，合法的子域名在绑定父域名之后是完全支持的） 16. 在iOS微信6.1版本中，分享的图片外链不显示，只能显示公众号页面内链的图片或者微信服务器的图片，已在6.2中修复 17. 是否需要对低版本自己做兼容（jssdk都是兼容低版本的，不需要第三方自己额外做更多工作，但有的接口是6.0.2新引入的，只有新版才可调用） 18. 该公众号支付签名无效，无法发起该笔交易（请确保你使用的jweixin.js是官方线上版本，不仅可以减少用户流量，还有可能对某些bug进行修复，拷贝到第三方服务器中使用，官方将不对其出现的任何问题提供保障，具体支付签名算法可参考 JSSDK微信支付一栏） 19. 目前Android微信客户端不支持pushState的H5新特性，所以使用pushState来实现web app的页面会导致签名失败，此问题已在Android6.2中修复 20. uploadImage在chooseImage的回调中有时候Android会不执行，Android6.2会解决此问题，若需支持低版本可以把调用uploadImage放在setTimeout中延迟100ms解决 21. require subscribe错误说明你没有订阅该测试号，该错误仅测试号会出现 22. getLocation返回的坐标在openLocation有偏差，因为getLocation返回的是gps坐标，openLocation打开的腾讯地图为火星坐标，需要第三方自己做转换，6.2版本开始已经支持直接获取火星坐标 23. 查看公众号（未添加）: "menuItem:addContact"不显示，目前仅有从公众号传播出去的链接才能显示，来源必须是公众号 24. ICP备案数据同步有一天延迟，所以请在第二日绑定 ## 2 使用PHP获取签名 这里的示例使用PHP获取签名 ```php <?php /** * Author: helen * CreateTime: 2016/4/11 10:39 * description: 微信页面授权--(JS-SDK使用权限签名算法) */ class JSSDK{ private $appId; private $appSecret; public function __construct($appId, $appSecret) { $this->appId = $appId; $this->appSecret = $appSecret; } /* * 获取access_token * (需要缓存，可利用数据库存储,不要频繁刷新获取) * http请求方式: GET https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET * 接口请求参数 * 参数 是否必须 说明 grant_type 是 获取access_token填写client_credential appid 是 第三方用户唯一凭证 secret 是 第三方用户唯一凭证密钥，即appsecret * 接口返回说明 * {"access_token":"ACCESS_TOKEN","expires_in":7200} access_token 获取到的凭证 expires_in 凭证有效时间，单位：秒 * 接口错误说明 * {"errcode":40013,"errmsg":"invalid appid"} * */ private function getAccessToken(){ $appId = $this->appId; $appSecret = $this->appSecret; $url = 'https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid='.$appId.'&secret='.$appSecret; $res = $this->api_request($url); if(isset($res->access_token)){ return array( 'errcode' =>0, 'errmsg' =>'success', 'access_token' =>$res->access_token, 'expires_in' =>$res->expires_in ); }else{ return array( 'errcode' =>$res->errcode, 'errmsg' =>$res->errmsg, 'access_token' =>null, 'expires_in' =>null ); } } /* * 获取jsapi_ticket * （有效期7200秒，开发者必须在自己的服务全局缓存jsapi_ticket） * 请求方式：https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi * 接口返回值：JSON * { "errcode":0, "errmsg":"ok", "ticket":"bxLdikRXVbTPdHSM05e5u5sUoXNKd8-41ZO3MhKoyN5OfkWITDGgnr2fwJ0m9E8NYzWKVZvdVtaUgWvsdshFKA", "expires_in":7200 } * */ private function getJsApiTicket(){ $access_token_data = $this->getAccessToken(); if($access_token_data['errcode']==0){ $access_token = $access_token_data['access_token']; $url = 'https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token='.$access_token.'&type=jsapi'; $res = $this->api_request($url); if($res->errcode==0){ return array( 'errcode' =>$res->errcode, 'errmsg' =>$res->errmsg, 'ticket' =>$res->ticket, 'expires_in' =>$res->expires_in ); }else{ return array( 'errcode' =>$res->errcode, 'errmsg' =>$res->errmsg, 'ticket' =>null, 'expires_in' =>null ); } }else{ return array( 'errcode' =>$access_token_data['errcode'], 'errmsg' =>$access_token_data['errmsg'], 'ticket' =>null, 'expires_in' =>null ); } } /* * 签名算法 * 签名生成规则如下：参与签名的字段包括noncestr（随机字符串）, 有效的jsapi_ticket, timestamp（时间戳）, url（当前网页的URL，不包含#及其后面部分） 。 * 1、对所有待签名参数按照字段名的ASCII 码从小到大排序（字典序）后， * 2、使用URL键值对的格式（即key1=value1&key2=value2…）拼接成字符串string1。 * 这里需要注意的是所有参数名均为小写字符。对string1作sha1加密，字段名和字段值都采用原始值，不进行URL 转义。 * */ /* * 获取随机字符串 * mt_rand() 使用 Mersenne Twister 算法返回随机整数。 * mt_rand(min,max)如果没有提供可选参数 min 和 max，mt_rand() 返回 0 到 RAND_MAX 之间的伪随机数。 * 想要 5 到 15（包括 5 和 15）之间的随机数，用 mt_rand(5, 15)。 * 此函数rand()快四倍 * */ /* * 1.签名用的noncestr和timestamp必须与wx.config中的nonceStr和timestamp相同。 * 2.签名用的url必须是调用JS接口页面的完整URL。 * 3.出于安全考虑，开发者必须在服务器端实现签名的逻辑。 * 注意： * 确保你获取用来签名的url是动态获取的，动态页面可参见实例代码中php的实现方式。 * 如果是html的静态页面在前端通过ajax将url传到后台签名，前端需要用js获取当前页面除去'#'hash部分的链接（可用location.href.split('#')[0]获取,而且需要encodeURIComponent）， * 因为页面一旦分享，微信客户端会在你的链接末尾加入其它参数，如果不是动态获取当前链接，将导致分享后的页面签名失败。 * */ public function getSignPackage() { $jsapiTicket_data = $this->getJsApiTicket(); $nonceStr = $this->getNonceStr(); $timestamp = time(); $url = $this->getUrl(); if($jsapiTicket_data['errcode']==0){ $jsapiTicket = $jsapiTicket_data['ticket']; // 这里参数的顺序要按照 key 值 ASCII 码升序排序 $string = "jsapi_ticket=$jsapiTicket&noncestr=$nonceStr&timestamp=$timestamp&url=$url"; $signature = sha1($string); return array( "appId" => $this->appId, "nonceStr" => $nonceStr, "timestamp" => $timestamp, "url" => $url, "signature" => $signature, "rawString" => $string, "errcode" => $jsapiTicket_data['errcode'], "errmsg" => $jsapiTicket_data['errmsg'] ); }else{ return array( "appId" => $this->appId, "nonceStr" => $nonceStr, "timestamp" => $timestamp, "url" => $url, "signature" => null, "rawString" => null, "errcode" => $jsapiTicket_data['errcode'], "errmsg" => $jsapiTicket_data['errmsg'] ); } } /* * 获取nonceStr * */ private function getNonceStr($length = 16) { $chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789"; $nonceStr = ""; for ($i = 0; $i < $length; $i++) { $nonceStr .= substr($chars, mt_rand(0, strlen($chars) - 1), 1); } return $nonceStr; } /* * 获取url * url（当前网页的URL，不包含#及其后面部分） * */ private function getUrl(){ $protocol = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off' || $_SERVER['SERVER_PORT'] == 443) ? "https://" : "http://"; $url = "$protocol$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]"; return $url; } /* * 微信API调用方法 * */ private function api_request($url,$data=null){ //初始化cURL方法 $ch = curl_init(); //设置cURL参数（基本参数） $opts = array( //在局域网内访问https站点时需要设置以下两项，关闭ssl验证！ //此两项正式上线时需要更改（不检查和验证认证） CURLOPT_SSL_VERIFYPEER => false, CURLOPT_SSL_VERIFYHOST => false, CURLOPT_TIMEOUT => 500, CURLOPT_RETURNTRANSFER => true, CURLOPT_URL => $url, ); curl_setopt_array($ch, $opts); //post请求参数 if (!empty($data)) { curl_setopt($ch, CURLOPT_POST, true); curl_setopt($ch, CURLOPT_POSTFIELDS, $data); } //执行cURL操作 $output = curl_exec($ch); if (curl_errno($ch)) { //cURL操作发生错误处理。 var_dump(curl_error($ch)); die; } //关闭cURL curl_close($ch); $res = json_decode($output); return ($res); //返回json数据 } } ``` 参考资料: http://blog.csdn.net/helencoder/article/details/51121718 ## 3 所有JS接口列表 以下接口可以配置到 wx.config 中的 jsApiList 参数，必须配置相应的接口才能使用对应的功能: ``` onMenuShareTimeline onMenuShareAppMessage onMenuShareQQ onMenuShareWeibo onMenuShareQZone startRecord stopRecord onVoiceRecordEnd playVoice pauseVoice stopVoice onVoicePlayEnd uploadVoice downloadVoice translateVoice chooseImage previewImage uploadImage downloadImage getNetworkType openLocation getLocation hideOptionMenu showOptionMenu hideMenuItems showMenuItems hideAllNonBaseMenuItem showAllNonBaseMenuItem closeWindow scanQRCode chooseWXPay openProductSpecificView addCard chooseCard openCard ```