CN113760283A - 一种文本渲染方法和装置 - Google Patents

Abstract

本发明公开了文本渲染方法和装置，涉及计算机技术领域。该方法的一具体实施方式包括接收文本渲染请求，启动NodeJS服务，以创建post请求接口，获取所述文本渲染请求中的文本数据和图片数据；根据所述图片数据，创建画布对象，下载所有字体文件，以将所述文本数据加载至所述画布对象，生成预设格式的图片文件并输出。从而，本发明的实施方式能够解决现有文本渲染效率低、用户体验差的问题。

Description

一种文本渲染方法和装置

技术领域

本发明涉及计算机技术领域，尤其涉及一种文本渲染方法和装置。

背景技术

目前，实现网页中引入特殊字体的方式可以通过UI设计图软件将特殊字体转换成位图进行导出，然后将图片文件提供给前端开发人员，前端开发人员用指定前端语言标签嵌入到页面中。或者在前端Web页面中直接使用特殊字体，需要通过CSS层叠样式指定特殊字体的网络路径去进行加载，加载成功后方可进行文本的渲染展示。

在实现本发明过程中，发明人发现现有技术中至少存在如下问题：

通过制图软件生成的图片会造成发布Web应用时产生过多的静态资源文件，不仅会造成应用包体积过大，更会造成用户在访问页面时需要过多的网络流量去加载这些资源文件，网络请求频繁，服务器资源占用过多，除此之外，图片加载可能会受网络等因素造成一定的延迟，进而降低用户体验。而使用CSS层叠样式则中文字体包会相对较大，因此当用户打开网页时，因为需要较长的时间来下载字体，导致用户体验不好，各浏览器所能识别字体的兼容性很差。

发明内容

有鉴于此，本发明实施例提供一种文本渲染方法和装置，能够解决现有文本渲染效率低、用户体验差的问题。

为实现上述目的，根据本发明实施例的一个方面，提供了一种文本渲染方法，包括接收文本渲染请求，启动NodeJS服务，以创建post请求接口，获取所述文本渲染请求中的文本数据和图片数据；根据所述图片数据，创建画布对象，下载所有字体文件，以将所述文本数据加载至所述画布对象，生成预设格式的图片文件并输出。

可选地，根据所述图片数据，创建画布对象，包括：

安装node-canvas插件，调用createCanvas方法基于所述的图片数据创建canvas画布对象。

可选地，将所述文本数据加载至所述画布对象，包括：

调用fillText方法，向canvas画布对象中写入所述文本数据。

可选地，将所述文本数据加载至所述画布对象之前，包括：

获取所述文本数据中的字体属性，确定所述字体属性为自定义，则通过canvas.registerFont方法引入并命名自定义字体，进而利用context.fontFamily方法设定字体的大小和特殊格式。

可选地，生成预设格式的图片文件之前，包括：

根据预设的识别模型，对加载后的所述画布对象进行文本查找，以确定折行点；

获取所述文本数据中的文本起始x坐标、文本起始y坐标和文本行高，计算得到所述折行点换行后的位置信息(x，y+文本行高)，进而对所述折行点执行换行操作。

可选地，根据预设的识别模型，对加载后的所述画布对象进行文本查找，以确定折行点，包括：

根据二分查找算法对加载后的所述画布对象进行文本查找，以确定折行点；

利用正则表达式匹配得到折行点的后一个字符为标点符号，则将折行点向前移动一个字符；以及利用正则表达式匹配得到折行点向前的第一个空格，获取折行点与第一个空格之间的字符数量，以基于所述字符数量将折行点向前移动。

可选地，生成预设格式的图片文件并输出，包括：

通过canvas.toDataURL方法将加载后的画布对象输出为预设格式的图片文件，进而输出至客户端以使用图片标签元素加载。

另外，本发明还提供了一种文本渲染装置，包括：获取模块，用于接收文本渲染请求，启动NodeJS服务，以创建post请求接口，获取所述文本渲染请求中的文本数据和图片数据；处理模块，用于根据所述图片数据，创建画布对象，下载所有字体文件，以将所述文本数据加载至所述画布对象，生成预设格式的图片文件并输出。

上述发明中的一个实施例具有如下优点或有益效果：本发明能够解决Web前端页面需要展示特定字体的文本内容时，造成静态资源过多，引用特殊字体文件又会造成页面加载慢等问题。并且，本发明利用NodeJS服务端技术在处理高并发请求时的良好性能特点以及NodeJS具有对图形处理的天然优势，通过搭建NodeJS服务(比如Egg.js或Express.js等框架)结合node-canvas来对文本进行动态渲染，并通过二分查找的算法实现对文字换行、标点符号不出现首行以及英文单词不拆分等细节问题，再使用canvas对象上的toDataURL方法输出图片文件，最终通过对NodeJS服务实现的接口进行包装，对用户暴露一个只需要传递特定参数的方法。

上述的非惯用的可选方式所具有的进一步效果将在下文中结合具体实施方式加以说明。

附图说明

附图用于更好地理解本发明，不构成对本发明的不当限定。其中：

图1是根据本发明第一实施例的文本渲染方法的主要流程的示意图；

图2是根据本发明第二实施例的文本渲染方法的主要流程的示意图；

图3是根据本发明第三实施例的文本渲染方法的主要流程的示意图；

图4是根据本发明实施例的文本渲染装置的主要模块的示意图；

图5是本发明实施例可以应用于其中的示例性系统架构图；

图6是适于用来实现本发明实施例的终端设备或服务器的计算机系统的结构示意图。

具体实施方式

以下结合附图对本发明的示范性实施例做出说明，其中包括本发明实施例的各种细节以助于理解，应当将它们认为仅仅是示范性的。因此，本领域普通技术人员应当认识到，可以对这里描述的实施例做出各种改变和修改，而不会背离本发明的范围和精神。同样，为了清楚和简明，以下的描述中省略了对公知功能和结构的描述。

图1是根据本发明第一实施例的文本渲染方法的主要流程的示意图，如图1所示，所述文本渲染方法包括：

步骤S101，接收文本渲染请求，启动NodeJS服务，以创建post请求接口，获取所述文本渲染请求中的文本数据和图片数据。

在实施例中，NodeJS是能够让JavaScript运行在服务端的开发平台。Post接口可以向指定资源提交数据进行处理请求(提交表单、上传文件)，又可能导致新的资源的建立或原有资源的修改。

需要说明的是，本发明接收的文本渲染请求，使用NodeJS技术开启一个服务，创建post请求接口可以接收文本渲染请求的文本数据和图片数据，而文本数据可以包括text(文本内容)、fontSize(字体大小)、color(字体颜色)、x(文本起始x坐标)、y(文本起始y坐标)、lineHeight(文本行高)、fontFamily(字体格式)等等参数数据，而图片数据可以包括width(图片宽度)、height(图片高度)等等参数数据。

步骤S102，根据所述图片数据，创建画布对象，下载所有字体文件，以将所述文本数据加载至所述画布对象，生成预设格式的图片文件并输出。

在实施例中，在服务端安装下载所有字体文件，方便之后实现过程中加载特殊字体，以达到可以实现特殊字体文本渲染的效果。

在一些实施例中，根据所述图片数据，创建画布对象，具体地实施过程包括安装node-canvas插件，调用createCanvas方法基于所述的图片数据创建canvas画布对象。其中，node-canvas即为一种在服务端可以使用canvas前端绘图技术的插件，可以实现在服务端动态创建这种绘制对象。

较佳地，安装node-canvas插件，通过其内部方法createCanvas创建一个canvas画布对象，canvas画布对象即为一种用Web前端实现图形和文本绘制的底层显示对象，画布宽高由传入的图片数据width、height两个参数决定，之后通过getContext方法创建一个context对象，context对象即为通过canvas获取的绘图上下文对象。

进一步地实施例，将所述文本数据加载至所述画布对象，具体实施过程包括调用fillText方法，向canvas画布对象中写入所述文本数据。需要说明的是，使用canvas提供的fillText(lineHeight，x，y)方法向canvas画布中写入文本，并通过文本数据中的参数决定文本的行高、起始位置、字体颜色以及字体大小等等。

作为另一些实施例，将所述文本数据加载至所述画布对象之前，还可以包括获取所述文本数据中的字体属性，确定所述字体属性为自定义，则通过canvas.registerFont方法引入并命名自定义字体，进而利用context.fontFamily方法设定字体的大小和特殊格式。进一步地实施例，自定义字体需要使用canvas.registerFont(‘字体文件’，{family:‘字体名称’})方法进行引入并命名，registerFont是canvas画布对象提供的方法，是用来注册服务端指定的特殊字体，并用于后续的文本绘制阶段，然后使用context.fontFamily＝‘fontSize(字体大小)“字体名称”’设定字体的大小以及特殊格式，fontFamily是绘图上下文对象context的属性，通过context的属性可以设置已经注册的特殊字体，同时可以精确控制字号，用于文本内容的绘制。可以看出，该实施例可以实现自定义以及特殊字体的文本渲染，使得文本渲染更加灵活。

作为再一些实施例，生成预设格式的图片文件之前，可以根据预设的识别模型，对加载后的所述画布对象进行文本查找，以确定折行点。然后，获取所述文本数据中的文本起始x坐标、文本起始y坐标和文本行高，计算得到所述折行点换行后的位置信息(x，y+文本行高)，进而对所述折行点执行换行操作。进一步地实施例，根据预设的识别模型，对加载后的所述画布对象进行文本查找，以确定折行点，具体的实施过程包括：根据二分查找算法对加载后的所述画布对象进行文本查找，以确定折行点。然后利用正则表达式匹配得到折行点的后一个字符为标点符号，则将折行点向前移动一个字符(例如：处理标点字符不出现首行的情况，则可以采用正则表达式匹配折行点的后一个字符是否为标点符号，若是则将折行点向前移动一个字符再进行换行，若不是则进行正常的折行操作。)。以及利用正则表达式匹配得到折行点向前的第一个空格，获取折行点与第一个空格之间的字符数量，以基于所述字符数量将折行点向前移动(例如：处理英文单词不拆分的情况，则可以采用正则表达式匹配得到折行点向前的第一个空格，获取折行点与第一个空格之间的字符数量n，之后将折行点向前移动n个位置，再进行换行。)。

需要说明的是，使用二分查找算法对文本进行折行点定位，具体的实施过程包括：如果某一个位置之前的文字宽度小于或等于设定的宽度，并且此位置之后一个字之前的文字宽度大于设定的宽度，此位置点即折行点，之后对整个文本进行循环查找，直到不存在这样的换行点为止。例如：一行的宽度为42cm，一个文字的宽度为5cm，那么一行只能放下8.25个字，但是文字不能分成两半，所以一行只能放下8个，剩余的换行显示。

较佳的，测量文本宽度可以借助canvas提供的measureText方法。其中，所述measureText方法可以使用指定字体进行绘制时测量指定的文本。

还值得说明的是，生成预设格式的图片文件并输出，具体的实施过程包括通过canvas.toDataURL方法将加载后的画布对象输出为预设格式的图片文件，进而输出至客户端以使用图片标签元素加载。例如：使用canvas.toDataURL()方法将加载后的文本画布输出为base64格式的图片文件，并作为结果返回至客户端，客户端直接使用image标签元素加载即可。

作为另外一些实施例，本发明可以将post接口封装为一个对外方法，例如：specialFont(text,fontSize,color,x,y,width,height,lineHeight,fontFamily)，specialFont为自定义的方法名称，同时可以接收前端传入的参数(文本内容、字体大小、字体颜色、字体起始x轴位置、字体起始y轴位置、画布的宽度、画布的高度、文本的行高、文本的特殊字体格式等等)，客户端直接调用此方法实现特殊字体文本的渲染。较佳的，为了兼容没有传入参数的问题，即如果缺失某个参数(文本数据、图片数据中的某个参数没有传入数据)，则可以预设的默认参数数据进行处理，例如：默认fontSize：16px，color：#ffffff，x：0，y：0，with和height为canvas默认宽高即300*150，lineHeight和fontFamily为canvas默认行高以及字体。

需要说明的是，本发明最终可以将post接口发布为一个通用型网络接口，部署在生产环境的底层接口服务上，方便任何Web前端应用随时调用，真正实现了按需调用，保证了网络资源的合理利用。

综上所述，本发明基于NodeJS技术结合服务端画布canvas对于特殊字体文本的绘制便捷性实现Web端的动态文本渲染技术，降低了客户端本地存储字体文件导致的性能消耗，同时返回base64格式图片；

使用二分查找算法处理文本换行、标点符号不出现首行以及英文单词不拆分等问题。

特殊文本的展示很可能是动态内容，也就是Web端页面并不会预先知道要展示的文字内容，因为这些内容可能是通过网络接口获取的，这样一来，就无法只针对固定的文字内容进行切图或者只加载某一个文本范围的字体文件，因此很难做到对静态资源的有效控制。

此技术方案将特殊字体文件放在服务器端，一定程度上降低了前端加载这些文件的性能消耗，同时最终返回的为图片的base64格式，也避免了静态资源文件过多或应用包体积过大而造成的问题。

图2是根据本发明第二实施例的文本渲染方法的主要流程的示意图，所述文本渲染方法可以包括：

步骤S201，接收文本渲染请求，启动NodeJS服务，以创建post请求接口，获取所述文本渲染请求中的文本数据和图片数据。

步骤S202，安装node-canvas插件，调用createCanvas方法基于所述的图片数据创建canvas画布对象。

步骤S203，下载所有字体文件。

步骤S204，获取所述文本数据中的字体属性，确定所述字体属性为自定义，则通过canvas.registerFont方法引入并命名自定义字体，进而利用context.fontFamily方法设定字体的大小和特殊格式。

步骤S205，调用fillText方法，向canvas画布对象中写入所述文本数据。

步骤S206，根据预设的识别模型，对加载后的所述画布对象进行文本查找，以确定折行点。

步骤S207，获取所述文本数据中的文本起始x坐标、文本起始y坐标和文本行高，计算得到所述折行点换行后的位置信息(x，y+文本行高)，进而对所述折行点执行换行操作。

步骤S208，通过canvas.toDataURL方法将加载后的画布对象输出为预设格式的图片文件，进而输出至客户端以使用图片标签元素加载。

可以看出，本发明为Web前端应用提供一个基于NodeJS服务的通用型网络接口，实现简单且方便的展示特殊字体的效果，并在一定程度上能尽量降低服务端以及客户端的性能消耗，使用户体验更佳。

图3是根据本发明第三实施例的文本渲染方法的主要流程的示意图，所述文本渲染方法可以包括：

接收文本渲染请求，创建并启动NodeJS服务。然后，同时创建一个接收多个参数的post方法，其中该post方法为post接口封装后的一个对外方法。安装下载所有字体文件，其中包括所有特殊字体文件。以及安装node-canvas模块，即node-canvas插件，调用createCanvas方法基于所述的图片数据创建canvas画布对象。

通过post方法传递参数text(文本内容)、fontSize(字体大小)、color(字体颜色)、x(文本起始x坐标)、y(文本起始y坐标)、lineHeight(文本行高)、fontFamily(字体格式)等等数据，然后判断是否全部参数的数据都存在，若是则直接调用fillText方法向canvas画布对象中写入所述文本数据，以及通过canvas.registerFont方法引入并命名自定义字体，进而利用context.fontFamily方法设定字体的大小和特殊格式。若否则获取默认参数数据填充至相应参数，然后再用fillText方法向canvas画布对象中写入所述文本数据，以及通过canvas.registerFont方法引入并命名自定义字体，进而利用context.fontFamily方法设定字体的大小和特殊格式。

根据二分查找算法对加载后的所述画布对象进行文本折行问题的处理，具体地包括处理标点字符不出现首行的情况，则可以采用正则表达式匹配折行点的后一个字符是否为标点符号，若是则将折行点向前移动一个字符再进行换行，若不是则进行正常的折行操作。以及处理英文单词不拆分的情况，则可以采用正则表达式匹配得到折行点向前的第一个空格，获取折行点与第一个空格之间的字符数量n，之后将折行点向前移动n个位置，再进行换行。

之后，进行换行处理，具体地：获取所述文本数据中的文本起始x坐标、文本起始y坐标和文本行高，计算得到所述折行点换行后的位置信息(x，y+文本行高)，进而对所述折行点执行换行操作。

使用canvas.toDataURL()方法将加载后的文本画布输出为base64格式的图片文件，并作为结果返回至客户端，客户端直接使用image标签元素加载。

图4是根据本发明实施例的文本渲染装置的主要模块的示意图，如图4所示，所述文本渲染装置400包括获取模块401接收文本渲染请求，启动NodeJS服务，以创建post请求接口，获取所述文本渲染请求中的文本数据和图片数据；处理模块402根据所述图片数据，创建画布对象，下载所有字体文件，以将所述文本数据加载至所述画布对象，生成预设格式的图片文件并输出。

在一些实施例中，处理模块402根据所述图片数据，创建画布对象，包括：

安装node-canvas插件，调用createCanvas方法基于所述的图片数据创建canvas画布对象。

在一些实施例中，处理模块402将所述文本数据加载至所述画布对象，包括：

调用fillText方法，向canvas画布对象中写入所述文本数据。

在一些实施例中，处理模块402将所述文本数据加载至所述画布对象之前，包括：

获取所述文本数据中的字体属性，确定所述字体属性为自定义，则通过canvas.registerFont方法引入并命名自定义字体，进而利用context.fontFamily方法设定字体的大小和特殊格式。

在一些实施例中，处理模块402生成预设格式的图片文件之前，包括：

根据预设的识别模型，对加载后的所述画布对象进行文本查找，以确定折行点；

获取所述文本数据中的文本起始x坐标、文本起始y坐标和文本行高，计算得到所述折行点换行后的位置信息(x，y+文本行高)，进而对所述折行点执行换行操作。

在一些实施例中，处理模块402根据预设的识别模型，对加载后的所述画布对象进行文本查找，以确定折行点，包括：

根据二分查找算法对加载后的所述画布对象进行文本查找，以确定折行点；

利用正则表达式匹配得到折行点的后一个字符为标点符号，则将折行点向前移动一个字符；以及利用正则表达式匹配得到折行点向前的第一个空格，获取折行点与第一个空格之间的字符数量，以基于所述字符数量将折行点向前移动。

在一些实施例中，生处理模块402成预设格式的图片文件并输出，包括：

通过canvas.toDataURL方法将加载后的画布对象输出为预设格式的图片文件，进而输出至客户端以使用图片标签元素加载。

需要说明的是，在本发明所述文本渲染方法和所述文本渲染装置在具体实施内容上具有相应关系，故重复内容不再说明。

图5示出了可以应用本发明实施例的文本渲染方法或文本渲染装置的示例性系统架构500。

如图5所示，系统架构500可以包括终端设备501、502、503，网络504和服务器505。网络504用以在终端设备501、502、503和服务器505之间提供通信链路的介质。网络504可以包括各种连接类型，例如有线、无线通信链路或者光纤电缆等等。

用户可以使用终端设备501、502、503通过网络504与服务器505交互，以接收或发送消息等。终端设备501、502、503上可以安装有各种通讯客户端应用。

终端设备501、502、503可以是具有文本渲染屏并且支持网页浏览的各种电子设备，包括但不限于智能手机、平板电脑、膝上型便携计算机和台式计算机等等。

服务器505可以是提供各种服务的服务器，例如对用户利用终端设备501、502、503提供支持的后台管理服务器(仅为示例)。后台管理服务器可以对接收到的产品信息查询请求等数据进行分析等处理，并将处理结果(例如目标推送信息、产品信息--仅为示例)反馈给终端设备。

需要说明的是，本发明实施例所提供的文本渲染方法一般由服务器505执行，相应地，计算装置一般设置于服务器505中。

应该理解，图5中的终端设备、网络和服务器的数目仅仅是示意性的。根据实现需要，可以具有任意数目的终端设备、网络和服务器。

下面参考图6，其示出了适于用来实现本发明实施例的终端设备的计算机系统600的结构示意图。图6示出的终端设备仅仅是一个示例，不应对本发明实施例的功能和使用范围带来任何限制。

如图6所示，计算机系统600包括中央处理单元(CPU)601，其可以根据存储在只读存储器(ROM)602中的程序或者从存储部分608加载到随机访问存储器(RAM)603中的程序而执行各种适当的动作和处理。在RAM603中，还存储有计算机系统600操作所需的各种程序和数据。CPU601、ROM602以及RAM603通过总线604彼此相连。输入/输出(I/O)接口605也连接至总线604。

以下部件连接至I/O接口605：包括键盘、鼠标等的输入部分605；包括诸如阴极射线管(CRT)、液晶文本渲染器(LCD)等以及扬声器等的输出部分606；包括硬盘等的存储部分608；以及包括诸如LAN卡、调制解调器等的网络接口卡的通信部分609。通信部分609经由诸如因特网的网络执行通信处理。驱动器610也根据需要连接至I/O接口605。可拆卸介质611，诸如磁盘、光盘、磁光盘、半导体存储器等等，根据需要安装在驱动器610上，以便于从其上读出的计算机程序根据需要被安装入存储部分608。

特别地，根据本发明公开的实施例，上文参考流程图描述的过程可以被实现为计算机软件程序。例如，本发明公开的实施例包括一种计算机程序产品，其包括承载在计算机可读介质上的计算机程序，该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中，该计算机程序可以通过通信部分609从网络上被下载和安装，和/或从可拆卸介质611被安装。在该计算机程序被中央处理单元(CPU)601执行时，执行本发明的系统中限定的上述功能。

需要说明的是，本发明所示的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本发明中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本发明中，计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于：无线、电线、光缆、RF等等，或者上述的任意合适的组合。

附图中的流程图和框图，图示了按照本发明各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分，上述模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个接连地表示的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图或流程图中的每个方框、以及框图或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。

描述于本发明实施例中所涉及到的模块可以通过软件的方式实现，也可以通过硬件的方式来实现。所描述的模块也可以设置在处理器中，例如，可以描述为：一种处理器包括获取模块和处理模块。其中，这些模块的名称在某种情况下并不构成对该模块本身的限定。

作为另一方面，本发明还提供了一种计算机可读介质，该计算机可读介质可以是上述实施例中描述的设备中所包含的；也可以是单独存在，而未装配入该设备中。上述计算机可读介质承载有一个或者多个程序，当上述一个或者多个程序被一个该设备执行时，使得该设备包括接收文本渲染请求，启动NodeJS服务，以创建post请求接口，获取所述文本渲染请求中的文本数据和图片数据；根据所述图片数据，创建画布对象，下载所有字体文件，以将所述文本数据加载至所述画布对象，生成预设格式的图片文件并输出。

根据本发明实施例的技术方案，能够解决现有文本渲染效率低、用户体验差的问题。

上述具体实施方式，并不构成对本发明保护范围的限制。本领域技术人员应该明白的是，取决于设计要求和其他因素，可以发生各种各样的修改、组合、子组合和替代。任何在本发明的精神和原则之内所作的修改、等同替换和改进等，均应包含在本发明保护范围之内。

Claims (10)

1.一种文本渲染方法，其特征在于，包括：

接收文本渲染请求，启动NodeJS服务，以创建post请求接口，获取所述文本渲染请求中的文本数据和图片数据；

根据所述图片数据，创建画布对象，下载所有字体文件，以将所述文本数据加载至所述画布对象，生成预设格式的图片文件并输出。

2.根据权利要求1所述的方法，其特征在于，根据所述图片数据，创建画布对象，包括：

安装node-canvas插件，调用createCanvas方法基于所述的图片数据创建canvas画布对象。

3.根据权利要求2所述的方法，其特征在于，将所述文本数据加载至所述画布对象，包括：

调用fillText方法，向canvas画布对象中写入所述文本数据。

4.根据权利要求1所述的方法，其特征在于，将所述文本数据加载至所述画布对象之前，包括：

获取所述文本数据中的字体属性，确定所述字体属性为自定义，则通过canvas.registerFont方法引入并命名自定义字体，进而利用contex t.fontFamily方法设定字体的大小和特殊格式。

5.根据权利要求1所述的方法，其特征在于，生成预设格式的图片文件之前，包括：

根据预设的识别模型，对加载后的所述画布对象进行文本查找，以确定折行点；

获取所述文本数据中的文本起始x坐标、文本起始y坐标和文本行高，计算得到所述折行点换行后的位置信息(x，y+文本行高)，进而对所述折行点执行换行操作。

6.根据权利要求5所述的方法，其特征在于，根据预设的识别模型，对加载后的所述画布对象进行文本查找，以确定折行点，包括：

根据二分查找算法对加载后的所述画布对象进行文本查找，以确定折行点；

利用正则表达式匹配得到折行点的后一个字符为标点符号，则将折行点向前移动一个字符；以及利用正则表达式匹配得到折行点向前的第一个空格，获取折行点与第一个空格之间的字符数量，以基于所述字符数量将折行点向前移动。

7.根据权利要求1-6所述的方法，其特征在于，生成预设格式的图片文件并输出，包括：

通过canvas.toDataURL方法将加载后的画布对象输出为预设格式的图片文件，进而输出至客户端以使用图片标签元素加载。

8.一种文本渲染装置，其特征在于，包括：

获取模块，用于接收文本渲染请求，启动NodeJS服务，以创建pos t请求接口，获取所述文本渲染请求中的文本数据和图片数据；

处理模块，用于根据所述图片数据，创建画布对象，下载所有字体文件，以将所述文本数据加载至所述画布对象，生成预设格式的图片文件并输出。

9.一种电子设备，其特征在于，包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序，

当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现如权利要求1-7中任一所述的方法。

10.一种计算机可读介质，其上存储有计算机程序，其特征在于，所述程序被处理器执行时实现如权利要求1-7中任一所述的方法。

Images