CN107707968A - 一种网页视频转gif图片的数据处理方法及装置 - Google Patents

一种网页视频转gif图片的数据处理方法及装置 Download PDF

Info

Publication number
CN107707968A
CN107707968A CN201710717923.2A CN201710717923A CN107707968A CN 107707968 A CN107707968 A CN 107707968A CN 201710717923 A CN201710717923 A CN 201710717923A CN 107707968 A CN107707968 A CN 107707968A
Authority
CN
China
Prior art keywords
gif pictures
gif
video
pictures
editor
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN201710717923.2A
Other languages
English (en)
Inventor
璐哄窘
贺徽
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Guangzhou Ai Mei Interactive Network Technology Co Ltd
Original Assignee
Guangzhou Ai Mei Interactive Network Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Guangzhou Ai Mei Interactive Network Technology Co Ltd filed Critical Guangzhou Ai Mei Interactive Network Technology Co Ltd
Priority to CN201710717923.2A priority Critical patent/CN107707968A/zh
Publication of CN107707968A publication Critical patent/CN107707968A/zh
Pending legal-status Critical Current

Links

Classifications

    • HELECTRICITY
    • H04ELECTRIC COMMUNICATION TECHNIQUE
    • H04NPICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/43Processing of content or additional data, e.g. demultiplexing additional data from a digital video stream; Elementary client operations, e.g. monitoring of home network or synchronising decoder's clock; Client middleware
    • H04N21/433Content storage operation, e.g. storage operation in response to a pause request, caching operations
    • H04N21/4334Recording operations
    • HELECTRICITY
    • H04ELECTRIC COMMUNICATION TECHNIQUE
    • H04NPICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/43Processing of content or additional data, e.g. demultiplexing additional data from a digital video stream; Elementary client operations, e.g. monitoring of home network or synchronising decoder's clock; Client middleware
    • H04N21/431Generation of visual interfaces for content selection or interaction; Content or additional data rendering
    • H04N21/4312Generation of visual interfaces for content selection or interaction; Content or additional data rendering involving specific graphical features, e.g. screen layout, special fonts or colors, blinking icons, highlights or animations
    • HELECTRICITY
    • H04ELECTRIC COMMUNICATION TECHNIQUE
    • H04NPICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/43Processing of content or additional data, e.g. demultiplexing additional data from a digital video stream; Elementary client operations, e.g. monitoring of home network or synchronising decoder's clock; Client middleware
    • H04N21/431Generation of visual interfaces for content selection or interaction; Content or additional data rendering
    • H04N21/4318Generation of visual interfaces for content selection or interaction; Content or additional data rendering by altering the content in the rendering process, e.g. blanking, blurring or masking an image region
    • HELECTRICITY
    • H04ELECTRIC COMMUNICATION TECHNIQUE
    • H04NPICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/43Processing of content or additional data, e.g. demultiplexing additional data from a digital video stream; Elementary client operations, e.g. monitoring of home network or synchronising decoder's clock; Client middleware
    • H04N21/44Processing of video elementary streams, e.g. splicing a video clip retrieved from local storage with an incoming video stream or rendering scenes according to encoded video stream scene graphs
    • H04N21/4402Processing of video elementary streams, e.g. splicing a video clip retrieved from local storage with an incoming video stream or rendering scenes according to encoded video stream scene graphs involving reformatting operations of video signals for household redistribution, storage or real-time display
    • H04N21/440236Processing of video elementary streams, e.g. splicing a video clip retrieved from local storage with an incoming video stream or rendering scenes according to encoded video stream scene graphs involving reformatting operations of video signals for household redistribution, storage or real-time display by media transcoding, e.g. video is transformed into a slideshow of still pictures, audio is converted into text

Landscapes

  • Engineering & Computer Science (AREA)
  • Multimedia (AREA)
  • Signal Processing (AREA)
  • Television Signal Processing For Recording (AREA)

Abstract

本发明公开了一种网页视频转GIF图片的数据处理方法及装置,先识别当前环境是否支持WebRTC,若是则调用WebRTC进行视频录制,否则使用外部控件进行视频录制,然后将录制的视频转换为第一GIF图片,最后通过Fabric.js库,对第一GIF图片进行编辑,生成第二GIF图片。采用本发明实施例,无需网络数据交互,高效快捷。

Description

一种网页视频转GIF图片的数据处理方法及装置
技术领域
本发明涉及移动终端技术领域,尤其涉及一种网页视频转GIF图片的数据处理方法及装置。
背景技术
当前的移动互联网发展迅速,对于移动端网页视频处理技术多依赖服务器的处理回传。如用户将拍摄的视频上传至服务器,生成GIF图片后回传给用户进行图片修饰处理。现有技术的数据传输需要联网支持,而且在编辑修改时,需要多次拍摄和多次传输,操作麻烦,编辑处理时间长。
发明内容
本发明实施例提出一种网页视频转GIF图片的数据处理方法及装置,无需网络数据交互,高效快捷。
本发明实施例提供一种网页视频转GIF图片的数据处理方法,包括:
判断当前环境是否支持WebRTC,如果是,则调用WebRTC进行视频录制,否则,通过外部控件进行视频录制;
将录制的视频转换为第一GIF图片;
通过Fabric.js库,对所述第一GIF图片进行编辑,生成第二GIF图片。
进一步的,所述将录制的视频转换为第一GIF图片,具体为:
对所述录制的视频进行帧提取,根据提取的图片生成第一GIF图片。
进一步的,所述通过Fabric.js库,对所述第一GIF图片进行编辑,生成第二GIF图片,具体为:
通过所述Fabric.js库,对所述第一GIF图片进行文字编辑,对编辑后的GIF图片进行渲染并压缩后,生成所述第二GIF图片;
所述文字编辑包括:字体、颜色、文字特效的编辑。
相应地,本发明实施例还提供一种网页视频转GIF图片的数据处理装置,包括:判断模块、录制模块、转换模块和编辑生成模块;
其中,所述判断模块用于判断当前环境是否支持WebRTC;
所述录制模块用于在所述判断模块确定当前环境是支持WebRTC时,调用WebRTC进行视频录制;以及用于在所述判断模块确定当前环境不支持WebRTC时,通过外部控件进行视频录制;
所述转换模块用于将录制的视频转换为第一GIF图片;
所述编辑生成模块用于通过Fabric.js库,对所述第一GIF图片进行编辑,生成第二GIF图片。
进一步的,所述转换模块具体用于对所述录制的视频进行帧提取,根据提取的图片生成第一GIF图片。
进一步的,所述编辑生成模块具体用于通过所述Fabric.js库,对所述第一GIF图片进行文字编辑,对编辑后的GIF图片进行渲染并压缩后,生成所述第二GIF图片;
所述文字编辑包括:字体、颜色、文字特效的编辑。
实施本发明实施例,具有如下有益效果:
本发明实施例提供的网页视频转GIF图片的数据处理方法及装置,先识别当前环境是否支持WebRTC,若是则调用WebRTC进行视频录制,否则使用外部控件进行视频录制,然后将录制的视频转换为第一GIF图片,最后通过Fabric.js库,对第一GIF图片进行编辑,生成第二GIF图片。相比于现有技术需要与服务器进行回传,本发明技术方案无需网络数据交互,即可实现网页视频转GIF图片,高效快捷。
附图说明
图1是本发明提供的网页视频转GIF图片的数据处理方法的一种实施例的流程示意图;
图2是本发明提供的网页视频转GIF图片的数据处理装置的一种实施例的结构示意图。
具体实施方式
下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例,都属于本发明保护的范围。
参见图1,是本发明提供的网页视频转GIF图片的数据处理方法的一种实施例的流程示意图,该方法包括步骤101至步骤105,各步骤具体如下:
步骤101:判断当前环境是否支持WebRTC,如果是,则执行步骤102,否则,执行步骤103。
步骤102:调用WebRTC进行视频录制。
步骤103:通过外部控件进行视频录制。
在本实施例中,如果移动终端当前的环境支持WebRTC,则直接调用WebRTC进行视频录制,否则,通过外部控件进行录制,如safari浏览环境不支持WebRTC,即采用Flash方式完成视频录制,微信环境则采用“文件输入”控件。
步骤104:将录制的视频转换为第一GIF图片。
在本实施例中,步骤104具体为:对录制的视频进行帧提取,可以是每秒提取5帧,再根据提取的图片生成第一GIF图片。
步骤105:通过Fabric.js库,对第一GIF图片进行编辑,生成第二GIF图片。
在本实施例中,步骤105具体为:通过Fabric.js库,对第一GIF图片进行文字编辑,对编辑后的GIF图片进行渲染并压缩后,生成第二GIF图片;文字编辑包括:字体、颜色、文字特效的编辑。文字效果包括:移动、选择和缩放等。Fabric.js库是一种客户端脚本语言,在不同终端的兼容性好,能在用户的电脑手机等环境执行,实现快速高效的将视频文件转换成gif的过程。
相应地,参见图2,图2是本发明提供的网页视频转GIF图片的数据处理装置的一种实施例的结构示意图。该数据处理装置包括:判断模块1、录制模块2、转换模块3和编辑生成模块4。
其中,判断模块1用于判断当前环境是否支持WebRTC。
录制模块2用于在判断模块1确定当前环境是支持WebRTC时,调用WebRTC进行视频录制;以及用于在判断模块1确定当前环境不支持WebRTC时,通过外部控件进行视频录制。
转换模块3用于将录制的视频转换为第一GIF图片。
编辑生成模块4用于通过Fabric.js库,对第一GIF图片进行编辑,生成第二GIF图片。
在本实施例中,转换模块3具体用于对录制的视频进行帧提取,根据提取的图片生成第一GIF图片。
在本实施例中,编辑生成模块4具体用于通过Fabric.js库,对第一GIF图片进行文字编辑,对编辑后的GIF图片进行渲染并压缩后,生成第二GIF图片;文字编辑包括:字体、颜色、文字特效的编辑。
由上可见,本发明实施例提供的网页视频转GIF图片的数据处理方法及装置,先识别当前环境是否支持WebRTC,若是则调用WebRTC进行视频录制,否则使用外部控件进行视频录制,然后将录制的视频转换为第一GIF图片,最后通过Fabric.js库,对第一GIF图片进行编辑,生成第二GIF图片。相比于现有技术需要与服务器进行回传,本发明技术方案无需网络数据交互,即可实现网页视频转GIF图片,高效快捷。
本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程,是可以通过计算机程序来指令相关的硬件来完成,所述的程序可存储于一计算机可读取存储介质中,该程序在执行时,可包括如上述各方法的实施例的流程。其中,所述的存储介质可为磁碟、光盘、只读存储记忆体(Read-Only Memory,ROM)或随机存储记忆体(Random AccessMemory,RAM)等。
以上所述是本发明的优选实施方式,应当指出,对于本技术领域的普通技术人员来说,在不脱离本发明原理的前提下,还可以做出若干改进和润饰,这些改进和润饰也视为本发明的保护范围。

Claims (6)

1.一种网页视频转GIF图片的数据处理方法,其特征在于,包括:
判断当前环境是否支持WebRTC,如果是,则调用WebRTC进行视频录制,否则,通过外部控件进行视频录制;
将录制的视频转换为第一GIF图片;
通过Fabric.js库,对所述第一GIF图片进行编辑,生成第二GIF图片。
2.根据权利要求1所述的网页视频转GIF图片的数据处理方法,其特征在于,所述将录制的视频转换为第一GIF图片,具体为:
对所述录制的视频进行帧提取,根据提取的图片生成第一GIF图片。
3.根据权利要求1所述的网页视频转GIF图片的数据处理方法,其特征在于,所述通过Fabric.js库,对所述第一GIF图片进行编辑,生成第二GIF图片,具体为:
通过所述Fabric.js库,对所述第一GIF图片进行文字编辑,对编辑后的GIF图片进行渲染并压缩后,生成所述第二GIF图片;
所述文字编辑包括:字体、颜色、文字特效的编辑。
4.一种网页视频转GIF图片的数据处理装置,其特征在于,包括:判断模块、录制模块、转换模块和编辑生成模块;
其中,所述判断模块用于判断当前环境是否支持WebRTC;
所述录制模块用于在所述判断模块确定当前环境是支持WebRTC时,调用WebRTC进行视频录制;以及用于在所述判断模块确定当前环境不支持WebRTC时,通过外部控件进行视频录制;
所述转换模块用于将录制的视频转换为第一GIF图片;
所述编辑生成模块用于通过Fabric.js库,对所述第一GIF图片进行编辑,生成第二GIF图片。
5.根据权利要求4所述的网页视频转GIF图片的数据处理装置,其特征在于,所述转换模块具体用于对所述录制的视频进行帧提取,根据提取的图片生成第一GIF图片。
6.根据权利要求4所述的网页视频转GIF图片的数据处理装置,其特征在于,所述编辑生成模块具体用于通过所述Fabric.js库,对所述第一GIF图片进行文字编辑,对编辑后的GIF图片进行渲染并压缩后,生成所述第二GIF图片;
所述文字编辑包括:字体、颜色、文字特效的编辑。
CN201710717923.2A 2017-08-18 2017-08-18 一种网页视频转gif图片的数据处理方法及装置 Pending CN107707968A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201710717923.2A CN107707968A (zh) 2017-08-18 2017-08-18 一种网页视频转gif图片的数据处理方法及装置

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201710717923.2A CN107707968A (zh) 2017-08-18 2017-08-18 一种网页视频转gif图片的数据处理方法及装置

Publications (1)

Publication Number Publication Date
CN107707968A true CN107707968A (zh) 2018-02-16

Family

ID=61171084

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201710717923.2A Pending CN107707968A (zh) 2017-08-18 2017-08-18 一种网页视频转gif图片的数据处理方法及装置

Country Status (1)

Country Link
CN (1) CN107707968A (zh)

Cited By (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN108647020A (zh) * 2018-05-17 2018-10-12 珠海横琴盛达兆业科技投资有限公司 一种网页版的调用html5视频录制动画GIF图像的方法
CN111143620A (zh) * 2019-12-27 2020-05-12 广州爱美互动网络科技有限公司 一种具体化游戏地图编辑方法、系统及存储介质

Citations (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101075258A (zh) * 2007-05-14 2007-11-21 腾讯科技(深圳)有限公司 视频缩略图生成方法和视频缩略图生成装置
CN101510313A (zh) * 2009-03-13 2009-08-19 腾讯科技(深圳)有限公司 一种gif生成方法、系统及媒体播放器
US20120210084A1 (en) * 2005-08-12 2012-08-16 Panstoria, Inc. Content manager
CN102801942A (zh) * 2012-07-23 2012-11-28 北京小米科技有限责任公司 一种录制视频及生成gif动态图的方法和装置
CN105138694A (zh) * 2015-09-21 2015-12-09 合一网络技术(北京)有限公司 一种gif录制方法及装置
CN105138695A (zh) * 2015-09-21 2015-12-09 合一网络技术(北京)有限公司 一种gif录制方法及装置
CN105933624A (zh) * 2016-06-17 2016-09-07 武汉斗鱼网络科技有限公司 一种用于网站视频录制方法及装置
US20160277472A1 (en) * 2010-09-20 2016-09-22 Bevara Technologies, Llc Systems and methods for encoding and decoding
CN106851385A (zh) * 2017-02-20 2017-06-13 北京金山安全软件有限公司 视频录制方法、装置和电子设备
US20170180780A1 (en) * 2015-12-17 2017-06-22 James R. Jeffries Multiple independent video recording integration

Patent Citations (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20120210084A1 (en) * 2005-08-12 2012-08-16 Panstoria, Inc. Content manager
CN101075258A (zh) * 2007-05-14 2007-11-21 腾讯科技(深圳)有限公司 视频缩略图生成方法和视频缩略图生成装置
CN101510313A (zh) * 2009-03-13 2009-08-19 腾讯科技(深圳)有限公司 一种gif生成方法、系统及媒体播放器
US20160277472A1 (en) * 2010-09-20 2016-09-22 Bevara Technologies, Llc Systems and methods for encoding and decoding
CN102801942A (zh) * 2012-07-23 2012-11-28 北京小米科技有限责任公司 一种录制视频及生成gif动态图的方法和装置
CN105138694A (zh) * 2015-09-21 2015-12-09 合一网络技术(北京)有限公司 一种gif录制方法及装置
CN105138695A (zh) * 2015-09-21 2015-12-09 合一网络技术(北京)有限公司 一种gif录制方法及装置
US20170180780A1 (en) * 2015-12-17 2017-06-22 James R. Jeffries Multiple independent video recording integration
CN105933624A (zh) * 2016-06-17 2016-09-07 武汉斗鱼网络科技有限公司 一种用于网站视频录制方法及装置
CN106851385A (zh) * 2017-02-20 2017-06-13 北京金山安全软件有限公司 视频录制方法、装置和电子设备

Cited By (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN108647020A (zh) * 2018-05-17 2018-10-12 珠海横琴盛达兆业科技投资有限公司 一种网页版的调用html5视频录制动画GIF图像的方法
CN111143620A (zh) * 2019-12-27 2020-05-12 广州爱美互动网络科技有限公司 一种具体化游戏地图编辑方法、系统及存储介质
CN111143620B (zh) * 2019-12-27 2023-12-15 北京骏加互娱科技有限公司 一种具体化游戏地图编辑方法、系统及存储介质

Similar Documents

Publication Publication Date Title
CN104822092B (zh) 视频打点、标引和字幕合并处理方法及装置
CN108989609A (zh) 视频封面生成方法、装置、终端设备及计算机存储介质
CN104135611A (zh) 利用分屏功能实现拍照的方法及装置
CN109448709A (zh) 一种终端投屏的控制方法和终端
CN105009599A (zh) 精彩时刻的自动标识
CN102368196A (zh) 客户端内容发送窗口中编辑动态图片的方法、终端及系统
CN110166729B (zh) 云视频会议方法、装置、系统、介质和计算设备
CN105554430B (zh) 一种视频通话方法、系统及装置
CN105096363A (zh) 一种编辑图片的方法及图片编辑装置
CN104796602B (zh) 一种合并视频文件的方法及装置
CN102036051A (zh) 实现视频会议中提词的方法以及装置
CN101697581A (zh) 支持同声传译视讯会议的方法、装置及系统
CN109672902A (zh) 一种视频抽帧方法、装置、电子设备和存储介质
CN103475572A (zh) 在即时通信应用中发送多张图片的方法、装置及系统
CN104298721A (zh) 一种基于Web的在线课件制作任意个对象分屏布局编辑方法
CN107707968A (zh) 一种网页视频转gif图片的数据处理方法及装置
CN105787976A (zh) 一种处理图片的方法和装置
CN107066438A (zh) 一种文本编辑方法及装置,电子设备
CN114237473A (zh) 同屏交互方法、装置及系统、存储介质、电子装置
CN105634909A (zh) 消息显示方法和消息显示装置
CN109660852A (zh) 录制视频发布前的视频预览方法、存储介质、设备及系统
CN105893735A (zh) 医疗信息远程同屏协助方法及终端
CN103313122B (zh) 一种数据处理方法及电子设备
CN111405375A (zh) 一种视频在线互动融合生成和管理方法及其装置
CN103825864A (zh) 数据采集及传输的方法和用户设备

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
RJ01 Rejection of invention patent application after publication

Application publication date: 20180216

RJ01 Rejection of invention patent application after publication