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

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

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

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

第一次是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. [转载]Oracle触发器用法实例详解

    本文实例讲述了Oracle触发器用法.分享给大家供大家参考,具体如下: 一.触发器简介 触发器的定义就是说某个条件成立的时候,触发器里面所定义的语句就会被自动的执行. 因此触发器不需要人为的去调用,也 ...

  2. upw,c#,启用后台播放控件

    uwp音视频app,启用后台播放控件. 启用控件 SystemMediaTransportControls systemMedia_TransportControls = SystemMediaTra ...

  3. mongdb学习

    1.启动mongdb 服务(注启动之前把data 文件夹清空) 2.开发和jpa一样 只是extendMongoRepository 3.实体类只有id注解,属性全为String

  4. pgsql常用操作

    pgsql备份: --进入pgsql容器docker exec -it 容器ID bash --备份pgsql /opt/rh/rh-postgresql95/root/usr/bin/pg_dump ...

  5. mssql sqlserver时间戳与时间格式互相转换的方法分享

    转自: http://www.maomao365.com/?p=9336 摘要: 下文讲述mssql中时间戳和时间格式的转换方法,如下所示: 实验环境:sql server 2008 R2 时间戳简介 ...

  6. TCP状态转换(图解+文字解说)

    <深入分析 javaweb 技术内幕>P38 读书扩展 作者:淮左白衣 写于2018年4月12日20:58:36 目录 TCP状态转换图解 图解三次握手 文字讲解三次握手: 图解四次挥手 ...

  7. Python 基础教程 | 菜鸟教程

    https://www.runoob.com/python/python-install.html

  8. 系统集成Facebook授权发布帖子以及获取帖子评论等功能

    公司的业务和海外贸易紧密连接,项目中需要对接Facebook.Google.Twitter相关API,下面详细描述一下我们对接Facebook中遇到的问题 1,注册Facebook账户,Faceboo ...

  9. spring cloud微服务实践五

    本篇我们来看看怎么实现spring cloud的配置中心. 在分布式系统中,特别是微服务架构下,可能会存在许多的服务,每个服务都会存在一个或多个的配置文件.那怎么多的配置文件的管理就会成为一个大问题. ...

  10. go实现简单的tcp编程

    服务端的代码 package main import ( "fmt" "net" ) func main () { fmt.Println("star ...