Ionic3 两种方法解决跨域问题 - 正向代理与服务器允许

所谓正向代理就是本地代理,反向代理就是服务端代理,只配置一种即可,具体配置方法如下:

一、正向代理

本地修改 ionic 项目就能实现跨域访问了

  1. 修改 config.xml 文件
    server address替换成自己的服务器地址,粗暴一点可以直接写 *
<content src="server address" />
<access origin="server address" />
<allow-navigation href="server address" />
  1. 修改 ionic.config.json
    添加如下代码
"proxies": [{
    "path": "/api",
    "proxyUrl": "server address/api"
}]

如果想要代理所有链接,那就这样写

"proxies": [{
    "path": "/",
    "proxyUrl": "server address/"
}]
  1. 重新编译运行项目,就会发现普通浏览器也可以跨域访问啦

二、Nginx 允许跨域配置

在nginx服务器上添加三行add_header,重启nginx即可。

server
{
    include conf.d/shami.app; 

    add_header Access-Control-Allow-Origin *;
    add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS';
    add_header 'Access-Control-Allow-Headers' 'Access-Control-Allow-Orgin,XMLHttpRequest,Accept,Authorization,Cache-Control,Content-Type,DNT,If-Modified-Since,Keep-Alive,Origin,User-Agent,X-Mx-ReqToken,X-Requested-With';

    location / {
        index  index.html index.htm index.php;
        try_files $uri $uri/ /index.php?$query_string;
    }
}

三、Apache 允许跨域配置

Header set Access-Control-Allow-Origin “*”

发布了87 篇原创文章 · 获赞 93 · 访问量 10万+

猜你喜欢

转载自blog.csdn.net/zhichaosong/article/details/100763714