我们可能都会遇到一个这样的问题,线上环境是https://...,本地启动了项目,域名是localhost:8000等,本地想要访问线上的接口,直接在本地调试,却提示跨域,这个时候我们可以配置nginx,反向代理到本地,这样可以直接在谷歌浏览器里调试线上问题。

nginx配置

语法规则: location [=|~|~*|^~] /uri/ { … }
= 开头表示精确匹配
^~ 开头表示uri以某个常规字符串开头,理解为匹配 url路径即可。nginx不对url做编码,因此请求为/static/20%/aa,可以被规则^~ /static/ /aa匹配到(注意是空格)。
~ 开头表示区分大小写的正则匹配
~*  开头表示不区分大小写的正则匹配
!~和!~*分别为区分大小写不匹配及不区分大小写不匹配 的正则
/ 通用匹配,任何请求都会匹配到。
多个location配置的情况下匹配顺序为(参考资料而来,还未实际验证,试试就知道了,不必拘泥,仅供参考):
首先匹配 =,其次匹配^~, 其次是按文件中顺序的正则匹配,最后是交给 / 通用匹配。当有匹配成功时候,停止匹配,按当前匹配规则处理请求。

location = / {  //根目录
#规则A
}
location = /login { //接口名称等于/login
#规则B
}
location ^~ /static/ { //接口名称包含/static/
#规则C
}
location ~ \.(gif|jpg|png|js|css)$ { //接口是以.gif等结尾的 区分大小写
#规则D
}
location ~* \.png$ { //不区分大小写,并以.png结尾
#规则E
}
location !~ \.xhtml$ {
#规则F
}
location !~* \.xhtml$ { // ! 非 的存在
#规则G
}
location / { //作为一个default的存在 如果以上都不匹配,则走这里
   #规则H
}
那么产生的效果如下:
访问根目录/, 比如http://localhost/ 将匹配规则A
访问 http://localhost/login 将匹配规则B,http://localhost/register 则匹配规则H
访问 http://localhost/static/a.html 将匹配规则C
访问 http://localhost/a.gif, http://localhost/b.jpg 将匹配规则D和规则E,但是规则D顺序优先,规则E不起作用,而 http://localhost/static/c.png 则优先匹配到 规则C
访问 http://localhost/a.PNG 则匹配规则E, 而不会匹配规则D,因为规则E不区分大小写。
访问 http://localhost/a.xhtml 不会匹配规则F和规则G,http://localhost/a.XHTML不会匹配规则G,因为不区分大小写。规则F,规则G属于排除法,符合匹配规则但是不会匹配到,所以想想看实际应用中哪里会用到。
访问 http://localhost/category/id/1111 则最终匹配到规则H,因为以上规则都不匹配,这个时候应该是nginx转发请求给后端应用服务器,比如FastCGI(php),tomcat(jsp),nginx作为方向代理服务器存在。
以下是一个配置的简单栗子:

server {
     listen       80;   #监听80端口,可改为其他的
     server_name manage.crm;   #自定义的域名
     charset utf-8;
     index /index.html;
     add_header 'Access-Control-Allow-Origin' *; #添加允许跨域的头部信息
     #重定向#rewrite ^/ http://229492634.miss-xia-property-manage.club/;  #重定向到某个网址
     location ^~ /fee/ {        #接口里包含/fee/的,前面域名都换成以下内容
         proxy_pass https://229492634.miss-xia-property-manage.club;
     }
     location / {            #匹配不到的接口都是以下域名
         proxy_pass http://localhost:8000;
     }

}

其他更详细的内容可以查看nginx文档,简单的一个nginx配置就可以帮助我们解决调试的问题~

nginx反向代理解决跨域问题,使本地调试更方便的更多相关文章

  1. nginx反向代理解决跨域问题

    跨域:浏览器从一个域名的网页去请求另一个域名的资源时,域名.端口.协议任一不同,都是跨域 . 下表格为前后端分离的域名,技术信息:   域名 服务器 使用技术 前端 http://b.yynf.com ...

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

    在前面写的一篇文章SpringMVC 跨域,我们探讨了什么是跨域问题以及SpringMVC怎么解决跨域问题,解决方式主要有如下三种方式: JSONP CORS WebSocket 可是这几种方式都是基 ...

  3. 利用nginx 反向代理解决跨域问题

    说到nginx,不得不说真的很强大,也带来很多便利用于解决一些头疼的难题. 一般来说可以用来做:静态页面的服务器.静态文件缓存服务器.网站反向代理.负载均衡服务器等等,而且实现这一切,基本只需要改改那 ...

  4. Nginx 反向代理解决跨域问题分析

    当你遇到跨域问题,不要立刻就选择复制去尝试.请详细看完这篇文章再处理 .我相信它能帮到你. 分析前准备: 前端网站地址:http://localhost:8080 服务端网址:http://local ...

  5. nginx反向代理解决跨域

    nginx作为反向代理服务器,就是把http请求转发到另一个或者一些服务器上.通过把本地一个url前缀映射到要跨域访问的web服务器上,就可以实现跨域访问.对于浏览器来说,访问的就是同源服务器上的一个 ...

  6. vue前后分离项目部署(不同端口号,nginx反向代理解决跨域问题)

    #user nobody; worker_processes 1; #error_log logs/error.log; #error_log logs/error.log notice; #erro ...

  7. windows环境下 nginx+iis 反向代理解决跨域问题

    项目基本完成,是时候花点时间整理一下最近的姿势了 1 什么是跨域? 网上对于跨域的概念会有大篇幅的文章去解释,似乎有点玄乎,初学者很容易对这个概念产生恐惧,跨域其实很简单,其实只要知道一点,无法跨域访 ...

  8. nginx反向代理实现跨域请求

    nginx反向代理实现跨域请求 跨域请求可以通过JSONP实现,缺点是需要修改被请求的服务器端代码进行配合,稍显麻烦通过在自己服务器上配置nginx的反向代理,可以轻松实现跨域请求 思路 示例服务器A ...

  9. VUE线上通过nginx反向代理实现跨域

    1.NGINX反向代理实现跨域 VUE代码中配置参考上一篇文章 nginx配置,红色框线内: 代码: location /list { proxy_set_header X-Real-IP $remo ...

随机推荐

  1. 利用iOS原生系统进行人脸识别+自定义滤镜(GPUImage)

    人脸识别+滤镜效果(基于GPUImage实现的自定义滤镜) 最近碰到一个好玩的需求.说要客户端这边判定一下是否有人脸.在有的基础上.对相片做进一步的美化滤镜处理. 首先是人脸的识别判定; //将图片对 ...

  2. Cortex-M3 Bit-Banding

    Cortex-M3 Bit-Banding 1. 概述 CM3的存储器系统支持所谓的"位带"(bit-band)操作. 通过它,实现了对单一bit的原子操作.位带操作仅适用于一些特 ...

  3. Kafka0.7运行时报错 kafka/javaapi/consumer/ConsumerConnector : Unsupported major.minor version 51.0 解决

    目前中央库中 org.apache.kafka 是用jdk1.7编译的, 故跑在1.6的jvm中会报错 解决方案: 1. 下载kafka源码, 本地sbt进行install, 编译前 java -ve ...

  4. CentOS7 默认防火墙firewalld

    firewalld基础 firewalld是CentOS7源生支持的防火墙,firewalld最大的好处有两个:支持动态更新,不用重启服务:第二个就是加入了防火墙的“zone”概念. firewall ...

  5. elasticsearch _source字段的一些说明

    _source field The _source field contains the original JSON document body that was passed at index ti ...

  6. 【HDU 4807】Lunch Time 最小费用最大流

    题意 在一个有向图当中,现在每一条边带有一个容量,现在有K个人在起点,需要到终点去吃饭,询问这K个人最后一个人到达食堂的最小时间是多少 贴一篇题解:http://blog.csdn.net/u0137 ...

  7. 线程绑定CPU核-sched_setaffinity

    CPU亲合力就是指在Linux系统中能够将一个或多个进程绑定到一个或多个处理器上运行. 一个进程的CPU亲合力掩码决定了该进程将在哪个或哪几个CPU上运行.在一个多处理器系统中,设置CPU亲合力的掩码 ...

  8. arm-linux-gcc4.4.3编译s3c2410平台linux内核

    写在前面:2.6.14版本的内核用arm-linux-gcc4.4.3没有编译成功,下载2.6.37版本的内核用arm-linux-gcc4.4.3编译通过. 一.首先下载linux内核: linux ...

  9. 「LOJ#10068」「一本通 3.1 练习 3」秘密的牛奶运输(次小生成树

    题目描述 Farmer John 要把他的牛奶运输到各个销售点.运输过程中,可以先把牛奶运输到一些销售点,再由这些销售点分别运输到其他销售点. 运输的总距离越小,运输的成本也就越低.低成本的运输是 F ...

  10. Adobe Flash Player 27 on Fedora 27/26, CentOS/RHEL 7.4/6.9

    This is guide, howto install Adobe Flash Player Plugin version 27 (32-bit and 64-bit) with YUM/DNF o ...