vue使用ffmpeg.js的问题

Question

给视频添加文字时，中文显示乱码，英文显示正常，这个是为什么，
给视频添加字幕时，提示can't find selected font provider fontselect: failed to find any fallback for font: (微软雅黑, 700, 0)
请问是要设置什么配置才能识别字体吗

Answer 1

下午好🌅🌅🌅
本答案参考ChatGPT-3.5

问题1：中文显示乱码的原因

• ffmpeg.js默认使用ASCII编码，在处理中文字符时就会出现乱码。
• 解决方案：更改编码方式为UTF-8，这样就可以正常显示中文字符了。

问题2：无法识别字体

• ffmpeg.js需要在运行时访问字体文件，如果找不到文件或者访问权限不足，就会提示找不到字体。
• 解决方案：提供正确的字体文件路径，并确保运行时有访问权限。

修改代码示例：

import FFmpeg from 'ffmpeg.js'

// 更改编码方式为UTF-8
const code = 'utf-8'
const ffmpeg = FFmpeg.create({
  log: true,
  printErr: msg => console.error(msg),
  print: msg => console.log(msg),
  MEMFS: [
    { name: 'test.mp4', data: videoData },
    { name: 'test.ttf', data: fontData }
  ],
  arguments: ['-i', 'test.mp4', '-vf', `drawtext=fontfile=test.ttf: text='中文': fontcolor=white@0.8: fontsize=30: x=100: y=100, format=yuv420p`, '-strict', '-2', 'out.mp4'],
  stdin: null,
  cwd: '/',
  preRun: null,
  postRun: null,
  onRuntimeInitialized: null,
  locateFile: (filename) => '/ffmpeg/' + filename
})
// 提供正确的字体文件路径
const fontData = fs.readFileSync(path.resolve(__dirname, '../fonts/yahei.ttf'))