思源视频笔记插件 /B 站 / 百度网盘一键入库

刚试了下通义听悟的浏览器插件,可以设置监听当前浏览器页面的音频实时转成文本,搭配视频笔记用还不错

还有一个是 Kimi 官方出的插件,直接划线解释、总结

image.png

image.png

=============

把百度网盘的也加上了,虽然我自己用不上

所有生成的文档里初始的数据都不要做更改,否则影响正常使用

百度网盘视频笔记操作:
https://www.bilibili.com/video/BV19QYqeBEgi/?vd_source=6e1ad07c1e4ac69339c0b182ac45f53b

=============

之前看社区里有人发帖提视频笔记的需求,恰好最近我也有这方面的需要,索性就按照自己的想法开发了一个浏览器插件来实现 B 站视频的一键入库,这样的话就可以在思源里直接做视频笔记

考虑到要抓数据,浏览器插件在这方面是比较好做的,后续抖音、Youtube 看需要也会陆续加上,因为有些数据要走劫持逻辑,B 站前端有缓存不发起请求就不会触发下载按钮的刷新,这种情况一般是多强刷几次或者切换下分 P

关于平台视频数据可能丢失的问题,我的想法是可以等视频看完做完笔记之后选择持久化到本地,做一个备份,一旦平台数据没有了,自动把平台链接切换成本地链接就行了,相当于把一个跨域的 iframe 标签换成一个 video 标签,然后单独再写一套本地视频的逻辑,实现起来很简单,这种其实还是小概率事件,视频笔记感觉就算做,数据量也有限,其实我自己用的话大概率是不需要这个功能

我自己是很少做视频笔记的,所以也不清楚这方面功能优化的方向在哪里,等用一段时间有痛点了再做安排

仔细想下,还是之前用 edge 分屏的方式实现更灵活,那个实现起来更简单而且扩展性还好,只要网页上能播的都能做笔记,唯一麻烦点的是每次打开笔记需要单独开个分屏,还需要一个宽屏显示器,像现在这样把视频用 iframe 的方式放到思源文档里成本高不少,主要是跨域通信上,包括之前说的数据失效替换也更麻烦一些

像抖音的视频还有跨域的限制,还需要借助插件修改请求头,不然视频都播放不了,百度云上的视频都没法用 iframe 内嵌到思源文档里,后面看情况吧,有特别的需要才考虑重新支持分屏播放的逻辑,我相信没那么多人需要视频笔记

插件:https://github.com/coriger/siyuan-video-extension

B 站视频笔记操作:
https://www.bilibili.com/video/BV1rdYfeLE87/?vd_source=6e1ad07c1e4ac69339c0b182ac45f53b

  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    22338 引用 • 89385 回帖
5 操作
coriger 在 2024-08-13 23:18:31 更新了该帖
coriger 在 2024-08-13 23:17:58 更新了该帖
coriger 在 2024-08-13 05:38:42 更新了该帖
coriger 在 2024-08-13 05:31:08 更新了该帖 coriger 在 2024-08-12 15:44:18 更新了该帖

相关帖子

优质回帖

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • image.png

    作者你好,我使用你的插件,有两个问题,第一是点击“下载单视频/下载合集”按钮没有用,第二是没有视频上方的“笔记模式”,按照你 github 上配置了 common.js,但是我的 F12 页面里面有 5 个 b3-list b3-list--background,尝试过 ctr+F5,都没有用,请问是什么问题呢?

    ========

    经过排查,看到插件在运行时有这个问题,,我把截图和截图中显示不全的问题代码复制出来,请大佬帮忙看看怎么解决啊

    image.png

    var currentPageUrl;
    const pageTemplateUrl = "E:\\SiYuanData\\data\\templates\\视频笔记模板.md"
    const Authorization = "token wug2b7q5ul5cjcjx"
    const notebook = "20220526004752-xsoh6fo"
    
    /**
     * 把视频时长转换成字符串格式 
     * 参数单位是毫秒
     * @param {*} milliseconds 
     * @returns 
     */
    function parseVideoTimeFromDuration(milliseconds){
        // 计算小时数
        var hours = Math.floor(milliseconds / (60 * 60 * 1000));
        // 计算剩余的分钟数
        var minutes = Math.floor((milliseconds % (60 * 60 * 1000)) / (60 * 1000));
        // 计算剩余的秒数
        var seconds = Math.floor((milliseconds % (60 * 1000)) / 1000);
    
        // 格式化小时、分钟和秒,确保它们是两位数
        hours = hours.toString().padStart(2, '0');
        minutes = minutes.toString().padStart(2, '0');
        seconds = seconds.toString().padStart(2, '0');
    
        // 根据时长判断并拼接字符串
        if (hours > 0) {
            return `${hours}:${minutes}:${seconds}`; // xx:yy:zz
        } else if (minutes > 0) {
            return `${minutes}:${seconds}`; // xx:yy
        } else {
            // 如果分钟和小时都为0,但秒数可能不为0(尽管在这个特定情况下它会是0,因为至少要有1秒)
            // 但为了完整性,我们还是返回秒数(尽管前导0可能看起来不必要)
            return `00:${seconds}`; // 00:xx,但注意这个分支实际上不太可能被触发,除非有特别的逻辑需要它
            // 或者,如果确实只需要在秒数大于0时才显示,可以改为:
            // return seconds > 0 ? `00:${seconds}` : '00:00';
        }
    }
    
    
    /**
     * 调用思源api
     * @param {} url 
     * @param {*} json 
     * @returns 
     */
    async function invokeSiyuanApi(url,json){
        console.log("invoke siyuan api:"+url)
        console.log("invoke siyuan json:"+JSON.stringify(json))
    
        try {
            const response = await fetch(url, {
                method: "POST",
                headers: {
                    "Authorization": Authorization,
                    "Content-Type": "application/json",
                },
                body: JSON.stringify(json)
            });
            // 确保响应状态码是2xx
            if (!response.ok) {
                throw new Error('Network response was not ok');
            }
            // 你可以继续处理响应,例如获取JSON数据
            const data = await response.json();
            console.log("invoke siyuan api success,result is "+JSON.stringify(data))
            return data;
        } catch (error) {
            console.error('There has been a problem with your invokeSiyuanApi operation:', error);
        }
    }
    
    
    /**
     * 上传文件
     * @param {*} url 
     * @param {*} json 
     * @returns 
     */
    async function invokeSiyuanUploadApi(formData){
    
        try {
            const response = await fetch("http://127.0.0.1:6806/api/asset/upload", {
                method: "POST",
                headers: {
                    "Authorization": Authorization,
                },
                body: formData
            });
            // 确保响应状态码是2xx
            if (!response.ok) {
                throw new Error('Network response was not ok');
            }
            // 你可以继续处理响应,例如获取JSON数据
            const data = await response.json();
            console.log("invoke siyuan upload api success,result is "+JSON.stringify(data))
            return data;
        } catch (error) {
            console.error('There has been a problem with your invokeSiyuanApi operation:', error);
        }
    }
    
    2 回复
    3 操作
    MrMang 在 2024-08-19 21:49:48 更新了该回帖
    MrMang 在 2024-08-19 21:48:40 更新了该回帖
    MrMang 在 2024-08-19 21:34:37 更新了该回帖
  • 其他回帖
  • coriger 1
    作者

    思源里面随便找一个文件夹,选择右边的更多,里面有导入菜单

    image.png

    image.png

    1 回复
  • coriger 1
    作者

    类似这种效果,这样搞,还可以用上网盘的 AI 功能

  • mark-j 1 评论

    已经非常强了!!image.png就是时间戳不支持大纲,要手动复制到笔记结尾

    1 回复
    我按照作者的教程配置参数,没有应用成功,你应用成功了?
    MrMang
  • 查看全部回帖

推荐标签 标签

  • Notion

    Notion - The all-in-one workspace for your notes, tasks, wikis, and databases.

    6 引用 • 38 回帖
  • 前端

    前端技术一般分为前端设计和前端开发,前端设计可以理解为网站的视觉设计,前端开发则是网站的前台代码实现,包括 HTML、CSS 以及 JavaScript 等。

    247 引用 • 1348 回帖
  • HBase

    HBase 是一个分布式的、面向列的开源数据库,该技术来源于 Fay Chang 所撰写的 Google 论文 “Bigtable:一个结构化数据的分布式存储系统”。就像 Bigtable 利用了 Google 文件系统所提供的分布式数据存储一样,HBase 在 Hadoop 之上提供了类似于 Bigtable 的能力。

    17 引用 • 6 回帖 • 73 关注
  • Flume

    Flume 是一套分布式的、可靠的,可用于有效地收集、聚合和搬运大量日志数据的服务架构。

    9 引用 • 6 回帖 • 629 关注
  • B3log

    B3log 是一个开源组织,名字来源于“Bulletin Board Blog”缩写,目标是将独立博客与论坛结合,形成一种新的网络社区体验,详细请看 B3log 构思。目前 B3log 已经开源了多款产品:SymSoloVditor思源笔记

    1063 引用 • 3453 回帖 • 203 关注
  • GraphQL

    GraphQL 是一个用于 API 的查询语言,是一个使用基于类型系统来执行查询的服务端运行时(类型系统由你的数据定义)。GraphQL 并没有和任何特定数据库或者存储引擎绑定,而是依靠你现有的代码和数据支撑。

    4 引用 • 3 回帖 • 9 关注
  • IBM

    IBM(国际商业机器公司)或万国商业机器公司,简称 IBM(International Business Machines Corporation),总公司在纽约州阿蒙克市。1911 年托马斯·沃森创立于美国,是全球最大的信息技术和业务解决方案公司,拥有全球雇员 30 多万人,业务遍及 160 多个国家和地区。

    17 引用 • 53 回帖 • 136 关注
  • RYMCU

    RYMCU 致力于打造一个即严谨又活泼、专业又不失有趣,为数百万人服务的开源嵌入式知识学习交流平台。

    4 引用 • 6 回帖 • 51 关注
  • 小薇

    小薇是一个用 Java 写的 QQ 聊天机器人 Web 服务,可以用于社群互动。

    由于 Smart QQ 从 2019 年 1 月 1 日起停止服务,所以该项目也已经停止维护了!

    34 引用 • 467 回帖 • 742 关注
  • 心情

    心是产生任何想法的源泉,心本体会陷入到对自己本体不能理解的状态中,因为心能产生任何想法,不能分出对错,不能分出自己。

    59 引用 • 369 回帖
  • SVN

    SVN 是 Subversion 的简称,是一个开放源代码的版本控制系统,相较于 RCS、CVS,它采用了分支管理系统,它的设计目标就是取代 CVS。

    29 引用 • 98 回帖 • 680 关注
  • Spring

    Spring 是一个开源框架,是于 2003 年兴起的一个轻量级的 Java 开发框架,由 Rod Johnson 在其著作《Expert One-On-One J2EE Development and Design》中阐述的部分理念和原型衍生而来。它是为了解决企业应用开发的复杂性而创建的。框架的主要优势之一就是其分层架构,分层架构允许使用者选择使用哪一个组件,同时为 JavaEE 应用程序开发提供集成的框架。

    944 引用 • 1459 回帖 • 17 关注
  • 开源中国

    开源中国是目前中国最大的开源技术社区。传播开源的理念,推广开源项目,为 IT 开发者提供了一个发现、使用、并交流开源技术的平台。目前开源中国社区已收录超过两万款开源软件。

    7 引用 • 86 回帖
  • C

    C 语言是一门通用计算机编程语言,应用广泛。C 语言的设计目标是提供一种能以简易的方式编译、处理低级存储器、产生少量的机器码以及不需要任何运行环境支持便能运行的编程语言。

    85 引用 • 165 回帖 • 1 关注
  • Linux

    Linux 是一套免费使用和自由传播的类 Unix 操作系统,是一个基于 POSIX 和 Unix 的多用户、多任务、支持多线程和多 CPU 的操作系统。它能运行主要的 Unix 工具软件、应用程序和网络协议,并支持 32 位和 64 位硬件。Linux 继承了 Unix 以网络为核心的设计思想,是一个性能稳定的多用户网络操作系统。

    943 引用 • 943 回帖
  • 百度

    百度(Nasdaq:BIDU)是全球最大的中文搜索引擎、最大的中文网站。2000 年 1 月由李彦宏创立于北京中关村,致力于向人们提供“简单,可依赖”的信息获取方式。“百度”二字源于中国宋朝词人辛弃疾的《青玉案·元夕》词句“众里寻他千百度”,象征着百度对中文信息检索技术的执著追求。

    63 引用 • 785 回帖 • 175 关注
  • Netty

    Netty 是一个基于 NIO 的客户端-服务器编程框架,使用 Netty 可以让你快速、简单地开发出一个可维护、高性能的网络应用,例如实现了某种协议的客户、服务端应用。

    49 引用 • 33 回帖 • 22 关注
  • 深度学习

    深度学习(Deep Learning)是机器学习的分支,是一种试图使用包含复杂结构或由多重非线性变换构成的多个处理层对数据进行高层抽象的算法。

    53 引用 • 40 回帖 • 2 关注
  • 链滴

    链滴是一个记录生活的地方。

    记录生活,连接点滴

    153 引用 • 3783 回帖 • 1 关注
  • Thymeleaf

    Thymeleaf 是一款用于渲染 XML/XHTML/HTML5 内容的模板引擎。类似 Velocity、 FreeMarker 等,它也可以轻易的与 Spring 等 Web 框架进行集成作为 Web 应用的模板引擎。与其它模板引擎相比,Thymeleaf 最大的特点是能够直接在浏览器中打开并正确显示模板页面,而不需要启动整个 Web 应用。

    11 引用 • 19 回帖 • 354 关注
  • GitHub

    GitHub 于 2008 年上线,目前,除了 Git 代码仓库托管及基本的 Web 管理界面以外,还提供了订阅、讨论组、文本渲染、在线文件编辑器、协作图谱(报表)、代码片段分享(Gist)等功能。正因为这些功能所提供的便利,又经过长期的积累,GitHub 的用户活跃度很高,在开源世界里享有深远的声望,并形成了社交化编程文化(Social Coding)。

    209 引用 • 2031 回帖 • 1 关注
  • CentOS

    CentOS(Community Enterprise Operating System)是 Linux 发行版之一,它是来自于 Red Hat Enterprise Linux 依照开放源代码规定释出的源代码所编译而成。由于出自同样的源代码,因此有些要求高度稳定的服务器以 CentOS 替代商业版的 Red Hat Enterprise Linux 使用。两者的不同在于 CentOS 并不包含封闭源代码软件。

    238 引用 • 224 回帖
  • Love2D

    Love2D 是一个开源的, 跨平台的 2D 游戏引擎。使用纯 Lua 脚本来进行游戏开发。目前支持的平台有 Windows, Mac OS X, Linux, Android 和 iOS。

    14 引用 • 53 回帖 • 531 关注
  • 游戏

    沉迷游戏伤身,强撸灰飞烟灭。

    176 引用 • 815 回帖
  • Sublime

    Sublime Text 是一款可以用来写代码、写文章的文本编辑器。支持代码高亮、自动完成,还支持通过插件进行扩展。

    10 引用 • 5 回帖
  • 互联网

    互联网(Internet),又称网际网络,或音译因特网、英特网。互联网始于 1969 年美国的阿帕网,是网络与网络之间所串连成的庞大网络,这些网络以一组通用的协议相连,形成逻辑上的单一巨大国际网络。

    98 引用 • 344 回帖
  • 工具

    子曰:“工欲善其事,必先利其器。”

    286 引用 • 729 回帖