Nginx解决跨域

一.静态页面服务器

nginx.conf 的配置(其实默认的也是如此,所以作为静态服务器只需要将静态文件移动到nginx下的html文件夹里就可以了)

server {
      listen       8094; #监听端口
      server_name  localhost; #

#charset koi8-r;

#access_log  logs/host.access.log  main;

location / {
          root   html;#文件根目录
          index  index.html index.htm;#默认起始页
      }

}

  然后打开浏览器 输入 localhost:8094 即可.

二.反向代理服务器-》跨域

下面是未使用Nginx做反向代理的API的url(指定想要访问的域名:端口号,但是会跨域)。

提示了跨域问题。

利用nginx 通过反向代理 满足浏览器的同源策略实现跨域.

然后我们回到nginx.conf 配置一个反向代理路径(新增红色部分)

server {
        listen       8094;
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

       location / {
            root   html;
            index  index.html index.htm;
        }
        location /apis {
          rewrite  ^.+apis/?(.*)$ /$1 break;
          include  uwsgi_params;
          proxy_pass   http://localhost:1894;
       }
}

配置说明:监听域名为localhost的8094端口号,配置一个/apis  重写到我们真正的api地址http://localhost:1894  形成一个代理的过程。

然后更改一下index1.html的api请求地址。

这样这个api的地址就跟当前页面index1.html处于同源位置了。就是我们配置的nginx监听地址 localhost:8094。

总结:首先这边的前端页面发出请求http://localhost:8094/apis/api/basic/get,然后由于Nginx监听了该域名localhost下的8094端口号,并且配置了反向代理对应的/apis,然后就会由配置的反向代理服务器localhost:1894处理。

来源:https://www.cnblogs.com/bninp/p/5694277.html

原文地址:https://www.cnblogs.com/theRhyme/p/9559076.html

时间: 2024-10-15 14:49:47

Nginx解决跨域的相关文章

使用nginx解决跨域问题(flask为例)

背景 我们单位的架构是在api和js之间架构一个中间层(python编写),以实现后端渲染,登录状态判定,跨域转发api等功能.但是这样一个中间会使前端工程师的工作量乘上两倍,原本js可以直接ajax请求api,但是我们不得不ajax请求中间层,中间层再请求api.如图: 为了少敲代码,提高工作效率,我们当然希望将python中间层砍掉,但是如何解决以下三个问题,成为关键: 后端渲染 登录状态判定 跨域转发api 关于1,2我会在另外两篇博客中详细叙述,这篇文章主要解决3,也就是跨域问题.解决跨

使用Nginx解决跨域,防盗链,宕机,DDOS攻击

一:负载均衡时服务器宕机轮询策略 在通过代理服务器nginx向真实的服务器发送请求时,如果有一个服务器集群,它们按照轮询或者权重的负载均衡策略运作下去,当轮到a(端口6060)服务器接受nginx的请求时, a服务器突然宕机了,那么没有做任何措施的情况下,这个请求会一直请求下去,直到被响应或者响应超时报错,这种情况下需要添加一些配置, 当有服务器宕机的时候,在一定时间内他没有响应,就换另一个服务器去接受这个请求 在负载均衡的配置基础上添加新的配置,下面字体 upstream backserver

nginx 解决跨域需要几行

在指定的主机location 下添加以下语句便可; 如: location / {add_header Access-Control-Allow-Origin *;add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested- With,If-Modif

使用Nginx来解决跨域的问题

nginx的版本:(查看nginx命令: /usr/local/nginx/sbin/nginx -v) nginx/1.4.3 问题是:前端项目域名是 a.xxxx.com, 后端的接口域名是 b.xxx.com,然后后端接口没有设置跨域相关的响应设置头,因此就接口和我们域名就会存在跨域的情况,因此我们可以使用 nginx服务器来配置一下: 网上很多资料将 在nginx配置下 加如下代码就可以解决跨域的问题: add_header Access-Control-Allow-Origin *;

前端通过Nginx反向代理解决跨域问题

本文探讨了前端如何通过Nginx反向代理的方式解决跨域问题. 跨域 再次重申: 跨域是浏览器行为,不是服务器行为. 实际上,请求已经到达服务器了,只不过在回来的时候被浏览器限制了.就像Python他可以进行抓取数据一样,不经过浏览器而发起请求是可以得到数据,想到通过Nginx的反向代理来解决跨域问题. 代理 所谓代理就是在我们和真实的服务器之间有一台代理服务器,我们所有的请求都是通过它来进行转接的. 正向代理 正向代理就是我们访问不了Google,但是我在国外有一台vps,它可以访问Google

vue前后端分离解决跨域问题

用Vue-cli脚手架搭建了个demo,前后分离就有跨域问题的出现. vue-clie搭建demo步骤(传送门):https://www.cnblogs.com/wangenbo/p/8487764.html 我自己在网上找了2个接口做测试: CSDN:https://www.csdn.net/api/articles?type=more&category=home&shown_offset=1524276761019196&first_view=false 掘金:https://

nginx解决服务器宕机、解决跨域问题、配置防盗链、防止DDOS流量攻击

解决服务器宕机 配置nginx.cfg配置文件,在映射拦截地址中加入代理地址响应方案 location / { proxy_connect_timeout 1; proxy_send_timeout 1; proxy_read_timeout 1; proxy_pass http://backserver; index index.html index.htm; } proxy_connect_timeout 1; :连接超时1秒 proxy_send_timeout 1; :请求超时1秒 pr

前端开发如何独立解决跨域问题

背景 跨域是由浏览器同源策略引起的,是指页面请求的接口地址,必须与页面url地址处于同域上(即域名,端口,协议相同).这是为了防止某域名下的接口被其他域名下的网页非法调用,是浏览器对JavaScript施加的安全限制. 这个措施出发点是好的,但在项目开发的过程中,常常给前端开发者带来麻烦. 由于页面开发中,静态资源是放在本地电脑上的,访问这些资源通常通过IP方式(127.0.0.1)或者localhosts来访问,与线上服务器所在域名不符,不能顺利进行接口调用. 解决跨域问题常用的解决方案有两个

非jsonp解决跨域问题

1.服务器端解决跨域问题:配置filter在filter中设置请求头import java.io.IOException; import javax.servlet.Filter;import javax.servlet.FilterChain;import javax.servlet.FilterConfig;import javax.servlet.ServletException;import javax.servlet.ServletRequest;import javax.servle