Please enable Javascript to view the contents

最简单的剪映字幕导出工具【http://jy.mzh.ren】

 ·  ☕ 3 分钟

文章内容

  1. 剪映字幕识别简介
  2. 剪映字幕导出在线小工具
  3. 实现原理

剪映字幕识别简介

电脑版的剪映 pro 推出以来,很多人都喜欢它的字幕识别功能。这个功能免费并且识别率、准确率还很高,是其他软件所不具备的,深受视频工作者喜爱。

但有一个小问题,就是剪映识别的字幕,只能剪映里编辑。

好在剪映会把这些字幕文件保存在你的电脑本地,是一些json文本文件。

剪映字幕文件存放目录:

  • Windows 目录:C:\Users\YourName\AppData\Local\JianyingPro\User Data\Projects\com.lveditor.draft\
  • MacOS 目录:/Users/YourName/Movies/JianyinPro/User Data/Projects/com.lveditor.draft/

于是很多小伙伴写了工具或脚本来提取字幕信息,方便保存或去别的软件编辑。比如:

这些工具都非常好,但都需要安装脚本环境或软件。有没有更简单的方法呢?必须有!


剪映字幕导出在线小工具

今天给大家分享一个网页版的,非常简单,Win/Mac都适用。

剪映 - 字幕导出

http://jy.mzh.ren/


实现原理

剪映Pro把字幕信息存储在本地的json文件,本质上就是将json转化成srt文件就行。

json本来就是结构化的数据,可以很方便的转化成JavaScript对象,处理起来非常简单。

所以实现的步骤为:

  1. 读取 剪映字幕文件.json
  2. 将json文件转化成srt字幕文件字符串
  3. 下载

读取 剪映字幕文件.json

网页版访问json文本文件有两种方式:

  1. 上传到服务器,通过服务器文件路径读取内容(这里需要服务器支持,不考虑)
  2. 通过HTML5 FileReader API读取本地文件(好用,就你了!)

HTML5的FileReader API可以让客户端浏览器对用户本地文件进行读取,这样就不再需要上传文件由服务器进行读取了,这大大减轻了服务器的负担,也节省了上传文件所需要的时间。

FileReader API浏览器支持程度较高,是读取本地文件比较通用的方式。

FileReader 是一个对象,其唯一目的是从 Blob(因此也从 File)对象中读取数据。

它使用事件来传递数据,因为从磁盘读取数据可能比较费时间。

构造函数:

1
let reader = new FileReader(); // 没有参数

主要方法:

  • readAsArrayBuffer(blob) —— 将数据读取为二进制格式的 ArrayBuffer
  • readAsText(blob, [encoding]) —— 将数据读取为给定编码(默认为 utf-8 编码)的文本字符串。
  • readAsDataURL(blob) —— 读取二进制数据,并将其编码为 base64 的 data url。
  • abort() —— 取消操作。

这是一个读取文件的示例:

json转换srt

1 构建 json对象

2 json对象转化成 srt字符串

下载

我们通过Blob对象将srt字符串构建成一个可供下载的文件。

var file = new Blob([data], { type: type });

Blob 对象表示一个不可变、原始数据的类文件对象。它的数据可以按文本或二进制的格式进行读取,也可以转换成 ReadableStream 来用于数据操作。

我们利用 Javascript 中动态创建一个链接,通过 link.click() 模拟一个点击,然后便自动下载由Blob构建的文件。


参考资料

分享

码中人
作者
码中人
Web Developer