利用nginx实现反向代理 解决前后端分离中 跨域问题

最近的项目使用springboot+react架构实现的,是前后端完全分离的,在联调的时候遇到跨域问题。

现在项目中,使用前后端分离架构的越来越多,但是前后端分离联调的时候会存在跨域的问题。

当然如果只是为了访问,可以添加@CrossOrigin 注解来解决,但是如果在项目中使用的有cookie,那就不行了,因为cookie只能在一个域中使用。


Nginx是一个高性能的HTTP和反向代理web服务器。

反向代理(Reverse Proxy):方式是指以代理服务器来接受Internet上的连接请求,然后将请求转发给内部网络上的服务器;并将从服务器上得到的结果返回给Internet上请求连接的客户端,此时代理服务器对外就表现为一个服务器。

通常的代理服务器,只用于代理内部网络对Internet的连接请求,客户机必须指定代理服务器,并将本来要直接发送到Web服务器上的http请求发送到代理服务器中。当一个代理服务器能够代理外部网络上的主机,访问内部网络时,这种代理服务的方式称为反向代理服务。

                    利用nginx实现反向代理 解决前后端分离中 跨域问题_第1张图片

                                                                     图1    反向代理服务器的基本原理

直白点说,就是多个服务器,在进行数据交换的时候都需要进行代理服务器来进行,相当于这些服务器对于代理服务器都是子服务器,而对于外界来说,多个服务器好像是一个服务,对于内部来说,也就实现了多个服务器在一个域的控制。


Nginx 在windows上的安装:

  nginx在windows上是非常容易使用的。从http://nginx.org/en/download.html官网下载相应的压缩包

利用nginx实现反向代理 解决前后端分离中 跨域问题_第2张图片

下载后,解压,找到相应的解压文件,找到conf目录下的nginx.conf文件。

利用nginx实现反向代理 解决前后端分离中 跨域问题_第3张图片

修改其中的server

    server{
      listen 80; 
        server_name  tomcat1.com;
        #charset koi8-r;
        #access_log  logs/host.access.log  main;
        location  / {
        proxy_pass   http://10.16.32.35:8081;
        index  index.html index.htm;
        }
  }
  server{
    listen 80; 
        server_name  tomcat2.com;
        #charset koi8-r;
        #access_log  logs/host.access.log  main;
        location  / {
        proxy_pass   http://10.16.32.15:8666;
        index  index.html index.htm;
        }
  
  }

然后,启动nginx即可。

命令:

开启:start nginx

快速停止:nginx -s stop

完整停止:nginx -s quit

重新加载配置文件:nginx -s reload

检查配置文件:nginx -t -c  conf/nginx.conf

 

你可能感兴趣的:(利用nginx实现反向代理 解决前后端分离中 跨域问题)