背景：相信很多開發(fā)微信公眾號(hào)的小伙伴都碰到過(guò)這個(gè)問(wèn)題，微信限制我們配置網(wǎng)頁(yè)授權(quán)域名數(shù)量，但是大部分團(tuán)隊(duì)肯定不止一個(gè)業(yè)務(wù)需要微信網(wǎng)頁(yè)登錄的，我們這里可以利用nginx作為代理，實(shí)現(xiàn)只配置一個(gè)授權(quán)域名，完成團(tuán)隊(duì)各種業(yè)務(wù)的微信網(wǎng)頁(yè)登錄。

配置流程：

? ? ? ? 第一步：設(shè)置解析一個(gè)二級(jí)域名專門用于微信網(wǎng)頁(yè)授權(quán)。

????????第二步：解析到的服務(wù)器安裝并配置nginx，詳細(xì)配置如下：

#############微信授權(quán)接口#######################server{listen 80;#該域名就是微信公眾號(hào)上配置的網(wǎng)頁(yè)授權(quán)域名server_name wx.aouth.master.com;location / {proxy_set_header Host $host;proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;#如果是測(cè)試環(huán)境，則重定向到內(nèi)網(wǎng)穿透的域名if ( $arg_evn = test) {rewrite ^/(.*)$ http://$arg_pix.test.frp.master.net/$1 permanent;break;}#如果是生產(chǎn)環(huán)境則重定向到生產(chǎn)環(huán)境的h5地址域名if ( $arg_evn = prod){rewrite ^/(.*)$ https://$arg_pix.h5.master.com/$1 permanent;break;}}#配置微信的域名驗(yàn)證文件location =/MP_verify_3wrrmjc6T88dAWW5.txt {root /usr/local/nginx/html/h5;}}

? 其中：wx.aouth.master.com就是筆者的微信網(wǎng)頁(yè)授權(quán)域名，在微信公眾號(hào)上配置這個(gè)即可，由于筆者的團(tuán)隊(duì)本地都用FRP軟件做了內(nèi)網(wǎng)穿透，所以在nginx中再做一個(gè)環(huán)境識(shí)別，測(cè)試環(huán)境則跳轉(zhuǎn)他們各自的內(nèi)網(wǎng)穿透域名，生產(chǎn)環(huán)境跳轉(zhuǎn)各自業(yè)務(wù)域名。

參數(shù)：evn，用于識(shí)別環(huán)境；

參數(shù)：pix，用于設(shè)置不同的域名前綴；

這倆個(gè)參數(shù)都是在生成鏈接時(shí)候在redirect_uri的參數(shù)中指定的。

第三步：生成網(wǎng)頁(yè)授權(quán)鏈接

由于生成鏈接中的redirect_uri需要做UrlCode，筆者貼一個(gè)編碼之前和編碼之后的，方便對(duì)比。

編碼之前的地址：

String url="https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx123456789a&redirect_uri=http://wx.aouth.master.com/views/open/wx/oauth/?evn=test&pix=master&response_type=code&scope=snsapi_base&state=test#wechat_redirect";

? ?編碼之后地址：

String url="https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx123456789a&redirect_uri=http%3A%2F%2Fwx.aouth.master.com%2Fviews%2Fopen%2Fwx%2Foauth%2F%3Fevn%3Dtest%26pix%3Dmaster&response_type=code&scope=snsapi_base&state=test#wechat_redirect"

?第四步：配置完成

配置完成，筆者這里是后端生成這個(gè)鏈接給前端用，這里貼上后端生成連接的代碼：

/*** 獲取公眾號(hào)網(wǎng)頁(yè)授權(quán)鏈接* @param id 自動(dòng)注入客戶ID* @param backPath 跳回小程序的頁(yè)面PATH* @return*/@ApiOperation(value = "獲取公眾號(hào)網(wǎng)頁(yè)授權(quán)鏈接",notes = "返回一個(gè)鏈接地址，請(qǐng)使用web-view組件在微信內(nèi)打開<br>待處理完成后跳轉(zhuǎn)到小程序指定的頁(yè)面")@GetMapping(value = "/courier/gzh/oauth/url")public APIEntity<WeChatJsConfig> getGzhOauthUrl(@RequestAttribute("JwtUserId") Integer id,@ApiParam(value = "跳回小程序的頁(yè)面路徑", required = true,example = "/pages/index/index") @RequestParam String backPath) {String url="https://open.weixin.qq.com/connect/oauth2/authorize?appid={}&redirect_uri={}&response_type=code&scope=snsapi_base&state=test#wechat_redirect";String redirectUri;try {redirectUri= URLEncoder.encode(StrUtil.format("http://wx.aouth.master.com/views/open/wx/oauth/?backPath={}&id={}&evn=prod&pix=share",backPath,id),"UTF-8");} catch (UnsupportedEncodingException e) {e.printStackTrace();return APIEntity.fail("地址解碼失敗");}return APIEntity.success(StrUtil.format(url,WxApp.GZH_TCJS.getAppId(),redirectUri));}

筆者這里的業(yè)務(wù)是小程序打開網(wǎng)頁(yè)完成授權(quán)登錄后再跳回小程序，所以redirect_uri還加了一些其他業(yè)務(wù)上的參數(shù)，小伙伴們可以根據(jù)自己的情況增減。

總結(jié)

以上是生活随笔為你收集整理的解决，微信网页开发，网页授权域名数量不足问题的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

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