Front page sweep the function call to the micro-channel. . . First, the browser environment for micro-channel built-in browser, you can call it micro-channel sweep swept away.
First need to reference micro-channel JS: <script src = "https://res.wx.qq.com/open/js/jweixin-1.2.0.js"> </ script>
<head> <meta charset="UTF-8"/> <title>扫描二维码</title> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=Yes" /> <script src="~/js/jquery1.7.2.js"></script> <script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script> </head>
Micro letter JS, is that we need to configure wx.config configuration when loading the JS
< Script > $ (the Document) .ready ( function () { wx.config ({ Debug: false , // turn on debug mode, all calls will alert api return values out of the client, to view the incoming parameters You can open the pc side, will play parameter information through log, will be printed only when the pc. appId: ' @ ViewBag.AppID ' , // required, a unique identification number of public timestamp: @ ViewBag.timestamp, / / required, generating a signature timestamp <% = the Html.Encode (the ViewData [ "timestamp"])%> nonceStr: ' @ ViewBag.nonceStr ' , // required, generating a signature random string signature: ' @ViewBag. Signature ', // Required signature jsApiList: [ ' scanQRCode ' ] // required, JS need to use the list of interfaces, where only sweep the call }); }); </ Script >
Talk about the timestamp, nonceStr, signature of these three parameters, how to get. .
timestamp: timestamp directly to the current timestamp on the line. Note: This is the corresponding time stamp and the signature, by the same time, you can not use the timestamp datetime.now, signature (signature) again took datetime.now. Signature will cause an error.
nonceStr: self-defined action string is generated signature
signature: signature of the micro-channel in accordance with a fixed rule to generate a timestamp, nonceStr: micro-channel rule in Appendix 1, the following description references the following documents developed micro-channel:
JS-SDK usage rights signature algorithm
jsapi_ticket
We must look at jsapi_ticket before generating the signature, jsapi_ticket temporary bill Enterprise micro-channel number to call for JS interface. Under normal circumstances, jsapi_ticket valid for 7200 seconds to get through access_token. Due to the number of api calls get jsapi_ticket very limited, frequently refreshed jsapi_ticket api calls will lead to limited impact of their business, the developer must own service global cache jsapi_ticket .
- Refer to the following documentation for access_token ( valid for 7200 seconds, the developer must access_token cache in their global service ): http://qydev.weixin.qq.com/wiki/index.php?title=%E4%B8%BB%E5 % 8A% A8% E8% B0 % 83% E7% 94% A8
- A first step to get the access_token using http GET way to request jsapi_ticket ( valid for 7200 seconds, the developer must cache jsapi_ticket in their global service ): https://qyapi.weixin.qq.com/cgi-bin/get_jsapi_ticket? access_token = ACCESS_TOKE
Successfully returned the following JSON:
{
"errcode":0,
"errmsg":"ok",
"ticket":"bxLdikRXVbTPdHSM05e5u5sUoXNKd8-41ZO3MhKoyN5OfkWITDGgnr2fwJ0m9E8NYzWKVZvdVtaUgWvsdshFKA",
"expires_in":7200
}
After obtaining jsapi_ticket, you can generate a signature JS-SDK validated the authority.
Signature Algorithm
The signature generation rules are as follows: Field participating signatures comprises noncestr (random string), effective jsapi_ticket, timestamp (timestamp), URL (the URL of the current page, and does not include # later). After all of the parameters to be signed in ascending order (lexicographical) the ASCII code field name, value pairs using the format of the URL (i.e., key1 = value1 & key2 = value2 ...) assembled into a string string1. It should be noted that all parameter names are lowercase characters. Sha1 encryption to make string1, field names and field values have adopted the original value, not URL escaped.
That signature = sha1 (string1). Examples
noncestr=Wm3WZYTPz0wzccnW jsapi_ticket=sM4AOVdWfPE4DxkXGEs8VMCPGGVi4C3VM0P37wVUCFvkVAy_90u5h9nbSlYy3-Sl-HhTdfl2fzFy1AOcHKP7qg timestamp=1414587457 url=http://mp.weixin.qq.com
Step 1. string1 the string to be signed parameters for all the ASCII code field name in ascending order (lexicographic) after (i.e. key1 = value1 & key2 = value2 ...) using the format of the URL of the key-splicing to:
jsapi_ticket=sM4AOVdWfPE4DxkXGEs8VMCPGGVi4C3VM0P37wVUCFvkVAy_90u5h9nbSlYy3-Sl-HhTdfl2fzFy1AOcHKP7qg&noncestr=Wm3WZYTPz0wzccnW×tamp=1414587457&url=http://mp.weixin.qq.com
Step 2. sha1 sign string1, get signature:
0f9de62fce790f9a083d5c99e95740ceb90c27ed
Precautions
- The noncestr signature and timestamp must be the same wx.config in nonceStr and timestamp.
- Url must be signed with the full URL to call the JS interface page.
- For security reasons, developers must implement logic signature on the server side.
Testing framework for the MVC, put up my own HTML:
@{ ViewBag.Title = "WxTest"; } <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"/> <title>扫描二维码</title> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=Yes" /> <script src="~/js/jquery1.7.2.js"></script> <script src= "https://res.wx.qq.com/open/js/jweixin-1.2.0.js" > </ Script > </ head > < body > < INPUT type = "Button" class = "Test" value = "micro sweep the letter" /> </ body > </ HTML > < Script > $ (Document) .ready ( function () { wx.config ({ debug: to false , // turn on debug mode, all calls api return value will alert the client came out, to see the incoming parameters, you can open the pc side, will play parameter information through log, will be printed only when the pc. appId:'@ViewBag.AppID' , // Required public identification number unique timestamp: ViewBag.timestamp @, @ required, generating a signature stamp <% = the Html.Encode (the ViewData [ "timestamp"])%> nonceStr: ' @ViewBag .nonceStr ' , // required, generating a signature random string signature: ' @ ViewBag.signature ' , // required signature jsApiList: [ ' scanQRCode ' ] // required, need to use the list of interfaces JS, here only sweep the need to call }); $ ( " .test " ).click ( function () { were UA= Navigator.userAgent.toLowerCase (); var isWeixin = ua.indexOf ( ' micromessenger ' ) ==! - . 1 ; IF ( ! IsWeixin) { Alert ( ' open connection with micro channel, in order to use sweep the ' ); } wx.scanQRCode ({ needResult: . 1 , // default is 0, processing scan results by the micro-channel, a direct return scan results, ScanType: [ " qrcode " ], // you can specify the scan two-dimensional code is one-dimensional code, default both have success:function (RES) { // scan code is successful, the two-dimensional code jump to a specified page (res.resultStr scan code returned for the results) // the location.href = res.resultStr; var Scan = res.resultStr; Alert (Scan ); }, error: function (RES) { IF (res.errMsg.indexOf ( ' function_not_exist ' ) > 0 ) { Alert ( ' the current version is too low, please upgrade ' ); } } }); }); }); </script>
The determining browser environment:
navigator.userAgent.toLowerCase UA = var ();
! = var isWeixin ua.indexOf ( 'micromessenger') == -1;
IF (! isWeixin) {
Alert ( 'open connection with micro channel, in order to use sweep the' );
}
After opening with a mobile phone micro letter:
Click effect, scan code using effects:
Forage generate two-dimensional code:
After scanning:
OK dimensional code to obtain the information in it is a jump page, or business logic, you can customize it