ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

关于博客园内嵌入bilibili视频

2020-02-06 16:02:08  阅读:247  来源: 互联网

标签:园内 视频 嵌入 cid 代码 bilibili aid


一、原理

使用iframe标签,更改其中src对应bilibili视频的aid和cid,组装新的HTML源码,即可在文章内嵌入bilibili视频。

二、获取aid和cid

aid为视频的av号,但是每个av号下不一定只有1p,所以B站用cid来管理视频的真正id,那么也可以说如果视频只有1p,那么cid就无用了,我测试直接填1也是可以的。

这里介绍两种获取aid和cid的方法:

方法一

先观察视频的URL

https://www.bilibili.com/video/av84267566?from=search&seid=13400362594908841480

 其中84267566就是av号。

或者直接点,右键——查看网页源代码——ctrl+f——搜索'aid='、‘cid=’ 就可以了。

方法二(推荐)

我们在转发视频的时候直接可以看到嵌入代码

 

这是官方准备的嵌入代码,可以直接拿来用,但是显示效果不是很理想,样式不是我们希望的,需要调整一下。

<iframe src="//player.bilibili.com/player.html?aid=84267566&cid=145147963&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

从嵌入代码中我们直接得到了aid和cid

我们重新设置一下功能、大小、样式,得到可用的HTML代码

<p><iframe src="//player.bilibili.com/player.html?aid=84267566&amp;cid=145147963&amp;page=1" frameborder="no" scrolling="no" width="95%" height="600"></iframe></p>

以后插入需要的bilibili视频只需要改变上面的aid和cid就可以了!

三、嵌入方法

选择tinyMCE编辑器,这是博客园默认的编辑器,选择编辑html原代码,插入上面的代码即可。

 

四、示例

这里给出2020拜年祭的《万古生香》

万古千秋,代代有玲珑气象!
风云史往,页页赋秀骨生香!

 

<iframe frameborder="no" height="600" scrolling="no" src="//player.bilibili.com/player.html?aid=84267566&cid=145147963&page=1" width="95%"></iframe>

标签:园内,视频,嵌入,cid,代码,bilibili,aid
来源: https://www.cnblogs.com/wkfvawl/p/12268980.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有