zoukankan      html  css  js  c++  java
  • 跨域避免 option 请求

    悟空H5专题采用的是前后端分离方案,服务器域名和专题域名不一致,会受到浏览器同源策略影响。

     

    我们发现数据主接口会发起两次,其中第一个请求为预检请求。

     

    一般来说使用 application/json 的 post 请求是必然会带入 OPTION 请求,何为 OPTION 预检:

    用于获取目的资源所支持的通信选项。客户端可以对特定的 URL 使用 OPTIONS 方法,也可以对整站(通过将 URL 设置为“*”)使用该方法。

     

    在 CORS 中,可以使用 OPTIONS 方法发起一个预检请求,以检测实际请求是否可以被服务器所接受。预检请求报文中的 Access-Control-Request-Method 首部字段告知服务器实际请求所使用的 HTTP 方法;Access-Control-Request-Headers 首部字段告知服务器实际请求所携带的自定义首部字段。服务器基于从预检请求获得的信息来判断,是否接受接下来的实际请求。

     

    有趣的是专题详情为 GET 接口,为何 GET 请求也会发起 option 预检?

     

    这个原因得从简单请求和复杂请求说起,跨域请求分为简单和复杂两种:

     

    简单请求:

     

    请求方式为如下之一:

    HEAD

    GET

    POST

     

    HTTP 请求头只能包含如下信息:

    Accept

    Accept-Language 

    Content-Language 

    Last-Event-ID 

    Content-Type,但仅能是下列之一 

    application/x-www-form-urlencoded 

    multipart/form-data 

    text/plain

     

    任何一个不满足上述要求的请求,即被认为是复杂请求。一个复杂请求不仅有包含通信内容的请求,同时也包含预检信息。

     

     

     

    专题配置接口请求头中带有自定义 header,浏览器会认定为非简单请求,需要向服务器发出检查,判断该域名是否允许跨域。

     

    经过分析发现,自定义 header 其实在此业务场景中非必传自带,发出预检请求至少会有 100ms 的耗时,无形中延长页面绘制时间。

     

    最终解决方案:去除自定义header,修改为简单请求,避免该请求发出预检

  • 相关阅读:
    EF 简单的 CRUD、分页 代码笔记
    C#中的正则 Regex类
    动态字符串 Stringbuilder类
    C# 字符串操作
    集合简单总结 ArrayList、List、Hashtable、Dictionary
    C#面向对象2 静态类、静态成员的理解
    C#面向对象1 类 以及 类的继承(new、ovverride)
    无法从命令行或调试器启动服务,必须首先安装Windows服务(使用installutil.exe),然后用ServerExplorer、Windows服务器管理工具或NET START命令启动它
    WebClient上传音频文件
    发布网站详细步骤(.Net)
  • 原文地址:https://www.cnblogs.com/mengfangui/p/13474761.html
Copyright © 2011-2022 走看看