前言

学习Angular时写了一个音乐播放器
oschina地址
github地址
为了兼容android chrome,参考了这篇文章;

在数据读取中要中断的时候,可以把audio.src设为null,并显式调用audio.load(),
此时对于Android会中断数据读取,并且canplay也不会发生

所以在我的代码中也如此使用了

1
2
_audio.src = null;
_audio.load();

但是由于百度有些音乐无法直接播放;需要服务器转发,所以音乐链接带上了服务器转发地址

问题出现

在前面几首歌上带上转发没有问题;但是当列表循环后;就出现了无法从服务器上获取音乐内容了;
查看chrome控制台,链接上显示 Provisional headers are shown

error

关闭标签;重新打开网址;音乐有又可以加载了!!!

尝试过程

刚开始以为是因为本地环境的问题;将代码挂在到服务器上,依然有问题
开始谷歌搜索 Provisional headers are shown, 在这篇文章中http://segmentfault.com/q/1010000000364871

之所以会出现这个警告,是因为去获取该资源的请求其实并(还)没有真的发生,所以 Header
里显示的是伪信息,直到服务器真的有响应返回,这里的 Header
信息才会被更新为真实的。不过这一切也可能不会发生,因为该请求可能会被屏蔽。比如说 AdBlock
什么的,当然了不全是浏览器扩展,具体情况具体分析了

但是我测试的浏览器只有开发工具,没有 AdBlock之类的;所以pass

接着 有找到这篇文章https://code.google.com/p/chromium/issues/detail?id=327581

That is because websockets never report their requestHeadersText.
Fixed for the new implementation.

在新版本中修复… 我的chrome是42;所以 pass

接着在http://stackoverflow.com/questions/21177387/caution-provisional-headers-are-shown-in-chrome-debugger
发现推荐答案依然是 AdBlock等之类的拦截, 继续看回答, 说使用 chrome://net-internals; 玩了下,根本就不知道怎么玩,pass

解决

接着往下查看 发现有个回答

I believe it happens when the actual request is not sent. Usually happens when you are loading a cached resource.

回答内容是说请求没有被发送,因为是载入缓存资源.
一想很对啊,音乐资源默认是缓存的,但是设置不缓存会让音乐加载速度太慢;继续往下查看

Another possible scenario I’ve seen - the exact same request is being
sent again just after few milliseconds (most likely due to a bug in the
client side).
In that case you’ll also see that the status of the
first request is “canceled” and that the latency is only several
milliseconds.

大概是说 完全相同的请求间隔数毫秒(太短),导致加载失败,查看了chrome控制台发现

1
2
3
http://ngmusic.coding.io/null
http://ngmusic.coding.io/serverget?url=http%3A%2F%2Ffile.qianqian.com.....
都有 Provisional headers are shown

error
error

猜想是因为 http://...../null 加载失败 导致 http://..../serverget?url=http%3A%2F%2Ffile.qianqian.com.....的缓存请求也失败(阻塞)

故将上面 null 加载去掉

1
2
// _audio.src = null;
// _audio.load();

经过测试,发现的确从缓存中获取了~~~
error

结论

Provisional headers are shown
出现在 载入缓存资源,请求没有被发送, 而如果上一个资源加载失败,可能导致从缓存加载的资源失败,
即缓存资源请求之前的请求不能失败,不然就有可能出现问题

至此,终于搞定了这个渣问题!!!!!!!!!!!!!!!!!!!!!!

解决provisional headers are shown的过程的更多相关文章

  1. javascript 解决provisional headers are shown的过程

    请求没有被发送,因为是载入缓存资源. 大概是说 完全相同的请求间隔数毫秒(太短),导致加载失败,查看了chrome控制台发现 Provisional headers are shown 出现在 载入缓 ...

  2. 解决provisional headers are shown问题

    前端通过ajax的get请求向后端发送数据,后端死活收不到. ajax代码如下: $.ajax({ url:"/news_list", type:"GET", ...

  3. http请求头出现provisional headers are shown

    http请求头出现provisional headers are shown Provisional headers are shown provisional 详细用法>> 英 [prə ...

  4. 在表单中使用ajax,成功后跳转指定页面 出现Provisional headers are shown 解决办法

    问题回顾: 在表单里面,有个button按钮,在点击这个button的时候,我发送了ajax请求,然后请求成功的话,就使用window.location.href = xxx,跳转到其他页面 但是,一 ...

  5. chrome "Provisional headers are shown"

    我的问题的,每次打开浏览器,点开有视频的页面(云平台的存储),然后当视频还没有加载完,就马上关闭,连续操作很多次(测试的暴力测试把),F12查看就有很多很多在加载中的连接,因为连续点击太多次了,第一个 ...

  6. nginx : server_name localhost 和 chrome : Provisional headers are shown

    问题相关问题现象:解决思路解决方案总结 问题相关 nginx : server_name localhost chrome : Provisional headers are shown 问题现象: ...

  7. 使用laravel-admin后台sdk报错Failed to load resource: net::ERR_CERT_AUTHORITY_INVALID、Provisional headers are shown

    报错Failed to load resource: net::ERR_CERT_AUTHORITY_INVALID请先确定自己的资源url是否可以确实访问到(地址正确与否.访问权限是否开启等) 若n ...

  8. nginx Provisional headers are shown

    项目用的Nginx做的代理,重启电脑后,重启项目和Nginx 浏览器报 Provisional headers are shown  解决: host文件添加: 127.0.0.1   cleaner ...

  9. provisional headers are shown 知多少

    前言 请求里面provisional headers are shown(显示临时报头) 出现的情况很多,但原因是多样的. 如果你去直接匹配关键字搜索,得到的结果可能与你自己的情况大相径庭. 网上大部 ...

随机推荐

  1. L222 词汇题

    Some psychologists argue that the traditional idea “spare the rod and spoil the child” is not ration ...

  2. Python学习(001)--计算机基础

    操作系统发展历史 操作系统并不是与计算机硬件一起诞生的,它是在人们使用计算机的过程中,为了满足两大需求:提高资源利用率.增强计算机系统性能,伴随着计算机技术本身及其应用的日益发展,而逐步地形成和完善起 ...

  3. Thrift之双向通讯

    在实际应用中,却经常会有客户端建立连接后,等待服务端数据的长连接模式,也可以称为双向连接.一.双连接,服务端与客户端都开ThriftServer如果网络环境可控,可以让服务端与客户端互相访问,你可以给 ...

  4. 【计算机视觉】ARM平台实现人脸检测YSQfastfd

    ARM平台实现于仕琪人脸检测库YSQfastfd 平台要求 ARM32 platform hardware board Ubuntu 16.04 with GTK3 library USB camer ...

  5. HDOJ 1061 Rightmost Digit

    找出数学规律 原题: Rightmost Digit Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Ja ...

  6. Properties类与配置文件

    //加载文件public static void testLoadProperties() throws Exception { Properties properties = new Propert ...

  7. mac OS 安装 scikit-learn

    最近用来做实验,使用python时发现scikit-learn提供的库非常好用.因此,在电脑上果断下载安装: step1: sudo easy_install pip step2: sudo pip ...

  8. es6语法快速上手(转载)

    一.相关背景介绍 我们现在大多数人用的语法javascript 其实版本是ecmscript5,也是就es5.这个版本己经很多年了,且完美被各大浏览器所支持.所以很多学js的朋友可以一直分不清楚es5 ...

  9. 1、ECMAScript 6 简介

    ECMAScript 和 JavaScript 的关系 ES6 与 ECMAScript 2015 的关系 语法提案的批准流程 ECMAScript 的历史 部署进度 Babel 转码器 Traceu ...

  10. 转 DataTorrent 1.0每秒处理超过10亿个实时事件

    DataTorrent是一个实时的流式处理和分析平台,它每秒可以处理超过10亿个实时事件. 与Twitter平均每秒大约6000条微博相比,最近发布的DataTorrent 1.0似乎已经超出了需求, ...