首页 新闻 会员 周边

前端后端分离跨域问题vue+nginx+restful api

0
悬赏园豆:5 [待解决问题]

前端使用vue,域名为a.domain.com,后端使用.Net Core写的restful api接口,域名为api.domain.com,中间使用nginx做web服务器,遇到跨域问题,请教如何处理跨域问题
vue--->nginx--->api

kingboy8808的主页 kingboy8808 | 初学一级 | 园豆:5
提问于:2021-08-16 11:40

.net core自己用中间件处理即可
先添加(注册)中间价 service.AddPolicy()
然后再使用即可
app.userCors()
网上一搜 处理方案一大推

Mr--WANG 2年前
< >
分享
所有回答(3)
1
// 指定跨域
 c.AddPolicy("CorsApi"),

                        policy =>
                        {

                            policy
                            .WithOrigins("http://a.domain.com")
                            .AllowAnyHeader()//Ensures that the policy allows any header.
                            .AllowAnyMethod();
                        });
//允许任意跨域请求
                    c.AddPolicy("CorsApi"),
                        policy =>
                        {
                            policy
                            .SetIsOriginAllowed((host) => true)
                            .AllowAnyMethod()
                            .AllowAnyHeader()
                            .AllowCredentials();
                        });
永远跟党走i | 园豆:1519 (小虾三级) | 2021-08-16 12:45

这种方法一开始就试过了,不行

支持(0) 反对(0) kingboy8808 | 园豆:5 (初学一级) | 2021-08-16 15:22

@kingboy8808:

location /api {  # 这是第一个   让所有api 请求都在这里进行
              # 解决 跨域问题
        add_header 'Access-Control-Allow-Origin' $http_origin;
		add_header 'Access-Control-Allow-Credentials' 'true';
		add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
		add_header 'Access-Control-Allow-Headers' 'DNT,web-token,app-token,Authorization,Accept,Origin,Keep-Alive,User-Agent,X-Mx-ReqToken,X-Data-Type,X-Auth-Token,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';
		add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';
		if ($request_method = 'OPTIONS') {
			add_header 'Access-Control-Max-Age' 1728000;
			add_header 'Content-Type' 'text/plain; charset=utf-8';
			add_header 'Content-Length' 0;
			return 204;
		}
         
            # rewrite  ^.+Api/?(.*)$ /$1 break;
            proxy_pass  http://CgrainApi; #反向代理指向地址 
        }

支持(0) 反对(0) 永远跟党走i | 园豆:1519 (小虾三级) | 2021-08-16 18:18

我就是这样配置的

接口

前端

支持(0) 反对(0) 永远跟党走i | 园豆:1519 (小虾三级) | 2021-08-16 18:19
0

这种前后端分离的项目通常使用jwt, 前端如何调用带jwt的web api、配置Nginx等知识,
有兴趣可以看看 《.NET Core 跨平台实战》

智客工坊 | 园豆:1855 (小虾三级) | 2021-08-16 12:55

为啥是有道云笔记官网的链接

支持(0) 反对(0) kingboy8808 | 园豆:5 (初学一级) | 2021-08-16 15:23
0

换个思路呢?api的域名改为 a.domain.com/api/ 这样既能省下一个https的证书,也没跨域。。。

顾晓北 | 园豆:10844 (专家六级) | 2021-08-16 15:33
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册