location /joinus {
# 允许跨域请求的“域”,有些请求不允许*
add_header 'Access-Control-Allow-Origin' $http_origin always;# 不标注always 发生500 400错误时候会导致跨域失效
# 允许客户端提交Cookie
add_header 'Access-Control-Allow-Credentials' 'true';
# 允许客户端的请求方法
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, DELETE, PUT';
# 允许客户端提交的的请求头
add_header 'Access-Control-Allow-Headers' $http_access_control_request_headers;
# 允许客户端访问的响应头
add_header 'Access-Control-Expose-Headers' 'Cache-Control, Content-Language, Content-Type, Expires, Last-Modified, Pragma, satoken';
# 处理预检请求
if ($request_method = 'OPTIONS') {
# 预检请求缓存时间
add_header 'Access-Control-Max-Age' 1728000;
add_header 'Access-Control-Allow-Origin' $http_origin;
add_header 'Content-Type' 'text/plain; charset=utf-8';
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, DELETE, PUT';
# 允许客户端提交的的请求头
add_header 'Access-Control-Allow-Headers' $http_access_control_request_headers;
# 允许客户端访问的响应头,根据自己实际需要添加,比如我用到了satoken就加入了对应的header
add_header 'Access-Control-Expose-Headers' 'Cache-Control, Content-Language, Content-Type, Expires, Last-Modified, Pragma, satoken';
add_header 'Content-Length' 0;
add_header 'Access-Control-Allow-Credentials' 'true';
return 204;
}
#关闭重定向,如果出现POST变GET的情况,请务必加上此句。
proxy_redirect off;
proxy_pass http://127.0.0.1:8099; }

尤其注意if语句,如果你在if语句里直接return,if外面的add_header会失效,这样导致虽然浏览器的OPTIONS请求正常,但是带上token之类的header,请求就会直接CORS错误。不少其他网络资料都没有提到这点。

经过测试解决springboot和vue之间跨域通信的问题。

前端通过nginx解决跨域也可以,这样会更简单一些。

后端跨域问题究极解决 nginx+springboot 解决OPTIONS通过却报CORS的问题的更多相关文章

  1. 使用nginx反向代理处理前后端跨域访问

    本文主要解决:使用nginx反向代理处理前后端跨域访问的问题 1.何为跨域访问? 以下类型为跨域访问 1)不同域名间访问 www.zuiyoujie.com和www.baidu.com 2)同域名不同 ...

  2. vue中axios访问Java后端跨域问题解决

    问题背景: 前后端分离,前端选用Vue,后端选用Java,vue编译出的静态页面采用ngix发布,在前端访问后端时出现跨域问题. 解决方法: 跨域的问题解决方法有好多种,这里是通过服务端解决,以下是代 ...

  3. Vue中axios访问 后端跨域问题

    public class AllowOriginFilter implements Filter { @SuppressWarnings("unused") public void ...

  4. 用Nginx代理请求,处理前后端跨域

    自从前端spa框架出现后,都是前后端分离开发了.我们在开发的时候难免会遇到跨域的问题.跨域这种问题解决的方法基本都是在服务端实现的.以java为例,我知道的有3种方法处理跨域: 1.使用 @Cross ...

  5. 简单设置,解决使用webpack前后端跨域发送cookie的问题

    最近用vue来做项目,用webpack来做前端自动化构建.webpack-dev-server会在本地搭建一个服务器,在和后端调试的时候,就会涉及到跨域的问题. 刚开始时,没有用vue-cli来构建项 ...

  6. 前端解决跨域问题的终极武器——Nginx反向代理

    提到代理,分为:正向代理和反向代理. 正向代理:就是你访问不了Google,但是国外有个VPN可以访问Google,你访问VPN后叫它访问Google,然后把数据传给你. 正向代理隐藏了真实的客户端. ...

  7. 最简单实现跨域的方法:用 Nginx 反向代理

    本文作者: 伯乐在线 - 良少 .未经作者许可,禁止转载!欢迎加入伯乐在线 专栏作者. 什么是跨域 跨域,指的是浏览器不能执行其他网站的脚本.它是由浏览器的同源策略造成的,是浏览器对javascrip ...

  8. 跨域访问 - 跨域请求 同源策略概念对跨域请求的影响 及几种解决跨域请求的方法如 jsonp

    为什么会设置同源策略 > 适用于浏览器的一种资源访问策略 > 同源策略(Same origin policy)是一种约定,它是浏览器最核 心也最 基本的安全功能,如果缺少了同源策略,则浏览 ...

  9. 前后端跨域 _ cross domain

    1. 解决跨域既可以从前端, 也可以从后端. 参考好的网络资源: http://www.cnblogs.com/vajoy/p/4295825.html

随机推荐

  1. CoaXPress 接口相机的控制方法--1

    GenICam 介绍 简而言之,GenICam 定义了一个通用的相机接口,使得应用程序的编写.相机的控制可以与具体的型号解耦,这样就可以设计出通用的软件完成对不同相机的控制.我们实际使用的CoaXPr ...

  2. jquery里的Ajax解析

    现在对Jquery的Ajax进行详细的解析. 顺带,我会在后面把我整理的一整套CSS3,PHP,MYSQL的开发的笔记打包放到百度云,有需要可以直接去百度云下载,这样以后你们开发就可以直接翻笔记不用百 ...

  3. NET命令入侵实例

    实验目的 了解NET入侵的过程 掌握NET命令的使用方法和它的参数搭配 实验内容 NET命令的使用方法和它的参数搭配 实验环境描述 XP作为客户端,Windows server 2003作为远程服务器 ...

  4. iOS自动化测试驱动工具探索

    本文主要介绍了字节 iOS 自动化测试驱动工具的探索过程及实现原理 作者:字节跳动终端技术--陈友辉 一.背景 随着业务的扩张,单个 App 的功能越来越多,工程复杂度越来越高,每天MR可达上百次,代 ...

  5. python的标识符&&关键字

    和Java语言一样,python也有标识符和关键字.那么,你是否知道python的关键字呢?一起先从标识符了解python吧. 什么是标识符? 标识符,开发人员在开发过程中自定义的一些符号和名称. 标 ...

  6. JDK安装及JAVA_HOME配置

    1.用yum list搜索合适的JDK yum list java-1.8* 这里选用jdk1.8版本,在列表中找到java-1.8.0-openjdk.x86_64. 2.用yum安装JDK yum ...

  7. DatePicker去掉头布局的两种方法

    5.0+ private void hideDatePickerHeader() { ViewGroup rootView = (ViewGroup) datePicker.getChildAt(0) ...

  8. 面试中的MySQL主从复制|手撕MySQL|对线面试官

    关注微信公众号[程序员白泽],进入白泽的知识分享星球 前言 作为<手撕MySQL>系列的第三篇文章,今天讲解使用bin log实现主从复制的功能.主从复制也是MySQL集群实现高可用.数据 ...

  9. List分组和排序

    1 //分组 2 var ll= lst.GroupBy(x => new { x.Id, x.Name }).Select(x => new 3 { 4 Key = x.Key, 5 I ...

  10. Java中的单利模式

    单利模式 单例模式(Singleton Pattern)是 Java 中最简单的设计模式之一.这种类型的设计模式属于创建型模式,它提供了一种创建对象的最佳方式. 这种模式涉及到一个单一的类,该类负责创 ...