公司项目从前后端不分离转到前后端分离

首先遇到的问题就是前后端分离的时候跨域的问题

但是当跨域成功配置并且能访问成功的时候发现

每次客户端的请求都会发送两次

第一次是OPTIONS的请求,然后才是正常的请求

查阅资料得到的结论是:

第一个OPTIONS的请求是由Web服务器处理跨域访问引发的。

OPTIONS是一种“预检请求”,浏览器在处理跨域访问的请求时如果判断请求为复杂请求,则会先向服务器发送一条预检请求,根据服务器返回的内容浏览器判断服务器是否允许该请求访问。如果web服务器采用 CORS 的方式支持跨域访问,在处理复杂请求时这个预检请求是不可避免的。

一句话概括:因为我们公司的token通过header传递所以导致了浏览器判断该请求是复杂请求,所以要先通过OPTIONS请求进行预检查
解决方法
设置Access-Control-Max-Age(指定本次预检请求的有效期,单位秒)

nginx配置增加

location /wechat/ {
add_header ‘Access-Control-Max-Age’ 86400;
proxy_pass http://wechat/rest/;
}

nginx配置跨域之后前后端调用,二次请求的更多相关文章

  1. eclipse加速/Nginx配置跨域代理

    下班时间到啦! --下班都是他们的,而我,还是什么都没有. eclipse加速 去掉包含js文件的包的js验证,否则每次启动都需要进行校验(右击项目->properties) Nginx配置跨域 ...

  2. NGINX: 配置跨域请求

    说明: 内容全部来自 SegmentFault Developer Nginx 配置跨域请求 跨域请求失败, nginx 报错: 403 No 'Access-Control-Allow-Origin ...

  3. nginx配置跨域、gzip加速、代理详细讲解

    1.配置跨域 这个很简单,直接打开配置nginx.conf ,在http下配置下面三行代码:当然如果你是想某一个虚拟主机下跨域,那就在哪个server下面添加 add_header Access-Co ...

  4. 前后端分离跨域 关于前后端分离开发环境下的跨域访问问题(angular proxy=>nginx )

    前后端分离后遇到了跨域访问的问题: angular1中使用proxy很麻烦,最后还是失败结束:最后总结3种方法如下: 本人使用的第一种方法,只是开发环境下使用很方便! 1:禁掉谷歌的安全策略(Turn ...

  5. nginx配置跨域之后每次访问会发送两次请求

    公司项目从前后端不分离转到前后端分离 首先遇到的问题就是前后端分离的时候跨域的问题 但是当跨域成功配置并且能访问成功的时候发现 每次客户端的请求都会发送两次 第一次是OPTIONS的请求,然后才是正常 ...

  6. Nginx配置跨域支持功能

    跨域是前端开发中经常会遇到的问题,前端调用后台服务时,通常会遇到 No 'Access-Control-Allow-Origin' header is present on the requested ...

  7. nginx配置跨域问题

    1.跨域指的是浏览器不能执行其它网站的脚本,它是由浏览器的同源策略造成的,是浏览器对JavaScript 施加的安全限制. 2.浏览器在执行脚本的时候,都会检查这个脚本属于哪个页面,即检查是否同源,只 ...

  8. Nginx配置跨域请求 CORS

    当出现403跨域错误的时候 No 'Access-Control-Allow-Origin' header is present on the requested resource,需要给Nginx服 ...

  9. Nginx配置跨域请求 Access-Control-Allow-Origin *

    当出现403跨域错误的时候 No 'Access-Control-Allow-Origin' header is present on the requested resource,需要给Nginx服 ...

随机推荐

  1. TCP通信的文件上传案例

  2. 处理人际关系的5大原则zz

    人际关系题是结构化面试当中重要的题型之一,人们常用两个“70%”来形容人际关系的重要性: 人际关系题主要考察考生不同人际关系间的适应性.人际合作的主动性.处理人际关系的原则性和灵活性以及对组织中权属关 ...

  3. windows使用sqlpus连接oracle 数据库

    1.先安装好Instant Client程序. 2.打开cmd 执行sqlplus命令,如果出现如下图 2.说明需要把oracle install 的bin目类 添加系统环境path中,如下图添加环境 ...

  4. Feign【token传递】

    使用feign调用服务的时候,存在一个问题,比如当前服务调用A服务,在请求头中包含了某些特殊的字段信息,比如当前操作人的token信息,调用A的时候可以正常拿到token,然而在去调用B服务的时候,可 ...

  5. Counting Cliques(HDU-5952)【DFS】

    题目链接:https://vjudge.net/problem/HDU-5952 题意:有一张无向图,求结点数量为S的团的数量. 思路:如果不加一点处理直接用DFS必然会超时,因为在搜索过程中会出现遍 ...

  6. eclipse怎样修改同名包(package)的显示样式、格式

    打开我们的项目,可以看到左侧的package看上去特别多,没有层级. 点击Package Explorer右上角的箭头图标. 可以看到“Flat(扁平)”,“Hierarchical(分层)”两个选项 ...

  7. IdentityServer4同时使用多个GrantType进行授权和IdentityModel.Client部分源码解析

    首先,介绍一下问题. 由于项目中用户分了三个角色:管理员.代理.会员.其中,代理又分为一级代理.二级代理等,会员也可以相互之间进行推荐. 将用户表分为了两个,管理员和代理都属于后台,在同一张表,会员单 ...

  8. c#基础知识梳理(三)

    上期回顾 - https://www.cnblogs.com/liu-jinxin/p/10824638.html 一.方法 一个方法是把一些相关的语句组织在一起,用来执行一个任务的语句块.每一个 C ...

  9. 2、JDK8中的HashMap实现原理及源码分析

    本篇提纲.png 本篇所述源码基于JDK1.8.0_121 在写上一篇线性表的文章的时候,笔者看的是Android源码中support24中的Java代码,当时发现这个ArrayList和Linked ...

  10. MyBatis工厂工具类 MyBatisUtils

    import org.apache.ibatis.io.Resources; import org.apache.ibatis.session.SqlSession; import org.apach ...