插入B站小视频
2017-11-23 本文已影响0人
Julian1009
最近尝试在页面插入B站的视频,没有接口那就用分享视频的地址吧
举个栗子而已,请忽略视频
<embed height="415" width="544" quality="high"
allowfullscreen="true" type="application/x-shockwave-flash"
src="//static.hdslb.com/miniloader.swf"
flashvars="aid=170001&page=1"
pluginspage="//www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash">
</embed>
于是我选用了上图的Html地址
,就先 hard code 把这H5代码粘贴过来用用。
可是结果失败了
看了下调试栏,一片403
那试试iframe
标签吧,链接就用Flash地址
<iframe src="https://static.hdslb.com/miniloader.swf?aid=170001&page=1"
width="600" height="400"
scrolling="no" border="0" frameborder="no" framespacing="0">
</iframe>
效果出来了。但是出现了意想不到的问题,同事的电脑浏览器打开页面后,没有播放视频,而是下载了一个.swf
的文件,而我们同样的浏览器对Flash的配置
,Chrome 浏览器版本一致(Version 62.0.3202.94 (Official Build) (64-bit)),Adobe Flash 的版本一致(查询Flash版本传送门),同为27.0.0.187。
最终这个问题没有解决。
但是在看到视频结束的时候,又有一个分享,点开看到分享的Html地址
与视频下方的分析不一致。加上需要的宽高后,代码如下
<iframe src="//www.bilibili.com/blackboard/player.html?aid=170001&cid=279786&page=1"
width="600" height="400"
scrolling="no" border="0" frameborder="no" framespacing="0"></iframe>
这样跳过了上面的那个问题,也不会有403。
但是高度调整到一定数值,右侧就会出现弹幕区,如图
再次请忽略视频没有文档就是这么不好,怎么改都不知道。
好在发现别人以前关于B站视频的总结[1],给了我点启发。
文中示例URL中有这样两个参数,在别的地方没见过
我也尝试加上这个参数,效果就没有右侧的弹幕区了,完美!
这个时候多希望能有一份文档让我看看,就不至于这么猜接口了。
所以最终的代码是这样的
<iframe src="//www.bilibili.com/blackboard/player.html?aid=170001&cid=279786&page=1&as_wide=1"
width="600" height="400"
scrolling="no" border="0" frameborder="no" framespacing="0"></iframe>