前后端进行分开开发：
1：后端实现获取
+++接口凭证：access_token （公众号的全局唯一接口调用凭据）
** GET 获取：https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET
+++接口票据：jsapi_ticket （ JS-SDK 配置签名票据）
** GET获取：https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi
2：进行字典URL键值对的格式排序（即key1=value1&key2=value2…）拼接成字符串
（微信配置签名以）
详情：#附录1-JS-SDK使用权限签名算法 https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115
后端实现了签名配置，前端调用后端提供的接口即可
注意：打开是在自己服务号配置好的域名形式打开：如 http://buy.shopline.com//html/index.html
在微信开发工具或是微信上，打开 便会提示 配置具体是否成功信息！
config:ok即表示完成配置，就可以调用 JS-SDK了，实现自己具体的想要的JS-SDK提供的接口！
//index.html
1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <meta charset="UTF-8"> 5 <meta http-equiv="pragma" content="no-cache"> 6 <meta http-equiv="cache-control" content="no-cache"> 7 <meta http-equiv="expires" content="0"> 8 <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0"> 9 <title>例子</title> 10 <link rel="icon" href="../images/public/favicon.ico" type="image/x-icon"> 11 </head> 12 <body> 13 14 <script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script> 15 <script src="http://apps.bdimg.com/libs/zepto/1.1.4/zepto.min.js"></script> 16 <script> 17 18 //配置 wx.config 19 //这一步配置成功的 20 21 $.ajax({ 22 url: '/config', 23 type: 'GET', 24 //必须进行 url 编码 25 //////////////////// 26 data: { 27 url: location.href.split('#')[0]//@todo 重要：后台需要获取签名使用 28 }, 29 dataType: 'json', 30 success: function (res) { 31 wx.config({ 32 beta: true, 33 debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。 34 appId: res.appid, // 必填，公众号的唯一标识 wx4943f6480a79a436 35 timestamp: res.timestamp, // 必填，生成签名的时间戳 36 nonceStr: res.nonceStr, // 必填，生成签名的随机串 37 signature: res.signature,// 必填，签名，见附录1 38 jsApiList: ['chooseInvoice', 'chooseCard'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2 39 }); 40 } 41 }); 42 43 44 wx.ready(function () { 45 //此处配置完成，根据自己需求进行接口是否配置完成调用 46 //wx.ready 如 document.ready 47 48 49 }); 50 51 52 </script> 53 </body> 54 </html>
只要这一步，成功了！下面干正事......