原理

使用iframe标签,更改其中src的aid和cid,使其对应要插入的视频,即可在文章内插入bilibili视频

获取cid

方法一:通过分享链接

aid即为视频的av号,cid有两种获取方式,一是通过bilibili分享按钮直接可以看到嵌入代码,将代码内的cid复制即可。
分享链接嵌入代码

可以得到这样的代码:

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

方法二:通过网页源代码

右键,查看网页源代码(不能F12,F12看不到cid)
ctrl+f 搜索cid,即可找到对应的cid。

插入方法

直接使用bilibili分享链接的嵌入代码,样式较丑,我们自己调整一下参数,这里我已经调好了。
编辑html原代码,插入以下代码,修改下cid和aid即可。

<div style="position: relative; padding: 30% 45%;">
<iframe style="position: absolute; width: 100%; height: 100%; left: 0; top: 0;" src="https://player.bilibili.com/player.html?cid=【对应cid】&aid=【对应aid】&page=1&as_wide=0&high_quality=1&danmaku=0" frameborder="no" scrolling="no"></iframe>
</div>

各项参数说明

如果想自己调整参数的话,可以参考下:

  • aid
    视频ID就是B站的 avxxxx 后面的数字
  • cid
    应该是客户端id, clientId 的缩写(推测的, 不一定准确)经过测试, 这个字段不填也没关系
  • page
    第几个视频,
    起始下标为 1 (默认值也是为1)就是B站视频, 选集里的, 第几个视频分p
  • as_wide
    是否宽屏,
    1: 宽屏, 0: 小屏
  • high_quality
    是否高清,
    1: 高清, 0: 最低视频质量(默认)
    如视频有 360p 720p 1080p 三种, 默认或者 high_quality=0 是最低 360p
    high_quality=1 是最高1080p
  • danmaku
    是否开启弹幕,
    1: 开启(默认), 0: 关闭

示例

随便拿我剪的一个视频举例

参考链接

https://www.cnblogs.com/artoriax/p/10364915.html
https://www.cnblogs.com/wkfvawl/p/12268980.html