微信開(kāi)發(fā)中，經(jīng)常有這樣的需求：獲得用戶頭像、綁定微信號(hào)給用戶發(fā)信息.. 那么實(shí)現(xiàn)這些的前提就是授權(quán)！

1.配置安全回調(diào)域名：

?

在微信公眾號(hào)請(qǐng)求用戶網(wǎng)頁(yè)授權(quán)之前，開(kāi)發(fā)者需要先到公眾平臺(tái)官網(wǎng)中的“開(kāi)發(fā) - 接口權(quán)限 - 網(wǎng)頁(yè)服務(wù) - 網(wǎng)頁(yè)帳號(hào) - 網(wǎng)頁(yè)授權(quán)獲取用戶基本信息”的配置選項(xiàng)中，修改授權(quán)回調(diào)域名，值得注意的是這里就是直接寫全域名，如： www.liliangel.cn。然而我們開(kāi)發(fā)h5中一般用的是二級(jí)域名，如：h5.liliangel.cn 也同樣在安全回調(diào)域名中。

2.用戶級(jí)授權(quán)和靜默授權(quán)

1、以snsapi_base為scope發(fā)起的網(wǎng)頁(yè)授權(quán)，是用來(lái)獲取進(jìn)入頁(yè)面的用戶的openid的，并且是靜默授權(quán)并自動(dòng)跳轉(zhuǎn)到回調(diào)頁(yè)的。用戶感知的就是直接進(jìn)入了回調(diào)頁(yè)。2、以snsapi_userinfo為scope發(fā)起的網(wǎng)頁(yè)授權(quán)，是用來(lái)獲取用戶的基本信息的。但這種授權(quán)需要用戶手動(dòng)同意，并且由于用戶同意過(guò)，所以無(wú)須關(guān)注，就可在授權(quán)后獲取該用戶的基本信息。?

3.網(wǎng)頁(yè)授權(quán)access_token和普通access_token的區(qū)別

1、微信網(wǎng)頁(yè)授權(quán)是通過(guò)OAuth2.0機(jī)制實(shí)現(xiàn)的，在用戶授權(quán)給公眾號(hào)后，公眾號(hào)可以獲取到一個(gè)網(wǎng)頁(yè)授權(quán)特有的接口調(diào)用憑證（網(wǎng)頁(yè)授權(quán)access_token），通過(guò)網(wǎng)頁(yè)授權(quán)access_token可以進(jìn)行授權(quán)后接口調(diào)用，如獲取用戶基本信息；?2、其他微信接口，需要通過(guò)基礎(chǔ)支持中的“獲取access_token”接口來(lái)獲取到的普通access_token調(diào)用。?

4.引導(dǎo)用戶進(jìn)入授權(quán)頁(yè)面同意授權(quán)，獲取code?

?

微信更新后，授權(quán)頁(yè)也變化了。其實(shí)習(xí)慣了綠色的那個(gè)經(jīng)典頁(yè)面..

js：

var center = {init: function(){.....},enterWxAuthor: function(){var wxUserInfo = localStorage.getItem("wxUserInfo");if (!wxUserInfo) {var code = common.getUrlParameter('code');if (code) {common.getWxUserInfo();center.init();}else{//沒(méi)有微信用戶信息，沒(méi)有授權(quán)-->> 需要授權(quán)，跳轉(zhuǎn)授權(quán)頁(yè)面window.location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid='+ WX_APPID +'&redirect_uri='+ window.location.href +'&response_type=code&scope=snsapi_userinfo#wechat_redirect';}}else{center.init();}} } $(document).ready(function() { center.enterWxAuthor(); }

?

以scope=snsapi_userinfo為例，頁(yè)面加載的時(shí)候進(jìn)入授權(quán)方法，首先從緩存獲取wxUserInfo對(duì)象，如果有說(shuō)明之前已經(jīng)授權(quán)過(guò)，直接進(jìn)入初始化方法。如果沒(méi)有，判斷url是否包含code，有code說(shuō)明是進(jìn)入授權(quán)頁(yè)回調(diào)后的頁(yè)面，那么通過(guò)code換取用戶信息即可。沒(méi)有code，即用戶第一次進(jìn)入該頁(yè)面，引導(dǎo)去授權(quán)頁(yè)，redirect_uri為當(dāng)前頁(yè)面地址。

getWxUserInfo方法：

/*** 授權(quán)后獲取用戶的基本信息*/getWxUserInfo:function(par){var code = common.getUrlParameter("code");if (par) code = par;$.ajax({async: false,data: {code:code},type : "GET",url : WX_ROOT + "wechat/authorization",success : function(json) {if (json){try {//保證寫入的wxUserInfo是正確的var data = JSON.parse(json);if (data.openid) {localStorage.setItem('wxUserInfo',json);//寫緩存--微信用戶信息 }} catch (e) {// TODO: handle exception }}}});},

?

5.后臺(tái)restful-- /wechat/authorization，根據(jù)code換取用戶信息

　　/*** 微信授權(quán)* @param code 使用一次后失效* * @return 用戶基本信息* @throws IOException */@RequestMapping(value = "/authorization", method = RequestMethod.GET)public void authorizationWeixin(@RequestParam String code,HttpServletRequest request, HttpServletResponse response) throws IOException{request.setCharacterEncoding("UTF-8"); response.setCharacterEncoding("UTF-8"); PrintWriter out = response.getWriter();LOGGER.info("RestFul of authorization parameters code:{}",code);try {String rs = wechatService.getOauthAccessToken(code);out.write(rs);LOGGER.info("RestFul of authorization is successful.",rs);} catch (Exception e) {LOGGER.error("RestFul of authorization is error.",e);}finally{out.close();}}

?

這里有一個(gè)授權(quán)access_token，切記：授權(quán)access_token非全局access_token?，需要使用緩存，這里我使用的redis，具體配置不多說(shuō)后面寫相關(guān)配置博文，當(dāng)然也可以使用ehcache，關(guān)于ehcahe配置在我的第一篇博客中有詳細(xì)介紹。　　/*** 根據(jù)code 獲取授權(quán)的token 僅限授權(quán)時(shí)使用，與全局的access_token不同* @param code* @return* @throws IOException * @throws ClientProtocolException */public String getOauthAccessToken(String code) throws ClientProtocolException, IOException{String data = redisService.get("WEIXIN_SQ_ACCESS_TOKEN");String rs_access_token = null;String rs_openid = null;String url = WX_OAUTH_ACCESS_TOKEN_URL + "?appid="+WX_APPID+"&secret="+WX_APPSECRET+"&code="+code+"&grant_type=authorization_code";if (StringUtils.isEmpty(data)) {synchronized (this) {//已過(guò)期，需要刷新String hs = apiService.doGet(url);JSONObject json = JSONObject.parseObject(hs);String refresh_token = json.getString("refresh_token");String refresh_url = "https://api.weixin.qq.com/sns/oauth2/refresh_token?appid="+WX_APPID+"&grant_type=refresh_token&refresh_token="+refresh_token;String r_hs = apiService.doGet(refresh_url);JSONObject r_json = JSONObject.parseObject(r_hs);String r_access_token = r_json.getString("access_token");String r_expires_in = r_json.getString("expires_in");rs_openid = r_json.getString("openid");rs_access_token = r_access_token;redisService.set("WEIXIN_SQ_ACCESS_TOKEN", r_access_token, Integer.parseInt(r_expires_in) - 3600);LOGGER.info("Set sq access_token to redis is successful.parameters time:{},realtime",Integer.parseInt(r_expires_in), Integer.parseInt(r_expires_in) - 3600);}}else{//還沒(méi)有過(guò)期String hs = apiService.doGet(url);JSONObject json = JSONObject.parseObject(hs);rs_access_token = json.getString("access_token");rs_openid = json.getString("openid");LOGGER.info("Get sq access_token from redis is successful.rs_access_token:{},rs_openid:{}",rs_access_token,rs_openid);}return getOauthUserInfo(rs_access_token,rs_openid);}/*** 根據(jù)授權(quán)token獲取用戶信息* @param access_token* @param openid* @return*/public String getOauthUserInfo(String access_token,String openid){String url = "https://api.weixin.qq.com/sns/userinfo?access_token="+ access_token +"&openid="+ openid +"&lang=zh_CN";try {String hs = apiService.doGet(url);//保存用戶信息 saveWeixinUser(hs);return hs;} catch (IOException e) {LOGGER.error("RestFul of authorization is error.",e);}return null;}

?

當(dāng)時(shí)趕時(shí)間，代碼命名較亂。可以看到，我用了一個(gè)同步的方法，先從緩存中獲取key為WEIXIN_SQ_ACCESS_TOKEN，如果取到了說(shuō)明沒(méi)有過(guò)期，直接通過(guò)httpclient調(diào)用微信提供的接口，返回用戶信息的字符串給前端。如果沒(méi)有取到，說(shuō)明沒(méi)有或者已經(jīng)過(guò)期，則根據(jù)refresh_token刷新access_token，再寫緩存，由于access_token擁有較短的有效期，為了保險(xiǎn)我這里設(shè)置了緩存的失效時(shí)間微信給的時(shí)間再減一個(gè)小時(shí)。回過(guò)頭來(lái)看代碼發(fā)現(xiàn)，上面的邏輯有點(diǎn)點(diǎn)小問(wèn)題，這樣寫會(huì)導(dǎo)致第一次獲取或者緩存失效后第一次獲取access_token都會(huì)去刷新一次，暫時(shí)不影響使用，后面做優(yōu)化修改 TODO。

6：保存用戶信息

通常情況下，授權(quán)后我們會(huì)將用戶信息保存數(shù)據(jù)庫(kù)表，openid為唯一主鍵，外鍵關(guān)聯(lián)起我們自己的用戶表，這樣一來(lái)，無(wú)論是后續(xù)要開(kāi)展什么業(yè)務(wù)，還是做運(yùn)營(yíng)數(shù)據(jù)統(tǒng)計(jì)，都有了一個(gè)跟微信公眾號(hào)的關(guān)聯(lián)關(guān)系。值得注意的是：我們獲取到的headimgurl是微信提供的一個(gè)url地址，當(dāng)用戶修改頭像后可能導(dǎo)致原來(lái)的地址失效，所以最好是通過(guò)將圖片保存到本地服務(wù)器然后保存本地的地址url！微信返回的值：

?

參考鏈接：

微信公眾平臺(tái)官方文檔：https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421140842&token=&lang=zh_CN

在線接口調(diào)試工具：http://mp.weixin.qq.com/debug

沒(méi)有公眾號(hào)福利：測(cè)試賬號(hào)申請(qǐng)?http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/login 全部為原創(chuàng)文章，轉(zhuǎn)載請(qǐng)注明。
最近在學(xué)習(xí)react，react+flux+react-router?持續(xù)集成，一直更新，歡迎交流討論，歡迎star?
個(gè)人站點(diǎn)www.twobike.cn，歡迎指導(dǎo)交流....

總結(jié)

以上是生活随笔為你收集整理的微信网页授权，获取微信code，获取access_tocken,获取用户信息的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。