CN117615217A - 小程序中实现透明视频氛围的方法及系统 - Google Patents

小程序中实现透明视频氛围的方法及系统 Download PDF

Info

Publication number
CN117615217A
CN117615217A CN202311593403.7A CN202311593403A CN117615217A CN 117615217 A CN117615217 A CN 117615217A CN 202311593403 A CN202311593403 A CN 202311593403A CN 117615217 A CN117615217 A CN 117615217A
Authority
CN
China
Prior art keywords
video
frame
transparent
atmosphere
applet
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
CN202311593403.7A
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.)
Elongnet Information Technology Beijing Co Ltd
Original Assignee
Elongnet Information Technology Beijing 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 Elongnet Information Technology Beijing Co Ltd filed Critical Elongnet Information Technology Beijing Co Ltd
Priority to CN202311593403.7A priority Critical patent/CN117615217A/zh
Publication of CN117615217A publication Critical patent/CN117615217A/zh
Pending legal-status Critical Current

Links

Classifications

    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/43—Processing 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/443—OS processes, e.g. booting an STB, implementing a Java virtual machine in an STB or power management in an STB
    • H04N21/4438—Window management, e.g. event handling following interaction with the user interface
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00—Arrangements for program control, e.g. control units
    • G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44—Arrangements for executing specific programs
    • G06F9/451—Execution arrangements for user interfaces
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T1/00—General purpose image data processing
    • G06T1/20—Processor architectures; Processor configuration, e.g. pipelining
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T13/00—Animation
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/43—Processing 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/431—Generation of visual interfaces for content selection or interaction; Content or additional data rendering
    • H04N21/4312—Generation 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
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/43—Processing 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/44—Processing 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/44008—Processing 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 operations for analysing video streams, e.g. detecting features or characteristics in the video stream
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/43—Processing 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/44—Processing 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/44012—Processing 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 rendering scenes according to scene graphs, e.g. MPEG-4 scene graphs
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/47—End-user applications
    • H04N21/472—End-user interface for requesting content, additional data or services; End-user interface for interacting with content, e.g. for content reservation or setting reminders, for requesting event notification, for manipulating displayed content
    • H04N21/47214—End-user interface for requesting content, additional data or services; End-user interface for interacting with content, e.g. for content reservation or setting reminders, for requesting event notification, for manipulating displayed content for content reservation or setting reminders; for requesting event notification, e.g. of sport results or stock market
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T2210/00—Indexing scheme for image generation or computer graphics
    • G06T2210/62—Semi-transparency

Landscapes

  • Engineering & Computer Science (AREA)
  • Multimedia (AREA)
  • Signal Processing (AREA)
  • Theoretical Computer Science (AREA)
  • Software Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • Finance (AREA)
  • Strategic Management (AREA)
  • Databases & Information Systems (AREA)
  • Business, Economics & Management (AREA)
  • General Engineering & Computer Science (AREA)
  • Image Generation (AREA)

Abstract

本发明公开了一种小程序中实现透明视频氛围的方法及系统，所述方法包括：逐帧解析视频的像素信息，得到每一帧的像素数据；在webgl中创建自定义的着色器进行图像渲染；基于项目的页面、组件、事件在中台中进行配置播放事件触发器；当在小程序中符合播放条件时，触发加载/播放对应的透明视频氛围的事件。通过本公开的处理方案，可以在小程序业务中任意页面和事件进行播放埋点配置。在符合埋点条件时，调起视频播放组件，进行透明视频播放来达到氛围渲染效果，提升用户体验。

Description

小程序中实现透明视频氛围的方法及系统
技术领域
本发明涉及计算机技术领域，特别是涉及一种小程序中实现透明视频氛围的方法及系统。
背景技术
在小程序里，目前并未提供透明视频播放的能力，这在一些需要展示酷炫复杂的氛围时，可能是序列帧动画，或是简单的矢量动画，对于能有更好表现的位图视频，则可用的手段十分有限。
市面上透明视频播放方案有如afx、png序列帧动画、lottie等，播放方式则是手动在符合条件时播放，需求变更都需要重新开发埋点和配置视频，浪费人力物力，效率较低，而lottie仅支持矢量图，不支持复杂的视频内容播放。
发明内容
有鉴于此，本公开实施例提供一种小程序中实现透明视频氛围的方法，至少部分解决现有技术中存在的问题。
第一方面，本公开实施例提供了一种小程序中实现透明视频氛围的方法，所述方法包括以下步骤：
逐帧解析视频的像素信息，得到每一帧的像素数据；
在webgl中创建自定义的着色器进行图像渲染；
基于项目的页面、组件、事件在中台中进行配置播放事件触发器；当在小程序中符合播放条件时，触发加载/播放对应的透明视频氛围的事件。
根据本公开实施例的一种具体实现方式，所述方法还包括：
在所述事件触发时，获取当前执行的运行时的上下文数据。
根据本公开实施例的一种具体实现方式，所述逐帧解析视频的像素信息，得到每一帧的像素数据，包括：
将原始视频处理为可使用自定义着色器的视频，并且原视频在特效软件中导出时，保留透明通道数据；
使用ffmpeg对视频进行处理，生成双倍尺寸的视频；其中，透明通道用白色表示，原视频用正常原彩表示。
根据本公开实施例的一种具体实现方式，所述在webgl中创建自定义的着色器进行图像渲染，包括：
使用2个自定义着色器对每一帧信息的像素进行处理，根据左侧的像素数据和右侧原始帧数据，计算出需要绘制的像素；
将计算后的像素数据通过webgl.drawArrays逐帧绘制到canvas上下文中，绘制出符合预期的透明视频。
根据本公开实施例的一种具体实现方式，所述根据左侧的像素数据和右侧原始帧数据，计算出需要绘制的像素，包括：
使用顶点着色器将顶点位置和纹理坐标发送至GPU，进行变换并且输出变换后的位置和纹理坐标；
将所述变换后的位置和纹理坐标发送至片原着色器，对每一个像素进行颜色计算，基于RGB颜色与左侧纹理采样组合成输出新的像素信息，最终输出到屏幕上。
第二方面，本公开实施例提供了一种小程序中实现透明视频氛围的系统，所述系统包括：
解析模块，被配置用于逐帧解析视频的像素信息，得到每一帧的像素数据；
渲染模块，被配置用于在webgl中创建自定义的着色器进行图像渲染；
触发模块，被配置用于基于项目的页面、组件、事件在中台中进行配置播放事件触发器；当在小程序中符合播放条件时，触发加载/播放对应的透明视频氛围的事件。
根据本公开实施例的一种具体实现方式，所述系统还包括：
处理模块，被配置用于将原始视频处理为可使用自定义着色器的视频，并且原视频在特效软件中导出时，保留透明通道数据；以及，
使用ffmpeg对视频进行处理，生成双倍尺寸的视频；其中，透明通道用白色表示，原视频用正常原彩表示。
第三方面，本公开实施例还提供了一种电子设备，该电子设备包括：
至少一个处理器；以及，
与所述至少一个处理器通信连接的存储器；其中，
所述存储器存储有能够被所述至少一个处理器执行的指令，所述指令被所述至少一个处理器执行时，使所述至少一个处理器前述第一方面或第一方面的任一实现方式中的任一项所述的小程序中实现透明视频氛围的方法。
第四方面，本公开实施例还提供了一种非暂态计算机可读存储介质，所述非暂态计算机可读存储介质存储计算机指令，所述计算机指令当由至少一个处理器执行时使所述至少一个处理器执行前述第一方面或第一方面的任一实现方式中的小程序中实现透明视频氛围的方法。
第五方面，本公开实施例还提供了一种计算机程序产品，所述计算机程序产品包括存储在非暂态计算机可读存储介质上的计算程序，所述计算机程序包括程序指令，当所述程序指令被计算机执行时，使该计算机执行前述第一方面或第一方面的任一实现方式中的小程序中实现透明视频氛围的方法。
本公开实施例中的小程序中实现透明视频氛围的方法，通过这一技术方案，可以在配置系统中对小程序业务中任意页面和事件进行播放埋点配置而无需修改代码。在符合埋点条件时，调起视频播放组件，进行透明视频播放来达到氛围渲染效果，提升用户体验。
附图说明
上述仅是本发明技术方案的概述，为了能够更清楚了解本发明的技术手段，以下结合附图与具体实施方式对本发明作进一步的详细说明。
图1为本公开实施例提供的一种小程序中实现透明视频氛围的方法流程示意图；
图2为本公开实施例提供的一种原始视频的demo示意图；其中，左侧为需要保留的像素，右侧为原始帧；
图3为本公开实施例提供的一种搜索世界杯时，触发透明视频播放时的效果示意图；
图4为本公开实施例提供的一种小程序中实现透明视频氛围的系统结构示意图；以及
图5为本公开实施例提供的电子设备示意图。
具体实施方式
下面结合附图对本公开实施例进行详细描述。
以下通过特定的具体实例说明本公开的实施方式，本领域技术人员可由本说明书所揭露的内容轻易地了解本公开的其他优点与功效。显然，所描述的实施例仅仅是本公开一部分实施例，而不是全部的实施例。本公开还可以通过另外不同的具体实施方式加以实施或应用，本说明书中的各项细节也可以基于不同观点与应用，在没有背离本公开的精神下进行各种修饰或改变。需说明的是，在不冲突的情况下，以下实施例及实施例中的特征可以相互组合。基于本公开中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本公开保护的范围。
需要说明的是，下文描述在所附权利要求书的范围内的实施例的各种方面。应显而易见，本文中所描述的方面可体现于广泛多种形式中，且本文中所描述的任何特定结构及/或功能仅为说明性的。基于本公开，所属领域的技术人员应了解，本文中所描述的一个方面可与任何其他方面独立地实施，且可以各种方式组合这些方面中的两者或两者以上。举例来说，可使用本文中所阐述的任何数目个方面来实施设备及/或实践方法。另外，可使用除了本文中所阐述的方面中的一或多者之外的其他结构及/或功能性实施此设备及/或实践此方法。
另外，在以下描述中，提供具体细节是为了便于透彻理解实例。然而，所属领域的技术人员将理解，可在没有这些特定细节的情况下实践所述方面。
本发明实施例提供了一种小程序中实现透明视频氛围的方法，能够实现以下功能：
1、本发明是让小程序拥有在发生任意交互时，可播放透明视频作为氛围的能力。
2、支持在任何组件、页面的捕获函数的执行，并在其触发时作为启动视频播放。
3、支持任意形式的动画，不局限于矢量简单动画，丰富前端动画表现。
4、视频可通过中台统一配置，对应不同的事件、数据、小程序环境、页面等等灵活匹配视频，还可额外配置交互区域，如视频关闭按钮、确定按钮等。
本发明的核心使用canvas+webgl自定义着色器+videoDecoder实现透明视频播放。
图1为本公开实施例提供的小程序中实现透明视频氛围的方法流程的示意图。
如图1所示，在步骤S110处，逐帧解析视频的像素信息，得到每一帧的像素数据。
在本发明实施例中，所述逐帧解析视频的像素信息，得到每一帧的像素数据，包括：将原始视频处理为可使用自定义着色器的视频，并且原视频在特效软件中导出时，保留透明通道数据；使用ffmpeg对视频进行处理，生成双倍尺寸的视频；其中，透明通道用白色表示，原视频用正常原彩表示。
更具体地，基于wx.createVideoDecoder实现步骤S110，此api可用来逐帧解析视频的像素信息，它允许对本地或远程mp4文件进行处理，得到每一帧的像素数据。
将原始视频处理为可使用自定义着色器的视频，要求原视频在ae等特效软件中导出时，保留透明通道数据，然后使用ffmpeg对视频进行处理生成双倍尺寸的视频，其中透明通道用白色表示，原视频则正常原彩表示(如图2所示)。
使用此方案优点则是微信原生api，兼容性好，获取视频帧数据并且可按照TPS逐帧获取数据，保持原始播放速率，无需缓存帧数据，降低客户端内存占用。
更具体地，接下来转到步骤S120。
在步骤S120处，在webgl中创建自定义的着色器进行图像渲染。
在本发明实施例中，所述在webgl中创建自定义的着色器进行图像渲染，包括：使用2个自定义着色器对每一帧信息的像素进行处理，根据左侧的像素数据和右侧原始帧数据，计算出需要绘制的像素；将计算后的像素数据通过webgl.drawArrays逐帧绘制到canvas上下文中，绘制出符合预期的透明视频。
在本发明实施例中，所述根据左侧的像素数据和右侧原始帧数据，计算出需要绘制的像素，包括：使用顶点着色器将顶点位置和纹理坐标发送至GPU，进行变换并且输出变换后的位置和纹理坐标；将所述变换后的位置和纹理坐标发送至片原着色器，对每一个像素进行颜色计算，基于RGB颜色与左侧纹理采样组合成输出新的像素信息，最终输出到屏幕上。
更具体地，基于WebGL着色器Shader实现步骤S120，使用此API可在webgl中，创建自定义的着色器进行图像渲染。
具体流程为：
1、使用该着色器对每一帧信息的像素进行处理，根据左侧的像素数据和右侧原始帧数据，计算出需要绘制的像素。
2、将计算后的像素数据逐帧绘制到canvas上下文中，可绘制出一个符合预期的透明视频(如图3所示)。
其优点则是原生js语言，技术栈精简，使用自定义着色器，对帧处理的效率友好，视频流畅不卡顿。
canvas改进点在于：webgl基于GPU的图形渲染技术拥有更快的性能；支持高质量的抗锯齿、纹理过滤技术，拥有更高的图形保真度；webgl提供了许多灵活的图形处理技术，包括裁剪、变换、矩阵操作和透明度控制等。
接下来转到步骤S130。
在步骤S130处，基于项目的页面、组件、事件在中台中进行配置播放事件触发器；当在小程序中符合播放条件时，触发加载/播放对应的透明视频氛围的事件。
在本发明实施例中，所述方法还包括：在所述事件触发时，获取当前执行的运行时的上下文数据。
更具体地，基于视频氛围配置中台实现步骤S130。视频氛围配置中台是一个配置系统，通过对项目的页面、组件、事件在中台中进行配置播放事件触发器，在小程序中符合播放条件时，就会触发加载/播放对应的透明视频氛围的事件，并且在对应事件触发时，可获取到当前执行的运行时上下文数据，所以配置的灵活程度可精确到酒店id，搜索关键词匹配、筛选项匹配等。
本发明提出的小程序中实现透明视频氛围的方法，可以在小程序业务中任意页面和事件进行播放埋点配置。在符合埋点条件时，调起视频播放组件，进行透明视频播放来达到氛围渲染效果，提升用户体验。
图4示出了本发明提供的小程序中实现透明视频氛围的系统400，包括解析模块410、渲染模块420和触发模块430。
解析模块410用于逐帧解析视频的像素信息，得到每一帧的像素数据；
渲染模块420用于在webgl中创建自定义的着色器进行图像渲染；
触发模块430用于基于项目的页面、组件、事件在中台中进行配置播放事件触发器；当在小程序中符合播放条件时，触发加载/播放对应的透明视频氛围的事件。
在本发明实施例中，所述系统还包括：处理模块，被配置用于将原始视频处理为可使用自定义着色器的视频，并且原视频在特效软件中导出时，保留透明通道数据；以及，使用ffmpeg对视频进行处理，生成双倍尺寸的视频；其中，透明通道用白色表示，原视频用正常原彩表示。
参见图5，本公开实施例还提供了一种电子设备50，该电子设备包括：
至少一个处理器；以及，
与该至少一个处理器通信连接的存储器；其中，
该存储器存储有可被该至少一个处理器执行的指令，该指令被该至少一个处理器执行，以使该至少一个处理器能够执行前述方法实施例中的小程序中实现透明视频氛围的方法。
本公开实施例还提供了一种非暂态计算机可读存储介质，该非暂态计算机可读存储介质存储计算机指令，该计算机指令用于使该计算机执行前述方法实施例中的小程序中实现透明视频氛围的方法。
本公开实施例还提供了一种计算机程序产品，该计算机程序产品包括存储在非暂态计算机可读存储介质上的计算程序，该计算机程序包括程序指令，当该程序指令被计算机执行时，使该计算机执行前述方法实施例中的小程序中实现透明视频氛围的方法。
下面参考图5，其示出了适于用来实现本公开实施例的电子设备50的结构示意图。本公开实施例中的电子设备可以包括但不限于诸如移动电话、笔记本电脑、数字广播接收器、PDA(个人数字助理)、PAD(平板电脑)、PMP(便携式多媒体播放器)、车载终端(例如车载导航终端)等等的移动终端以及诸如数字TV、台式计算机等等的固定终端。图5示出的电子设备仅仅是一个示例，不应对本公开实施例的功能和使用范围带来任何限制。
如图5所示，电子设备50可以包括处理装置(例如中央处理器、图形处理器等)501，其可以根据存储在只读存储器(ROM)502中的程序或者从存储装置508加载到随机访问存储器(RAM)503中的程序而执行各种适当的动作和处理。在RAM 503中，还存储有电子设备50操作所需的各种程序和数据。处理装置501、ROM 502以及RAM 503通过总线504彼此相连。输入/输出(I/O)接口505也连接至总线504。
通常，以下装置可以连接至I/O接口505：包括例如触摸屏、触摸板、键盘、鼠标、图像传感器、麦克风、加速度计、陀螺仪等的输入装置506；包括例如液晶显示器(LCD)、扬声器、振动器等的输出装置507；包括例如磁带、硬盘等的存储装置508；以及通信装置509。通信装置509可以允许电子设备50与其他设备进行无线或有线通信以交换数据。虽然图中示出了具有各种装置的电子设备50，但是应理解的是，并不要求实施或具备所有示出的装置。可以替代地实施或具备更多或更少的装置。
特别地，根据本公开的实施例，上文参考流程图描述的过程可以被实现为计算机软件程序。例如，本公开的实施例包括一种计算机程序产品，其包括承载在计算机可读介质上的计算机程序，该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中，该计算机程序可以通过通信装置509从网络上被下载和安装，或者从存储装置508被安装，或者从ROM 502被安装。在该计算机程序被处理装置501执行时，执行本公开实施例的方法中限定的上述功能。
需要说明的是，本公开上述的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本公开中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本公开中，计算机可读信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读信号介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于：电线、光缆、RF(射频)等等，或者上述的任意合适的组合。
上述计算机可读介质可以是上述电子设备中所包含的；也可以是单独存在，而未装配入该电子设备中。
上述计算机可读介质承载有一个或者多个程序，当上述一个或者多个程序被该电子设备执行时，使得该电子设备：获取至少两个网际协议地址；向节点评价设备发送包括所述至少两个网际协议地址的节点评价请求，其中，所述节点评价设备从所述至少两个网际协议地址中，选取网际协议地址并返回；接收所述节点评价设备返回的网际协议地址；其中，所获取的网际协议地址指示内容分发网络中的边缘节点。
或者，上述计算机可读介质承载有一个或者多个程序，当上述一个或者多个程序被该电子设备执行时，使得该电子设备：接收包括至少两个网际协议地址的节点评价请求；从所述至少两个网际协议地址中，选取网际协议地址；返回选取出的网际协议地址；其中，接收到的网际协议地址指示内容分发网络中的边缘节点。
可以以一种或多种程序设计语言或其组合来编写用于执行本公开的操作的计算机程序代码，上述程序设计语言包括面向对象的程序设计语言—诸如Java、Smalltalk、C++，还包括常规的过程式程序设计语言—诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算机上执行、部分地在用户计算机上执行、作为一个独立的软件包执行、部分在用户计算机上部分在远程计算机上执行、或者完全在远程计算机或服务器上执行。在涉及远程计算机的情形中，远程计算机可以通过任意种类的网络——包括局域网(LAN)或广域网(WAN)—连接到用户计算机，或者，可以连接到外部计算机(例如利用因特网服务提供商来通过因特网连接)。
附图中的流程图和框图，图示了按照本公开各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分，该模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个接连地表示的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。
描述于本公开实施例中所涉及到的单元可以通过软件的方式实现，也可以通过硬件的方式来实现。其中，单元的名称在某种情况下并不构成对该单元本身的限定，例如，第一获取单元还可以被描述为“获取至少两个网际协议地址的单元”。
应当理解，本公开的各部分可以用硬件、软件、固件或它们的组合来实现。
以上所述，仅为本公开的具体实施方式，但本公开的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本公开揭露的技术范围内，可轻易想到的变化或替换，都应涵盖在本公开的保护范围之内。因此，本公开的保护范围应以权利要求的保护范围为准。

Claims (9)

1.一种小程序中实现透明视频氛围的方法，其特征在于，所述方法包括以下步骤：
逐帧解析视频的像素信息，得到每一帧的像素数据；
在webgl中创建自定义的着色器进行图像渲染；
基于项目的页面、组件、事件在中台中进行配置播放事件触发器；当在小程序中符合播放条件时，触发加载/播放对应的透明视频氛围的事件。
2.根据权利要求1所述的小程序中实现透明视频氛围的方法，其特征在于，所述方法还包括：
在所述事件触发时，获取当前执行的运行时的上下文数据。
3.根据权利要求1所述的小程序中实现透明视频氛围的方法，其特征在于，所述逐帧解析视频的像素信息，得到每一帧的像素数据，包括：
将原始视频通过使用ffmpeg对视频进行处理，生成双倍尺寸的视频；其中，透明通道用白色表示，原视频用正常原彩表示(参考：图2)，此时视频为可使用自定义着色器的视频，并且需要原视频在特效软件中导出时，保留透明通道数据。
4.根据权利要求1所述的小程序中实现透明视频氛围的方法，其特征在于，所述在webgl中创建自定义的着色器进行图像渲染，包括：
使用2个自定义着色器对每一帧信息的像素进行处理，根据左侧的像素数据和右侧原始帧数据，计算出需要绘制的像素；
将计算后的像素数据通过webgl.drawArrays逐帧绘制到canvas上下文中，绘制出符合预期的透明视频。
5.根据权利要求4所述的小程序中实现透明视频氛围的方法，其特征在于，所述根据左侧的像素数据和右侧原始帧数据，计算出需要绘制的像素，包括：
使用顶点着色器将顶点位置和纹理坐标发送至GPU，进行变换并且输出变换后的位置和纹理坐标；
将所述变换后的位置和纹理坐标发送至片原着色器，对每一个像素进行颜色计算，基于RGB颜色与左侧纹理采样组合成输出新的像素信息，最终输出到屏幕上。
6.一种小程序中实现透明视频氛围的系统，其特征在于，所述系统包括：
解析模块，被配置用于逐帧解析视频的像素信息，得到每一帧的像素数据；
渲染模块，被配置用于在webgl中创建自定义的着色器进行图像渲染；
触发模块，被配置用于基于项目的页面、组件、事件在中台中进行配置播放事件触发器；当在小程序中符合播放条件时，触发加载/播放对应的透明视频氛围的事件。
7.根据权利要求6所述的小程序中实现透明视频氛围的系统，其特征在于，所述系统还包括：
处理模块，被配置用于将原始视频处理为可使用自定义着色器的视频，并且原视频在特效软件中导出时，保留透明通道数据；以及，
使用ffmpeg对视频进行处理，生成双倍尺寸的视频；其中，透明通道用白色表示，原视频用正常原彩表示。
8.一种电子设备，其特征在于，该电子设备包括：
至少一个处理器；以及，
与所述至少一个处理器通信连接的存储器；其中，
所述存储器存储有能够被所述至少一个处理器执行的指令，所述指令被所述至少一个处理器执行时，使所述至少一个处理器执行如权利要求1至5中的任一项所述的小程序中实现透明视频氛围的方法。
9.一种非暂态计算机可读存储介质，其特征在于，所述非暂态计算机可读存储介质存储计算机指令，所述计算机指令当由至少一个处理器执行时使所述至少一个处理器执行如权利要求1至5中的任一项所述的小程序中实现透明视频氛围的方法。
CN202311593403.7A 2023-11-27 2023-11-27 小程序中实现透明视频氛围的方法及系统 Pending CN117615217A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202311593403.7A CN117615217A (zh) 2023-11-27 2023-11-27 小程序中实现透明视频氛围的方法及系统

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202311593403.7A CN117615217A (zh) 2023-11-27 2023-11-27 小程序中实现透明视频氛围的方法及系统

Publications (1)

Publication Number Publication Date
CN117615217A true CN117615217A (zh) 2024-02-27

Family

ID=89945810

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202311593403.7A Pending CN117615217A (zh) 2023-11-27 2023-11-27 小程序中实现透明视频氛围的方法及系统

Country Status (1)

Country Link
CN (1) CN117615217A (zh)

Similar Documents

Publication Publication Date Title
US11178448B2 (en) Method, apparatus for processing video, electronic device and computer-readable storage medium
CN110046021B (zh) 一种页面显示方法、装置、系统、设备和存储介质
CN109460233B (zh) 页面的原生界面显示更新方法、装置、终端设备及介质
CN110070896B (zh) 图像处理方法、装置、硬件装置
CN110380955B (zh) 消息处理方法、装置及电子设备
US20220094758A1 (en) Method and apparatus for publishing video synchronously, electronic device, and readable storage medium
US20220277481A1 (en) Panoramic video processing method and apparatus, and storage medium
US12112772B2 (en) Method and apparatus for video production, device and storage medium
CN110290398B (zh) 视频下发方法、装置、存储介质及电子设备
CN115359226B (zh) 鸿蒙系统基于纹理压缩的vr展示方法、电子设备及介质
WO2023273615A1 (zh) 媒体文件处理方法、装置、设备、可读存储介质及产品
CN111258519A (zh) 屏幕分屏实现方法、装置、终端和介质
CN110134905B (zh) 一种页面更新显示方法、装置、设备及存储介质
CN109714626B (zh) 信息交互方法、装置、电子设备、和计算机可读存储介质
WO2024131621A1 (zh) 特效生成方法、装置、电子设备及存储介质
CN112492399B (zh) 信息显示方法、装置及电子设备
CN110147283B (zh) 一种显示内容切换显示方法、装置、设备及介质
CN116170398A (zh) 基于虚拟对象的互动方法、装置、设备、存储介质及产品
CN115878115A (zh) 页面渲染方法、装置、介质和电子设备
CN117615217A (zh) 小程序中实现透明视频氛围的方法及系统
CN115269084A (zh) 目标功能显示方法、装置、设备、可读存储介质及产品
CN114090817A (zh) 一种人脸特征数据库动态构建方法、装置及存储介质
CN113747226A (zh) 视频展示方法、装置、电子设备及程序产品
CN110618772B (zh) 一种视图添加方法、装置、设备及存储介质
CN111199519A (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