改进一下咱论坛的 bilibili iframe

运营反馈
1

佬友们好，如果你们有关注 AI 的话，相信一定刷到过我最近写的 三花AI日报 哈，论坛现在有个问题，就是B站视频 iframe，插入太多会同时播放体验非常的差。

而且B站默认分享复制出来的不会自动暂停（我知道能通过参数自动暂停，但就是很麻烦），如果背后有用 rehype 插件的话，这里有个小实现，替换成了 html5mobileplayer，解决了：

  • 无需替换之前的帖子，每次复制也不用额外参数
  • 默认情况视频是暂停的
  • 内存占用更小
  • 不会一个不小心就点到 B 站那个破中转页…
import type { Root } from "hast"
import { visit } from "unist-util-visit"

export function rehypeBetterBilibiliIframe() {
  return function (tree: Root) {
    visit(tree, 'element', (node) => {
      // @ts-expect-error
      if (node.tagName === 'iframe' && node.properties?.src?.includes('player.bilibili.com/player.html')) {
        node.properties.src = node.properties.src.replace('player.bilibili.com/player.html', 'www.bilibili.com/blackboard/html5mobileplayer.html')
      }
    })
  }
}
8 Likes
2

大佬牛啊 :+1: :+1:

3

就是一个 replace ，:ox:啥 :joy:

4

哈哈，我之前嵌入的都是手动改autoplay :joy:

5

autoplay=0就行了

2 Likes
6

帅哥没懂俺的意思，我知道能通过参数自动暂停，但是我的日报每次会插 N 个视频，一个还好，一天也还好，我打算长更的！

7

:face_holding_back_tears:太强了大佬！

8

没有搞懂这个东西要怎么用 :cold_face:能麻烦楼主写得更详细一些吗