SnailDev.GifMaker

一个生成gif并添加自定义字幕的工具

client 微信小程序

server nodejs + express

欢迎 star&fork 如果您有好的commit 也可以pull request

体验Demo sorry.web

Introduction

本工具并不使用aegisub为模板视频创建字幕,采用的是FFmpeg 中的filter drawtext, 另,笔者还将继续深入了解FFmpeg,争取早日实现创作自动化。

可生成如下案列:

开放接口:

1.获取category

GET https://gifmaker.develophelper.com/gif/category

2.制作gif

POST https://gifmaker.develophelper.com/gif/make
Content-Type: application/x-www-form-urlencoded
Body: tplid=1 // 模板ID
&quality=1 // 画质(暂时无效)
&content=好啊##$@?$?@$##就算你是一流工程师##$@?$?@$##就算你出报告再完美##$@?$?@$##我叫你改报告你就要改##$@?$?@$##毕竟我是客户##$@?$?@$##客户了不起啊##$@?$?@$##sorry 客户真的了不起##$@?$?@$##以后叫他天天改报告##$@?$?@$##天天改 天天改 //字幕内容(以##$@?$?@$##作为分隔符)

3.返回结果

{
"m": 0, // code 0 successful
"d":{ // d data
"gifurl": "http://gifmaker.develophelper.com/cache/1_1a322f1b7dd9633e5433d0e0152e18a6a924cb23.gif"
},
"e": "" // e errMsg
}

Structure

├─client                    // 客户端参考微信小程序结构

└─server // 服务端

├─data // 模板配置目录

├─public // 静态资源目录
│ │
│ ├─cache // 动态生成的gif目录
│ │
│ └─demo // 示例目录

├─test // 测试目录

├─app.js // 主程序入口

├─gifmaker.js // gif创建

├─util.js // 工具类

└─test // 测试目录

DependOn

server

"ffmpeg-static": "^2.2.0",
"fluent-ffmpeg": "^2.1.2"

How to Use

  1. 制作视频模板 放到 data/template/ 目录下
  2. 给data/category.js 和data/template.js 添加相关配置
  3. 将做好的demo放到 public/demo/gif/下 缩略图放到 public/demo/thumbnail/下

Interpretation

{
filter: "drawtext", // filter类型
options: {
"text": "我就是饿死", // 文本内容
"x": "(w-text_w)/2", // 文本出现的横坐标
"y": "h-text_h-4", // 文本出现的纵坐标
"enable": "between(t,0,1.04)", // 文本出现的时间范围
'fontfile': 'msyhbd.ttc', // 字体文件
'fontcolor': 'white', // 字体颜色
"fontsize": "14" // 字体大小
}
}

更多参考 FFmpeg Filters Documentation

License

The MIT License (MIT). Please see LICENSE for more information.

基于node写了个工具,可以在线制作“sorry,为所欲为”的 GIF(开源)的更多相关文章

  1. n8n 基于node 的流程自动化工具

    n8n 是基于node开发的流程自动化工具,提供了可视化的操作,我们可以用来集成不同的服务. 目前已经提供了很多的服务集成组件,同时我们也可以方便的自己扩展,后边会进行一个系统的 学习,同时介绍下使用 ...

  2. 基于Node.js的爬虫工具 – Node Crawler

    Node Crawler的目标是成为最好的node.js爬虫工具,目前已经停止维护. 我们来抓取光合新知博客tech栏目中的文章信息.访问http://dev.guanghe.tv/category/ ...

  3. 认识Web前端、Web后端、桌面app和移动app新开发模式 - 基于Node.js环境和VS Code工具

    认识Web.桌面和移动app新开发模式 - 基于Node.js环境和VS Code工具 一.开发环境的搭建(基于win10) 1.安装node.js和npm 到node.js官网下载安装包(包含npm ...

  4. 基于node实现一个简单的脚手架工具(node控制台交互项目)

    实现控制台输入输出 实现文件读写操作 全原生实现一个简单的脚手架工具 实现vue-cli2源码 一.实现控制台输入输出 关于控制台的输入输出依然是基于node进程管理对象process,在proces ...

  5. 基于node和npm的命令行工具——tive-cli

    前端开发过程中经常会用到各种各样的脚手架工具.npm全局工具包等命令行工具,如:Vue脚手架@vue/cli.React脚手架create-react-app.node进程守卫工具pm2.本地静态服务 ...

  6. 飞鱼(FlyFish)——便捷的原型在线制作工具

    关于项目原型制作,小菜先前写过一篇文章<FastUI快速界面原型制作工具>,只不过那个是用C#写的原型制作工具,但是感觉用C#写起来比较费力,而且也不太好用,经过高人指点,茅塞顿开,决定重 ...

  7. Gulp:基于流的自动化构建工具

    前言 先说说为什么会使用gulp. 当你沉醉于撸代码之时,是否想过正规的前端代码需要走哪些流程,复杂的不说了,有几点想必你也思考过,比如: 1.代码的压缩合并.图片压缩怎么搞: 2.代码校验,是否规范 ...

  8. 《基于Node.js实现简易聊天室系列之详细设计》

    一个完整的项目基本分为三个部分:前端.后台和数据库.依照软件工程的理论知识,应该依次按照以下几个步骤:需求分析.概要设计.详细设计.编码.测试等.由于缺乏相关知识的储备,导致这个Demo系列的文章层次 ...

  9. 基于Node.js + WebSocket 的简易聊天室

    代码地址如下:http://www.demodashi.com/demo/13282.html Node.js聊天室运行说明 Node.js的本质就是运行在服务端的JavaScript.Node.js ...

随机推荐

  1. NetBeans部署项目(Extjs)报错(二)

    NetBeans部署项目(Extjs)报错(二) 1.具体错误如下: Using CATALINA_BASE: "C:\Users\Administrator.FOXB2MKB3RGUNIL ...

  2. 关于TS流的解析

    字节.在TS流里可以填入很多类型的数据,如视频.音频.自定义信息等.他的包的结构为,包头为4个字节,负载为184个字节(这184个字节不一定都是有效数据,有一些可能为填充数据). 工作形式: 因为在T ...

  3. (二十五)svn的问题

    今天更新代码到svn中的时候出现了错误,准确的说是在操作更新之前的步骤出现了错误,因此对svn有了更近一步的理解.    check:下载svn中的代码到指定的储存路径中:    update:更新s ...

  4. AJAX跨域问题总结

    跨域是什么? 首先说下同源,同源策略是浏览器的一种安全策略,所谓同源是指,域名,协议,端口完全相同.而跨域就是不同源 ! 能够进行跨域的请求 一般a,img,link[rel=stylesheet], ...

  5. Python 学习笔记(二)开发环境的搭建

    安装Python windows 下安装: 下载地址:https://www.python.org/downloads Python的版本 3.x 是趋势 2.x 还在被大量使用 至于使用2.x 还是 ...

  6. [USACO5.4]奶牛的电信Telecowmunication

    裸的最小割,拆点时要考虑清楚到底是怎么连 如果之前i->i+n,之后又x->y+n,显然出不了解 所以可以改为i+n->i 如果要输出方案 考虑每一个一个点,如果删去这个点,最小割变 ...

  7. [BZOJ1503] [NOI2004] 郁闷的出纳员 (treap)

    Description OIER公司是一家大型专业化软件公司,有着数以万计的员工.作为一名出纳员,我的任务之一便是统计每位员工的工资.这本来是一份不错的工作,但是令人郁闷的是,我们的老板反复无常,经常 ...

  8. XCTF(77777-2)

    题目链接:http://47.52.137.90:20000 这道题目和前面的那道题目大致一样,只不过是过滤的函数不一样 检查过滤函数的方式就不写了,直接来解题 检查函数发现过滤了ord ascii ...

  9. 【learning】[待完善]关于辛普森公式的一点想法

    [吐槽] 嗯一开始接触到这个东西其实是因为某道凸包的题目好像可以用这个奇妙的方法来算 但其实了解也不是很深,只是觉得这个东西十分有意思, 所以先稍微写一下自己的想法,了解更多之后慢慢完善 [正题] 首 ...

  10. [翻译]简单的实现一个Promise

    英文原文为:https://www.promisejs.org/implementing/ 1. 状态机 因为 promise 对象是一个状态机,所以我们首先应该定义将要用到的状态. var PEND ...