react:ffcreator中FFCreatorCenter视频队例

发布时间:2024年01月06日

最近项目要求,一键生成房子的推荐视频,选几张图,加上联系人的方式就是一个简单的视频,因为有web端、小程序端,为了多端口用,决定放在服务器端生成。

目前用的是react中的nextjs来开发项目。

nextjs中怎样用ffcreator上一章有讲到过,这里不再详细说了,考虑多端口用,并发和处理视频合成等一系列对服务器压力过大的情况,这时候队列就有必要了。

一通了解后FFCreatorCenter能实现队列。官方有koa实现队列的例子。看过后怎样在nextjs中实现?

找准思路:

1.制作预设视频动画模板,意思是合成视频的模板提前预设好的,比如静态内容都提前准备好

2.用户选择想要的视频模板,然后根据视频模板添加动态内容,排队生成视频

3.查询视频生成情况

按照上述流程,我们开干:

1。制作预设视频模板,做一个模板比如相册视频,放到模板详情接口中调用AddTPL(id)


import { FFAlbum, FFScene, FFImage, FFCreator, FFRect, FFText, FFCreatorCenter } from 'ffcreator'
const path = require('path');
import colors from 'colors'
export default function AddTPL({ id }) {
 FFCreatorCenter.createTemplate(id, async ({ }) => {
//用官方图片例子
 const ROOT_PATH = process.cwd();

    const bg1 = path.join(ROOT_PATH, '/assets/imgs/bg/05.jpg');
    console.log(bg1)
    const bg2 = path.join(ROOT_PATH, '/assets/imgs/bg/04.jpeg');
    const logo2 = path.join(ROOT_PATH, '/assets/imgs/logo/logo2.png');
    const cloud = path.join(ROOT_PATH, '/assets/imgs/cloud.png');
    const mars = path.join(ROOT_PATH, '/assets/imgs/mars.png');
    const rock = path.join(ROOT_PATH, '/assets/imgs/rock.png');
    const title = path.join(ROOT_PATH, '/assets/imgs/title.png');
    const audio = path.join(ROOT_PATH, '/assets/audio/05.wav');
    const outputDir = path.join(ROOT_PATH, '/video/');
    const cacheDir = path.join(ROOT_PATH, '/cache/');
    FFCreator.setFFmpegPath('D:/nextAppV2/H5/ffmpeg
文章来源:https://blog.csdn.net/qq_41211900/article/details/135425066
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。