[836]详解Provisionalheadersareshown

前言

我们在发送异步请求遇到问题的时候&＃xff0c;都会先打开Chrome的控制台来看一下http请求&＃xff0c;有时候会在请求头看到Provisional headers are shown的报错

问题描述&＃xff1a;

这个问题字面意思是“显示了临时报文头”&＃xff0c;浏览器第一次发送这个请求&＃xff0c;请求被阻塞&＃xff0c;未收到响应。当要求浏览器再次发送这个请求时&＃xff0c;上个同样的请求都还没有收到响应&＃xff0c;浏览器就会报这个警告。

简而言之&＃xff0c;就是请求并没有发出去。

原因分析

这种情况出现的情况很多&＃xff0c;但原因是多样的&＃xff0c;一般有如下几种&＃xff1a;

1. 跨域请求被浏览器拦截

现在网站的静态资源都会存在专门的静态域名下面&＃xff0c;和实际访问的域名可能不一致。

这种情况基本发生在ajax请求&＃xff0c;都是基于CORS来解决这个问题。

$.ajax({url: ajaxUrl,type: &＃39;GET&＃39;,success: function (res) {}});

可以替换为

$.cors(ajaxUrl, {}, function (json) {if (json.code &＃61;&＃61; 0) {}});

2. 服务器未及时响应&＃xff08;超时&＃xff09;

这种特定情况下才会出现&＃xff0c;跟服务器关联不大。

3. 请求被浏览器插件拦截

作为一个开发人员&＃xff0c;大家的chrome上肯定装了不少的插件。我们可以通过 chrome://net-internals&＃xff0c;这个地址已弃用&＃xff0c;新地址&＃xff1a;chrome://net-export/
&＃xff0c;来根据关键字查找相关请求&＃xff0c;然后具体去看相关状态。另外&＃xff0c;被浏览器拦截&＃xff0c;可以换个浏览器试试。

处理方式&＃xff1a;调用chrome的  chrome://net-internals/#events &＃xff0c;然后重新触发一下请求&＃xff0c;然后查看出现 Provisional headers are shown 的请求的日志&＃xff1b;

查看是否存在 delegate_blocked_by 的关键字&＃xff1b;这种一般是由于浏览器端的插件或客户端的软件对请求进行了拦截&＃xff1b;我们出现的情况&＃xff0c;是被 websense endpoint拦截&＃xff1b;

如果是这种情况&＃xff0c;基本上可以忽略啦&＃xff0c;客户端自身的问题啦&＃xff1b;可以考虑将插件或软件卸载后&＃xff0c;重新尝试&＃xff0c;看是否还出现&＃xff1b;

4. 该数据直接采用了缓存&＃xff0c;并没有发送请求

只从缓存中获得的通信显示为“显示临时标题”&＃xff08;或“执行”&＃xff09;&＃xff0c;因为该文件是从缓存中获取的&＃xff0c;并且未进行通信&＃xff0c;所以并不会显示详细标头。

如果上一个资源加载失败&＃xff0c;可能导致从缓存加载的资源失败&＃xff0c;即缓存资源请求之前的请求不能失败。强缓存from disk cache或者from memory cache&＃xff0c;此时也不会显示。

前面提到的那么多情况&＃xff0c;其实都是与服务器没有进行或者完成正确的通信&＃xff0c;所以只展示临时信息。

扩展

CORS是一个W3C标准&＃xff0c;全称是"跨域资源共享"&＃xff08;Cross-origin resource sharing&＃xff09;&＃xff0c;它允许浏览器向跨源服务器&＃xff0c;发出XMLHttpRequest请求&＃xff0c;从而克服了AJAX只能同源使用的限制&＃xff0c;以避开浏览器的同源策略&＃xff0c;是 JSONP 模式的现代版。

与 JSONP 不同&＃xff0c;CORS 除了 GET 要求方法外&＃xff0c;也支持其他的 HTTP 请求。用 CORS 可以让网页设计师用一般的 XMLHttpRequest&＃xff0c;这种方式的错误处理比 JSONP 好。另一方面&＃xff0c;JSONP可以在不支持 CORS 的老旧浏览器上运作&＃xff0c;现代浏览器都支持 CORS。

来源&＃xff1a;https://www.jianshu.com/p/4cfa40121ecf
https://blog.csdn.net/starsnow123/article/details/78675240