简体   繁体   English

避免使用CORS预检OPTIONS以获得更好的性能

[英]Avoid CORS preflight OPTIONS for better performance

Working with a CDN provider and calling static HTML files from CDN like this. 使用CDN提供程序并从CDN调用静态HTML文件。

          $.ajax({
            url : CDNPATH,
            type : "GET",
            contentType : "text/plain; charset=utf-8",
            async : async,
            cache : true,
            processData : false,
            success : function(response, status, xhr) {
                onSuccess(response, status, xhr);
                $(document).trigger('contentReady');
            }
        });

On the homepage of the application, I have 5 static HTML files which fires 5 OPTION calls. 在应用程序的主页上,我有5个静态HTML文件,可以触发5个OPTION调用。 As you can imagine, it hurts the performance. 你可以想象,它会伤害性能。 I have seen on similar questions that it can be avoided with GET methods and text/plain , which I did as above but it didn't work. 我已经看到类似的问题,可以通过GET方法和text/plain避免它,我上面做了但是它没有用。

How can I avoid these preflight OPTIONS methods? 如何避免这些预检OPTIONS方法?

Maybe the presence of the charset param is causing the preflight? 也许charset param的存在导致了预检? Per-spec, browsers are required to ignore any params and only consider the MIME type , but maybe they're not conforming. 根据规范,浏览器需要忽略任何参数,并且只考虑MIME类型 ,但可能它们不符合要求。

A CORS-safelisted request-header is a header whose name is one of CORS安全的请求标头是一个名称为其中一个的标头

  • Accept
  • Accept-Language
  • Content-Language
  • Content-Type and whose value, once parsed, has a MIME type (ignoring parameters) that is application/x-www-form-urlencoded , multipart/form-data , or text/plain Content-Type及其值,一旦解析,就具有MIME类型(忽略参数),即application/x-www-form-urlencodedmultipart/form-datatext/plain

Elsewise I don't see what in your request would trigger a preflight. 但是,我没有看到你的请求会引发预检。 Maybe I'm missing something… 也许我错过了一些东西......


Update 2017-02-20 更新2017-02-20

OK based on information provided in a comment above it seems the source for the site contains a script element with this content: 确定基于上面评论中提供的信息 ,该网站的来源似乎包含一个包含此内容的script元素:

window["_tsbp_"] = { ba : "X-TS-BP-Action", bh : "X-TS-AJAX-Request"};

…and I've not stepped through the rest of the code to see what effect that has, but it appears to be causing an X-TS-AJAX-Request header to get added to XHR requests, triggering the preflight. ...而且我没有逐步完成代码的其余部分以查看它有什么影响,但它似乎导致X-TS-AJAX-Request标头被添加到XHR请求中,从而触发预检。


I guess the general takeaway here is: whenever you find that a request is triggering a browser to do a preflight but you don't know why, troubleshooting step number should probably be to use your browser devtools to find out exactly what request headers your code is causing to get sent out. 我想这里的一般要点是:每当你发现一个请求触发浏览器进行预检但你不知道原因时,故障排除步骤编号应该是使用你的浏览器devtools来找出你的代码的确切请求标头导致被发送出去。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM