解决一个微信号同时支持多个环境网页授权问题


Posted in Javascript onAugust 07, 2019

项目进行微信开发, 认证了一个微信服务号专门用于内部测试,但是内部可能存在多套不同环境(开发dev、测试sit、预发布uat)等,由于微信限制一个服务号只能配置一个网页授权域名, 又不可能给每个环境单独配一个服务号,这样不仅需要成本而且很浪费资源, 所以重点需要解决下面这个问题:

1、可以自动区分环境。比方部署开发环境。url可能是http://dev.xxx.com/api/,而在测试环境的时候应该是http://sit.xxx.com/api/。而并且不能写死,否则开发和测试就要换来换去。非常麻烦

解决一个微信号同时支持多个环境网页授权问题

本文总结分享一下思路:

主要是通过中间页面代理获取微信授权CODE,然后跳转到对应需要使用的环境URL下;

比如原来开发环境, 微信中授权域名配置的是dev.xxx.com,那么现在配置的是一个代理域名proxy.xxx.com,通过代理域名拿到code后在跳回dev.xxx.com,如下图所示

解决一个微信号同时支持多个环境网页授权问题

代码片段 getCode.html

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>微信授权登录</title>
</head>
<body>
</body>
<script>
 var code = getPara("code");
 if(!code)
 {
  var redirect = getPara("url");
  var appid = getPara("appid");
  var _from = getPara("from");
  var redirect_url = encodeURIComponent('https://proxy.xxx.com/getCode.html?url='+redirect);
  var url = "https://open.weixin.qq.com/connect/oauth2/authorize?appid="+appid+"&redirect_uri=" + redirect_url + "&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect";
  location.href = url;
 }else{
  var redirect = getPara("url");
  var code = getPara("code");
  if(redirect.split('?').length > 1){
  location.href = redirect + "&code=" + code;
  }else{
    location.href = redirect + "?code=" + code;
  }
 }
 function getPara(name){
  var url = location.href;
  eval("var reg = /("+name+"=[A-Za-z0-9_,-@!#\.\:\/]*)/i")
  var match = url.match(reg);
  if(match && match.length > 1){
    var arr = match[0].split("=");
  arr.shift();
  return arr.join('=');
  }else{
   return "";
  }
 }
</script>
</html>

使用方法https://proxy.xxx.com/getCode.html?url=http://dev.xxx.com/uinfo&appid=wx6d421c188956xx95

总结

以上所述是小编给大家介绍的解决一个微信号同时支持多个环境网页授权问题呢,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
jquery图片上下tab切换效果
Mar 18 Javascript
JavaScript中的Math 使用介绍
Apr 21 Javascript
在HTML代码中使用JavaScript代码的例子
Oct 16 Javascript
分享20个提升网站界面体验的jQuery插件
Dec 15 Javascript
Angular中的Promise对象($q介绍)
Mar 03 Javascript
Bootstrap基础学习
Jun 16 Javascript
JQuery导航菜单选择特效
Apr 11 Javascript
基于jQuery实现弹幕APP
Feb 10 Javascript
angularJs的ng-class切换class
Jun 23 Javascript
angular4自定义组件详解
Sep 28 Javascript
小程序实现短信登录倒计时
Jul 12 Javascript
解决vue项目中遇到 Cannot find module ‘chalk‘ 报错的问题
Nov 05 Javascript
vue+element项目中过滤输入框特殊字符小结
Aug 07 #Javascript
Vue.js项目实战之多语种网站的功能实现(租车)
Aug 07 #Javascript
javascript中的数据类型检测方法详解
Aug 07 #Javascript
scrapyd schedule.json setting 传入多个值问题
Aug 07 #Javascript
Node.js在图片模板上生成二维码图片并附带底部文字说明实现详解
Aug 07 #Javascript
微信小程序引入Vant组件库过程解析
Aug 06 #Javascript
Vue数据绑定实例写法
Aug 06 #Javascript
You might like
全国FM电台频率大全 - 17 湖北省
2020/03/11 无线电
环境会对咖啡种植有什么影响
2021/03/03 咖啡文化
PHP实现格式化文件数据大小显示的方法
2015/01/03 PHP
jquery不支持toggle()高(新)版本的问题解决
2016/09/24 PHP
Bookmarklet实现启动jQuery(模仿 云输入法)
2010/09/15 Javascript
Javascript实现的SHA-256加密算法完整实例
2016/02/02 Javascript
论Bootstrap3和Foundation5网格系统的异同
2016/05/16 Javascript
nodejs aes 加解密实例
2018/10/10 NodeJs
Python实现获取网站PR及百度权重
2015/01/21 Python
简述Python中的进程、线程、协程
2016/03/18 Python
Python打印“菱形”星号代码方法
2018/02/05 Python
Django框架多表查询实例分析
2018/07/04 Python
pandas 空的dataframe 插入列名的示例
2018/10/30 Python
教你一步步利用python实现贪吃蛇游戏
2019/06/27 Python
通过python扫描二维码/条形码并打印数据
2019/11/14 Python
OpenCV哈里斯(Harris)角点检测的实现
2020/01/15 Python
Python: tkinter窗口屏幕居中,设置窗口最大,最小尺寸实例
2020/03/04 Python
pycharm实现在子类中添加一个父类没有的属性
2020/03/12 Python
基于SpringBoot构造器注入循环依赖及解决方式
2020/04/26 Python
Python字典dict常用方法函数实例
2020/11/09 Python
Python3爬虫RedisDump的安装步骤
2021/02/20 Python
HTML5的结构和语义(4):语义性的内联元素
2008/10/17 HTML / CSS
解决canvas转base64/jpeg时透明区域变成黑色背景的方法
2016/10/23 HTML / CSS
跨域修改iframe页面内容详解
2019/10/31 HTML / CSS
白宫黑市官网:White House Black Market
2016/11/17 全球购物
美国一家全面的在线零售鞋类公司:SHOEBACCA
2017/01/06 全球购物
美国折扣宠物药房:Total Pet Supply
2018/05/27 全球购物
加拿大鞋网:Globo Shoes
2019/12/26 全球购物
别名指示符是什么
2012/10/08 面试题
20岁生日感言
2014/01/13 职场文书
会计岗位职责模板
2014/03/12 职场文书
网络编辑岗位职责
2014/03/18 职场文书
2014年保育员个人工作总结
2014/12/02 职场文书
2015年班主任个人工作总结
2015/03/31 职场文书
2019学校运动会开幕词
2019/05/13 职场文书
python中的class_static的@classmethod的巧妙用法
2021/06/22 Python