typecho 在文章中添加 bilibili 视频

一、获取视频来源:

可以有2种方式来定位一个 bilibili 视频:

  • 第一种是使用 bvid 参数定位
  • 第二种是使用 aid 参数定位

如何获取这两个参数?

首先我们可以看看 bilibili 网站中的视频页面链接其实可以分为两种:

  • 第一种是类似:https://www.bilibili.com/video/BV17B4y1R775 这样的,这里BV后面的 17B4y1R775 就是当前视频的 bvid
  • 第二种是类似:https://www.bilibili.com/bangumi/play/ep733316?spm_id_from=333.337.0.0 这样的,看不到 bvid,但可以在视频处右键,点击“复制视频地址(精准空降)”,从而得到类似 https://www.bilibili.com/video/av478818261?t=205.6 的网址,这里 av 后面的 478818261 就是当前视频的 aid

但是,不管那种地址,我们都可以通过查看 bilibili 视频所在网页的源代码来找到这些参数的值。

方法:在 bilibili 视频页面,右键查看源代码,然后按 ctrl+F 组合键搜索"aid",“bvid”(带引号搜索可以精准定位)

例如,对于第二种视频,我们搜索 “aid” 可以找到647个值,每个值对应一个视频,首先看第一个 aid 的值为 478818261 ,并且往后看可以发现"bvid": “BV1vT411d7QE”, “cid”: 1022370693,以及 “long_title”: “凡人风起天南1重制版”。long_title的值就是这个视频的标题(第一集),而另一个定位视频的 bvid 的值也同样找到了,就是 1vT411d7QE 。

第一种视频还提供了“嵌入代码”,直接使用这些代码就可达到引用的效果。

方法:在 bilibili视频下方有个点击复制链接的图标,移动至图标会弹出一个对话框,对话框下方如果有“嵌入代码”,点击即可复制该代码。

例如,泽泽社长的这个视频 https://www.bilibili.com/video/BV1uS4y1S7E6,我们可以找到他的“嵌入代码”为:

<iframe src="//player.bilibili.com/player.html?aid=725087364&bvid=BV1uS4y1S7E6&cid=556589728&p=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

这是操作截屏:

在这里插入图片描述

二、引用视频

1. 视频引用的 CSS 样式

/* bilibili视频挂载样式 */
.iframe_div {position: relative;width: 100%;height: 0;
}.iframe_div .iframe_video {position: absolute;width: 100%;height: 100%;left: 0;top: 0
}

2. 引用视频可通过 <iframe> 标签来实现,有 2 种方法:

第一种方法

<div class="iframe_div"><iframe class="iframe_video" src="//player.bilibili.com/player.html?aid=478818261"> </iframe>
</div><!-- 或者 -->
<div class="iframe_div"><iframe class="iframe_video" src="//player.bilibili.com/player.html?bvid=1vT411d7QE"> </iframe>
</div>

还有以下参数可以控制视频的显示:

参数说明
page第几个视频, 起始下标为 1 (默认值也是为1) 就是B站视频选集里的第几个视频
as_wide是否宽屏 1: 宽屏, 0: 小屏
high_quality是否高清 1: 高清, 0: 最低视频质量(默认),不过因为要 bilibili 对于高清视频要求登陆的远古,往往设置了高清也无效。
danmaku是否开启弹幕 1: 开启(默认), 0: 关闭

因此,上面的引用还可以完善为:

<div class="iframe_div"><iframe class="iframe_video" src="//player.bilibili.com/player.html?aid=478818261&page=1&danmaku=0&as_wide=1&high_quality=1"> </iframe>
</div>

这种方式可以显示与 bilibili 网站中界面一致的视频界面,而且点击视频可以直接链接到 bilibli 网站,但要素太多,有时候并不喜欢。
不过在手机浏览器中使用这种方法的前提是视频在分享那里提供了“嵌入代码”,没有提供这个潜入代码的视频在手机浏览器中会无法正常播放。

第二种方法:

这种方法只显示视频,没有跳转,也没有花里胡哨的点赞、分享等功能信息,不过只适用于上面提到的第一种视频,也就是 https://www.bilibili.com/video/BV17B4y1R775 这样的视频,如果选择第二种视频,往往会因为视频著作权等原因而无法正常播放。

<div class="iframe_div"><iframe class="iframe_video" src="https://www.bilibili.com/blackboard/html5mobileplayer.html?bvid=17B4y1R775"></iframe>
</div>

第一种方法的参数同样可以用于第二种方法,如:

<div class="iframe_div"><iframe class="iframe_video" src="https://www.bilibili.com/blackboard/html5mobileplayer.html?bvid=17B4y1R775&page=1&danmaku=0&as_wide=1&high_quality=1"></iframe>
</div>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/666793.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

建材智能工厂数字孪生可视化管控平台,推进建材行业数字化转型

建材智能工厂数字孪生可视化管控平台&#xff0c;推进建材行业数字化转型。随着科技的不断发展&#xff0c;数字化转型已经成为各行各业发展的重要趋势。在建材行业中&#xff0c;智能工厂和数字孪生技术的应用正在改变传统的生产模式和管理方式&#xff0c;为行业的数字化转型…

C语言常见面试题:C语言中如何进行加密解密编程?

在C语言中进行加密和解密编程通常涉及到使用加密算法和相关的库。下面是一些常用的加密和解密算法以及如何使用它们的基本说明&#xff1a; AES加密算法&#xff1a; AES&#xff08;Advanced Encryption Standard&#xff09;是一种常用的对称加密算法。在C语言中&#xff0c;…

clr的执行模型-笔记

学习来源&#xff1a;《CLR via C by Jeffrey Richter 》第四版&#xff0c;第1章 clr的执行模型 1.C#编译生成执行程序集文件 编译文件的组成&#xff1a;pe32/pe32头&#xff0c;clr头&#xff0c;元数据&#xff0c;IL pe32/pe32头&#xff1a;windows标准执行文件头 cl…

mac 12.7.3 Unity 2021.3.14 XCode 14.2 成功将unity游戏编译到IPhone中,并上架appstore

上一篇文章 mac 10.15.7 & Unity 2021.3.14 & XCode 12.4 -&#xff1e; Unity IOS 自动安装 Cocoapods 失败解决方法 从上一篇文章完成后&#xff0c;unity 已经可以导出 xcode 工程&#xff0c;但是&#xff0c;app是没法上架到appstore上的&#xff0c;原因如下&am…

C++函数对象-运算符函数对象 - 比较 - 实现 x == y 的函数对象(std::equal_to)

任何定义了函数调用操作符的对象都是函数对象。C 支持创建、操作新的函数对象&#xff0c;同时也提供了许多内置的函数对象。 运算符函数对象 C 针对常用的算术和逻辑运算定义了很多函数对象&#xff1a; 比较 实现 x y 的函数对象 std::equal_to template< class T >…

DelayQueue的使用

具体思路&#xff1a; 在容器初始化的时候就创建出一个 延迟队列 然后项目启动后随即启动一个线程一直监听这个队列 手动调用接口往队列中添加任务 依赖 一个最简单的web的应用即可项目文件结构 第一步&#xff1a;在项目启动的时候就创建出一个延迟队列 Configuration publ…

小程序定制开发前,应该考虑些什么?

引言 在移动互联网时代&#xff0c;小程序已经成为许多企业和个人推广业务、提供服务的理想平台。然而&#xff0c;在进行小程序定制开发之前&#xff0c;开发者和业务方需要细致入微地考虑一系列关键因素&#xff0c;以确保最终的小程序既能满足用户需求&#xff0c;又能够顺…

PHP入门指南:起步篇

PHP入门指南&#xff1a;起步篇 PHP入门指南&#xff1a;起步篇什么是PHP&#xff1f;PHP 的优点PHP 开发环境搭建选择本地服务器软件包安装PHP环境配置Web服务器和PHP测试PHP安装 第一个PHP脚本PHP基础语法标记注释变量数据类型常量条件语句循环函数 PHP入门指南&#xff1a;起…

Oracle Server一台价值百万的服务器内存更换过程

数据库代码敲多了&#xff0c;看乏了吧&#xff01; 带各位DBA看看你们的数据库运行在什么样的硬件上。 1、故障现象 事发时2号位置报警 登录ILO发现内存报警 查看详细信息 查看详细报警 2、关于ORACLE 服务器DIMM 备用 默认情况下在 Oracle ILOM 中启用 DIMM 备用。由 DIMM 提…

[linux] kolla-ansible 部署的openstack 修改mariadb默认端口号

kolla-ansible 部署前修改global.yml #freezer_database_backend: "mariadb" database_port: 9306 mariadb_port: 9306如果已经部署成功&#xff0c;直接修改配置文件里的端口号重启是没有用的&#xff0c;怀疑内部做了缓存&#xff0c;查看openstack 使用的memcach…

yarn/npm certificate has expired

目录 报错 原因&#xff1a;HTTPS 证书验证失败 方法 a.检查网络安全软件&#xff1a;可能会拦截或修改 HTTPS 流量 b.strict-ssl:false关闭验证【临时方法】 报错 info No lockfile found. [1/4] Resolving packages... error Error: certificate has expired at TLS…

Java类的继承

XHTMLMapper继承 XWPFDocumentVisitor&#xff1a; 由于endVisitTableCell是抽象方法&#xff0c;XHTMLMapper中必须要实现&#xff1b; existErr()子类是否重写都是自由的&#xff1b; public abstract class XWPFDocumentVisitor<T, O extends Options, E extends IXWPFM…

Unity类银河恶魔城学习记录1-12 PlayerComboAttack源代码 P39

Alex教程每一P的教程原代码加上我自己的理解初步理解写的注释&#xff0c;可供学习Alex教程的人参考 此代码仅为较上一P有所改变的代码 【Unity教程】从0编程制作类银河恶魔城游戏_哔哩哔哩_bilibili PlayerPrimaryAttack.cs using System.Collections; using System.Collect…

实时语音转写的前端实现方案

// 创建一个音频上下文 const audioContext new (window.AudioContext || window.webkitAudioContext)(); // 创建一个MediaStreamSourceNode&#xff0c;用于获取用户的麦克风输入 navigator.mediaDevices.getUserMedia({ audio: true }) .then(stream > { const m…

音箱、功放播放HDMI音频解决方案之HDMI音频分离器HHA

HDMI音频分离器HHA简介 HDMI音频分离器HHA具有一路HDMI信号输入&#xff0c;转换成一路HDMI信号、一路5.1光纤音频信号、一路5.1 SPDIF/同轴音频信号和一路模拟左右声道立体声信号输出&#xff0c;同时还支持EDID存储及兼容HDCP功能&#xff1b;分辨率最高支持1920*1080p&#…

国产软件很流氓?4款没有广告的黑科技软件,白嫖党有福了

提到国产软件&#xff0c;许多人可能会想到一些负面的标签&#xff0c;如“流氓、捆绑、广告多”。然而&#xff0c;事实上&#xff0c;国内也有许多良心软件&#xff0c;不仅功能强大&#xff0c;而且完全免费。 1、原本&#xff08;图片处理神器&#xff09; 在日常生活中和…

国内最全的Spring Boot系列之七

• 阿里巴巴前高级研发工程师 • 三家千万级互联网企业技术顾问 • MBTI/盖洛普技术专家 • 厦门某高校外聘教师 • 51CTO特约合作讲师 • 网易云课堂签约讲师 •《深入理解设计模式》作者 一转眼马上要过年了&#xff0c;回首2023年&#xff0c;感觉自己无所事事、碌碌无…

[SWPUCTF 2021 新生赛]ez_unserialize

根据下面的user_agent和Disallow可以判断这个是在robots.txt 我们看的出来这是一个反序列化需要我们adminadmin passwdctf construct 构造方法&#xff0c;当一个对象被创建时调用此方法&#xff0c;不过unserialize()时却不会被调用 destruct 析构方法&#xff0c;PHP将在对象…

可以讲讲Flink的优化吗,具体以项目中某个例子举例一下?

优化的话&#xff1a;可以参考下面几点 GC的配置 &#xff08;1&#xff09;调整老年代与新生代的比值 或者 更换垃圾收集器 &#xff08;2&#xff09;增加JVM内存数据倾斜 &#xff08;1&#xff09;需要重新设计key&#xff0c;以更小粒度的key使得task大小合理化。 &…

jQuery---移除元素属性

介绍 使用jQuery移除元素的属性。 示例 $(".optBtn").removeAttr(disabled);