nginx解决前端跨域问题

最新推荐文章于 2023-04-04 15:53:05 发布

原创最新推荐文章于 2023-04-04 15:53:05 发布 · 1.2k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#nginx

插件专栏收录该内容

5 篇文章

订阅专栏

本文介绍了一种通过Nginx代理解决本地项目访问外部资源时出现的跨域问题的方法。配置了Nginx服务器，使其能够将特定路径的请求代理到远程服务器上，并通过Ajax示例演示了如何实现跨域访问。

需求：本地访问外域的资源遇到跨域问题。

nginx配置：

server{
        listen       8000;
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
            #本地项目地址
            root   C:\\Users\\xq\\Desktop\\test\\html;
            #访问资源的页面
            index  index.html index.htm;
        }
        location /portal {
            #远程服务器地址
            proxy_pass       http://aaa.source.com;        
            proxy_set_header Host $host:$server_port;
        }
    }

使用ajax访问：

var proxyUrl =  "portal/api/home/warelist";
        $.ajax({
            url:proxyUrl,
            type:"post",
            contentType:"application/json",
            data:{
                "kindCode":"photograph-TP",
                "providerId":123456
            },
            success:function(result){
                console.log(result);
            }
        });