前言

学习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. SharePoint Infopath表单服务-PowerShell

    1. 激活可浏览的表单模板 Set-SPInfoPathFormsService -AllowUserFormBrowserEnabling $true -AllowUserFormBrowserRe ...

  2. 2.2 linux中的信号分析

    信号: 信号是UNIX系统响应某些状况而产生的事件,进程在接收到信号时会采取相应的行动. 信号是因为某些错误条件而产生的,比如内存段冲突.浮点处理器错误或者非法指令等. 信号是在软件层次上对中断的一种 ...

  3. linux shell except tcl login ssh Automatic interaction

    /*************************************************************************************** * linux she ...

  4. 【linux基础】生成目录下所有图片的路径

    command ls *.jpg > list.txt result .png .png .png .png .png command ls /home/xxx/input/*.png > ...

  5. chapter02 朴素贝叶斯分类器对新闻文本数据进行类型预测

    基本数学假设:各个维度上的特征被分类的条件概率之间是相互独立的.所以在特征关联性较强的分类任务上的性能表现不佳. #coding=utf8 # 从sklearn.datasets里导入新闻数据抓取器f ...

  6. git的使用基础

    /*游戏或者运动才能让我短暂的忘记心痛,现如今感觉学习比游戏和运动还重要——曾少锋*/ 在Git-Bash中配置自己的名字和Email: git config --global user.name & ...

  7. Executor 框架详解

    框架最核心的类是ThreadPoolExecutor,它是Java线程池的实现类,通过Executors工具类,可以创建3种类型的ThreadPoolExecutor: 首先附上ThreadPoolE ...

  8. CTF-练习平台-Misc之 猜?

    六.猜? 打开图片后发现是一个半个脸被遮住的美女,再联系到题目是“猜”,答案又是一个人的名字全拼,所以熟悉的人都知道这是刘亦菲,把拼音输进去就可以啦.

  9. smarty学习——组合修改器

    对于同一个变量,你可以使用多个修改器.它们将从左到右按照设定好的顺序被依次组合使用. 使用时必须要用"|"字符作为它们之间的分隔符. 比如: {#userinfoname#} {# ...

  10. BMP、GIF、JPEG、PNG以及其它图片格式简单介绍

    版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/songjinshi/article/details/37516649 BMP格式 BMP是英文Bit ...