`
只是随手瞎打
  • 浏览: 28052 次
  • 性别: Icon_minigender_1
  • 来自: 厦门
社区版块
存档分类
最新评论

Nginx反向代理解决跨域问题

 
阅读更多
Nginx下载
http://www.nginx.cn/nginx-download

参考资料
http://www.cnblogs.com/renjing/p/6394725.html

通过下面配置文件实现了一个简单的前端项目访问后端接口的跨域问题
nginx.conf配置文件

#user  nobody;
worker_processes  1;

#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;

#pid        logs/nginx.pid;


events {
    worker_connections  1024;
}


http {
    include       mime.types;
    default_type  application/octet-stream;

    #log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
    #                  '$status $body_bytes_sent "$http_referer" '
    #                  '"$http_user_agent" "$http_x_forwarded_for"';

    #access_log  logs/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    #keepalive_timeout  0;
    keepalive_timeout  65;

    #gzip  on;

    server {
        listen       80;
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        #location / {
            #root   html;
            #index  index.html index.htm;
        #}
		location / {
            proxy_pass http://localhost:81; #将Nginx首页转发到前端登录页面
            #proxy_redirect default;
        }
		#拦截所有apis,并将URL重写
		 location ^~/apis {
			#rewrite  ^/apis/(.*)$ /$1 break;
			proxy_pass  http://localhost:8080/; #后端接口
       }
		
        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

        # proxy the PHP scripts to Apache listening on 127.0.0.1:80
        #
        #location ~ \.php$ {
        #    proxy_pass   http://127.0.0.1;
        #}

        # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
        #
        #location ~ \.php$ {
        #    root           html;
        #    fastcgi_pass   127.0.0.1:9000;
        #    fastcgi_index  index.php;
        #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
        #    include        fastcgi_params;
        #}

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
        #location ~ /\.ht {
        #    deny  all;
        #}
    }


    # another virtual host using mix of IP-, name-, and port-based configuration
    #
    #server {
    #    listen       8000;
    #    listen       somename:8080;
    #    server_name  somename  alias  another.alias;

    #    location / {
    #        root   html;
    #        index  index.html index.htm;
    #    }
    #}


    # HTTPS server
    #
    #server {
    #    listen       443 ssl;
    #    server_name  localhost;

    #    ssl_certificate      cert.pem;
    #    ssl_certificate_key  cert.key;

    #    ssl_session_cache    shared:SSL:1m;
    #    ssl_session_timeout  5m;

    #    ssl_ciphers  HIGH:!aNULL:!MD5;
    #    ssl_prefer_server_ciphers  on;

    #    location / {
    #        root   html;
    #        index  index.html index.htm;
    #    }
    #}

}


分享到:
评论

相关推荐

    利用Nginx反向代理解决跨域问题详解

    问题 在之前的分享的跨域资源共享的文章中,有提到... 基于与合作方后台的配合,利用nginx方向代理来满足浏览器的同源策略来实现跨域 实现方法 反向代理概念 反向代理(Reverse Proxy)方式是指以代理服务器来接受In

    Nginx 反向代理解决JS跨域

    通过使用Nginx 反向代理来解决JS跨域问题 http://blog.csdn.net/mzhaocai/article/details/79238338

    nginx安装, 解决跨域问题

    Nginx作为一个高性能的反向代理服务器,常被用于处理此类问题。本篇将详细介绍如何在Linux环境下安装Nginx,并通过修改配置文件来解决跨域限制。 ### Nginx安装步骤 1. **更新系统包** 在安装Nginx之前,确保系统...

    Tomcat+Nginx反向代理部署前后端分离项目解决跨域问题

    最近自己做了一个前后端分离项目,前端采用HBuilderX开发,后端采用IDEA开发,在本地开发也跨域,部署到云服务器也跨域,下面介绍两种解决方案。 出于浏览器的同源策略限制。同源策略(Sameoriginpolicy)是一种约定...

    nginx反向代理导致session失效的问题解决

    两边通过同一个nginx进行反向代理,nginx配置大致如下, location /health/ { proxy_pass http://192.168.40.159:8081/health/; #无问题的配置 } location /health-dev/ { proxy_pass ...

    nginx跨域问题,解决多端口,多ip问题

    解决这种问题的方法是使用 Nginx 的反向代理功能,将前端请求代理到后端服务器上。 二、代码逻辑优化 代码逻辑优化是指对 Nginx 配置的优化,以提高服务器性能和安全性。其中包括前端配置、后端配置和服务器配置三...

    nginx解决跨域问题的实例方法

    跨域问题在现代Web开发中是一个常见的挑战,尤其是在前后端分离的架构中。浏览器的同源策略限制了JavaScript从一个源获取另一个源的数据,而Nginx作为一...不过,Nginx的反向代理方案已经能解决大部分基本的跨域问题。

    vue.js使用代理和使用Nginx来解决跨域的问题

    使用Nginx 反向代理解决跨域问题(vue.js使用代理去掉vue.js因为跨域而触发的options请求) 我们的项目还是需要node.js作为容器的 一、Windows 下安装Nginx (官网下载稳定版http://nginx.org/en/download.html) 二...

    Vue中跨域及打包部署到nginx跨域设置方法

    在当今的web开发过程中,...本文介绍了在Vue项目开发阶段使用webpack配置代理解决跨域的方法,以及在生产环境中如何配置Nginx服务器,确保前端项目在不同环境下都能够正常访问后端资源,保证前后端分离项目的顺利进行。

    nginx解决跨域案例

    总结,Nginx作为强大的反向代理服务器,能够轻松地解决跨域问题。通过配置合适的响应头,Nginx可以确保前端应用在遵循浏览器同源策略的同时,能够与不同源的后端服务进行有效通信。理解并熟练掌握这一技术对于前后端...

    如何用Nginx解决前端跨域问题

    这时,Nginx作为一个高性能的反向代理服务器,可以帮助我们解决这个问题。 解决步骤如下: 1. **请求转发**:首先,前端的请求不是直接发送到实际的接口地址,而是发送到本地的Nginx服务器,比如...

    nginx实现跨域访问遇到的问题

    Nginx 是一款轻量级的 Web 服务器、反向代理服务器和电子邮件代理服务器,然而在实现跨域访问时,会遇到一些问题。本文将讨论 Nginx 实现跨域访问遇到的系统环境问题解决方法,并分享踩过的坑。 跨域是什么? -----...

    6种解决跨域的方案

    Nginx作为一个强大的反向代理服务器,也可以用来处理跨域问题。通过配置Nginx服务器,添加CORS相关的HTTP响应头,Nginx可以将这些头添加到转发的请求中。以下是一个示例配置: ```nginx location / { add_...

    Nginx反向代理多域名的HTTP和HTTPS服务的实现

    主要介绍了Nginx反向代理多域名的HTTP和HTTPS服务的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

    nginx 配置跨域失效修复的方法示例

    nginx 配置跨域不生效 如下配置 server { listen 80; server_name localhost; # 接口转发 location /api/ { # 允许请求地址跨域 * 做为通配符 add_header 'Access-Control-Allow-Origin' '*'; # 设置请求...

    ARM32-Nginx服务,支持RTMP/HTTP-FLV推拉流,支持flv.js跨域拉流,支持web端跨域代理/上传文件

    “支持web端跨域代理/上传文件”表明Nginx不仅能够处理流媒体服务,还能够作为Web服务器,提供文件上传功能,并且可以配置为代理服务器,解决Web应用因同源策略导致的跨域问题。这在开发Web应用时非常有用,尤其是...

    nginx解决前后分离开发跨域问题

    为了解决这个问题,我们可以利用Nginx作为反向代理服务器,将前端的请求转发到后端服务,从而绕过跨域限制。 Nginx是一款高性能、轻量级的HTTP和反向代理服务器,因其强大的负载均衡能力和高效的性能而广泛应用于...

    nginx反向代理

    **Nginx反向代理详解** Nginx是一款高性能、轻量级的Web服务器和反向代理服务器,广泛应用于互联网领域,尤其在处理高并发场景时表现出色。它以其高效稳定、低内存占用以及丰富的模块化设计而备受赞誉。在这个...

    vue打包使用Nginx代理解决跨域问题

    用nginx反向代理,和访问本地服务器是一样的 可以修改成正式线上的地址,再build 推荐 使用nginx配置反向代理,这样就可以在前端彻底解决跨域问题。 vue index.js文件源码 'use strict' // Template version:...

Global site tag (gtag.js) - Google Analytics