前后端分离下微信授权问题

Question

项目前端部分使用的是vue.js。

目前采用的是前端发起重定向->得到code->code交给后台->换取openid的方案，但是由于微信需要配置安全域名，所以开发时就没办法重定向回来，也就没办法调试，只有打包发到线上才可以，请问各位有什么好的解决方案吗？

Answer 1

将你本地ip进行外网映射(穿透)你可以去看看natapp

Answer 2

修改host文件,将域名指到本地就可以了。
然后在本地搭建一个nginx，做代理。
比如你的域名为：app.segmentfault.com.
host文件的修改：
app.segmentfault.com 127.0.0.1
nginx的代理配置：

    server {
        listen       80;
        server_name  localhost;

        location / {
         index  index.html index.htm;
         proxy_pass http://localhost:8000;   # web入口
        }
        
        location /api {  #web调用后台接口代理
        proxy_set_header Host $host;
         proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
         proxy_pass http://localhost:8080;
        }
        location /main {
            try_files $uri $uri/ /index.html;   #web其他路径,如：http://localhost:8000/main
        }
    }

Answer 3

微信网页开发，这种情况有三种方法调试
1.使用微信提供的 “微信web开发者工具” ，然后在PC上设置 host，进行域名劫持。
2.PC安装DNSAgent.exe ，然后再手机的网络连接里面找到 DNS手动设置，将DNS地址设置为你的PC的ip 。注意PC要和手机在同一个局域网，可以互相通信，PC关闭防火墙
3.使用一个测试的域名，将这个测试域名A记录指向到你本地的IP。比如手机IP 192.168.1.100 PC后端服务IP 192.168.1.101 域名 www.domain.com ，这时候将www.domain.com的A记录指向到 192.168.1.101 这样同一局域网也可以的。