前后端分离+微信授权+跨域
这个项目是前后端分离的前端采用Vue开发,后端是lumen 5.7,nginx 服务器前后端是不同的次级域名以上是背景,记录以下遇到的几个问题跨域问题前端地址 http://front.abc.com后端地址 http://back.abc.com网页从前端访问后端接口,存在跨域问题。使用nginx 配置代理解决nginx配置server {listen...
·
这个项目是前后端分离的
前端采用Vue开发,后端是lumen 5.7,nginx 服务器
前后端是不同的次级域名
以上是背景,记录以下遇到的几个问题
-
跨域问题
前端地址 http://front.abc.com
后端地址 http://back.abc.com
网页从前端访问后端接口,存在跨域问题。使用nginx 配置代理解决nginx配置
server { listen 80; server_name front.abc.cn; root /html/www/front; index index.html index.htm index.php; location / { try_files $uri $uri/ /index.php$is_args$args; } location /back/ { proxy_pass http://back.abc.com; } location ~ \.php$ { try_files $uri /index.php =404; fastcgi_pass 127.0.0.1:9000; fastcgi_index index.php; fastcgi_buffers 16 16k; fastcgi_buffer_size 32k; fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name; #fixes timeouts fastcgi_read_timeout 600; include fastcgi_params; } location ~ /\.ht { deny all; } }
解释:
当前端访问自己的域名时,不会有跨域问题
当url中包含back/
时, 代理设置将前端域名修改为后端域名
所以当需要访问http://back.abc.com/order/list
时,在前端要访问http://front.abc.com/back/order/list
-
授权url问题
一般Vue
前端的url 中包含#
微信公众号后台设置好回调域名后,要在公众号访问授权地址,然后带参数回调到前端地址
微信会将#
后面的部分认为是锚点,因此访问不到
需要使用nginx
配置修改url,去掉#
location / { root /html/www/front; index index.html index.htm; if (!-e $request_filename) { rewrite ^/(.*) /index.html last; break; } }
更多推荐
已为社区贡献1条内容
所有评论(0)