一种富文本的渲染方法及渲染设备技术

本申请公开了一种富文本的渲染方法及渲染设备，该方法包括：监听外部传入的第一富文本；进一步的，确定第一富文本中的第一富文本字符是否与当前访问页面的当前富文本字符相同；进一步的，若第一富文本字符与当前富文本字符不相同，采用正则表达式结合预设方法处理第一富文本，获得第二富文本，并保存第二富文本；进一步的，对第二富文本进行渲染，获得第一目标多媒体页面。通过这种方式，可以在不同的技术语言边编写工程中，统一使用相同的处理渲染逻辑，可以实现在不同技术语言编写的工程中无需重复实现同样的处理渲染逻辑的效果，可以降低代码的维护成本。降低代码的维护成本。降低代码的维护成本。

【技术实现步骤摘要】
一种富文本的渲染方法及渲染设备


[0001]本申请涉及互联网
，特别是涉及一种富文本的渲染方法及渲染设备。

技术介绍

[0002]目前，在web行业中有多种热门技术语言，例如Vue和React，支持渲染富文本，使得可以在页面中展示富文本内容。但是，由于多种技术语言编写的项目会需要渲染富文本字符的功能，需要重新采用对应的技术语言实现更改富文本字符的渲染逻辑。
[0003]可见，目前如果需要在不同的web语言环境中实现统一的富文本内容，代码会存在较大的差异，使得代码的维护成本增高。

技术实现思路

[0004]基于此，本申请提供一种富文本的渲染方法及渲染设备，用于解决现有技术中存在的若需要在不同的web语言环境中实现统一的富文本内容，代码会存在较大的差异，使得代码的维护成本增高的问题，可以降低代码的维护成本。
[0005]第一方面，本申请实施例提供一种富文本的渲染方法，包括：
[0006]监听外部传入的第一富文本；
[0007]确定所述第一富文本中的第一富文本字符是否与当前访问页面的当前富文本字符相同；
[0008]若所述第一富文本字符与所述当前富文本字符不相同，采用正则表达式结合预设方法处理所述第一富文本，获得第二富文本，并保存所述第二富文本；
[0009]对所述第二富文本进行渲染，获得第一目标多媒体页面。
[0010]在一种可能的设计中，监听外部传入的第一富文本，包括：
[0011]运用svelte的反应式声明监听外部传入的所述第一富文本。
[0012]在一种可能的设计中，保存所述第二富文本，包括：
[0013]采用transContent参数保存所述第二富文本。
[0014]在一种可能的设计中，所述预设方法为JavaScript的字符串replace方法；
[0015]采用正则表达式结合预设方法处理所述第一富文本，获得第二富文本，包括：
[0016]对所述第一富文本中的段首空格、空行进行去除处理，获得处理后的第一富文本；
[0017]采用所述正则表达式识别所述处理后的第一富文本中的视频、音频、图片的地址协议，以及识别所述处理后的第一富文本中的Video标签、Audio标签、Img标签和自定义模块；
[0018]采用所述字符串replace方法将所述地址协议替换为所述当前访问页面的协议，以及将所述Video标签、所述Audio标签、所述Img标签和所述自定义模块分别替换为带有随机id的div标签，并将所述Video标签、所述Audio标签、所述Img标签和所述自定义模块各自对应的随机id分别保存到相应的数组；
[0019]确定经过替换处理后的第一富文本的px值，将所述px值替换为所述当前访问页面
支持的rem值，获得所述第二富文本。
[0020]在一种可能的设计中，所述相应的数组包括：所述Video标签对应的videoArr数组、所述Audio标签对应的audioArr数组、所述Img标签对应的imgArr数组和所述自定义模块对应的voteElld数组；
[0021]对所述第二富文本进行渲染，获得第一目标多媒体页面，包括：
[0022]使用svelte的HTML内容插入功能，对所述第二富文本进行初次渲染处理，获得处理后的第二富文本；
[0023]遍历所述videoArr数组、所述audioArr数组、所述imgArr数组和所述voteElld数组，通过所述Video标签、所述Audio标签、所述Img标签和所述自定义模块各自对应的随机id，绑定实例化渲染所述videoArr数组、所述audioArr数组、所述imgArr数组和所述voteElld数组，并为所述videoArr数组、所述audioArr数组、所述imgArr数组和所述voteElld数组设置属性，获得所述第一目标多媒体页面。
[0024]在一种可能的设计中，对所述第二富文本进行渲染，获得第一目标多媒体页面之后，所述方法还包括：
[0025]接收所述相应的数组中的任一数组对应的更改参数；基于所述更改参数，动态改变渲染所述任一数组，得到新的第一目标多媒体页面；和/或，
[0026]接收针对所述相应的数组中的任一数组对应的定制参数；基于所述定制参数，动态改变渲染所述任一数组，得到新的第一目标多媒体页面。
[0027]在一种可能的设计中，所述方法还包括：
[0028]设置所述第一目标多媒体页面的样式属性font
‑
size，统一所述第一目标多媒体页面的样式尺寸与不同的终端中的页面的样式尺寸相同。
[0029]第二方面，本申请实施例提供一种渲染设备，包括：
[0030]监听单元，用于监听外部传入的第一富文本；
[0031]处理单元，用于确定所述第一富文本中的第一富文本字符是否与当前访问页面的当前富文本字符相同；若所述第一富文本字符与所述当前富文本字符不相同，采用正则表达式结合预设方法处理所述第一富文本，获得第二富文本，并保存所述第二富文本；对所述第二富文本进行渲染，获得第一目标多媒体页面。
[0032]在一种可能的设计中，所述监听单元具体用于：
[0033]运用svelte的反应式声明监听外部传入的所述第一富文本。
[0034]在一种可能的设计中，所述处理单元具体用于：
[0035]采用transContent参数保存所述第二富文本。
[0036]在一种可能的设计中，所述预设方法为JavaScript的字符串replace方法；所述处理单元具体用于：
[0037]对所述第一富文本中的段首空格、空行进行去除处理，获得处理后的第一富文本；
[0038]采用所述正则表达式识别所述处理后的第一富文本中的视频、音频、图片的地址协议，以及识别所述处理后的第一富文本中的Video标签、Audio标签、Img标签和自定义模块；
[0039]采用所述字符串replace方法将所述地址协议替换为所述当前访问页面的协议，以及将所述Video标签、所述Audio标签、所述Img标签和所述自定义模块分别替换为带有随
机id的div标签，并将所述Video标签、所述Audio标签、所述Img标签和所述自定义模块各自对应的随机id分别保存到相应的数组；
[0040]确定经过替换处理后的第一富文本的px值，将所述px值替换为所述当前访问页面支持的rem值，获得所述第二富文本。
[0041]在一种可能的设计中，所述相应的数组包括：所述Video标签对应的videoArr数组、所述Audio标签对应的audioArr数组、所述Img标签对应的imgArr数组和所述自定义模块对应的voteElld数组；所述处理单元具体用于：
[0042]使用svelte的HTML内容插入功能，对所述第二富文本进行初次渲染处理，获得处理后的第二富文本；
[0043]遍历所述vide本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种富文本的渲染方法，其特征在于，包括：监听外部传入的第一富文本；确定所述第一富文本中的第一富文本字符是否与当前访问页面的当前富文本字符相同；若所述第一富文本字符与所述当前富文本字符不相同，采用正则表达式结合预设方法处理所述第一富文本，获得第二富文本，并保存所述第二富文本；对所述第二富文本进行渲染，获得第一目标多媒体页面。2.如权利要求1所述的方法，其特征在于，监听外部传入的第一富文本，包括：运用svelte的反应式声明监听外部传入的所述第一富文本。3.如权利要求1所述的方法，其特征在于，保存所述第二富文本，包括：采用transContent参数保存所述第二富文本。4.如权利要求1所述的方法，其特征在于，所述预设方法为JavaScript的字符串replace方法；采用正则表达式结合预设方法处理所述第一富文本，获得第二富文本，包括：对所述第一富文本中的段首空格、空行进行去除处理，获得处理后的第一富文本；采用所述正则表达式识别所述处理后的第一富文本中的视频、音频、图片的地址协议，以及识别所述处理后的第一富文本中的Video标签、Audio标签、Img标签和自定义模块；采用所述字符串replace方法将所述地址协议替换为所述当前访问页面的协议，以及将所述Video标签、所述Audio标签、所述Img标签和所述自定义模块分别替换为带有随机id的div标签，并将所述Video标签、所述Audio标签、所述Img标签和所述自定义模块各自对应的随机id分别保存到相应的数组；确定经过替换处理后的第一富文本的px值，将所述px值替换为所述当前访问页面支持的rem值，获得所述第二富文本。5.如权利要求4所述的方法，其特征在于，所述相应的数组包括：所述Video标签对应的videoArr数组、所述Audio标签对应的audioArr数组、所述Img标签对应的imgArr数组和所述自定义模块对应的voteElld数组；对所述第二富文本进行渲染，获得第一目标多媒体页面，包括：使用svelte的HTML内容插入功能，对所述第二富文本进行初次渲染处理，获得处理后的第二富文本；遍历所述videoArr数组、...

【专利技术属性】
技术研发人员：许春华，
申请(专利权)人：广东触电传媒科技有限公司，
类型：发明
国别省市：