页面渲染方法和系统.pdf

(19)中华人民共和国国家知识产权局(12)发明专利申请(10)申请公布号CN110321510A(43)申请公布日2019.10.11(21)申请号201910386404.1(22)申请日2019.05.09(71)申请人苏州乐米信息科技股份有限公司地址215000江苏省苏州市高新区科灵路78号苏高新软件园12栋601(72)发明人郁于润(74)专利代理机构苏州国诚专利代理有限公司32293代理人王丽(51)Int.Cl.G06F16/958(2019.01)权利要求书1页说明书5页附图2页(54)发明名称页面渲染方法和系统(57)摘要本发明涉及一种页面渲染方法及系统。其中方法包括以下步骤：获取待渲染页面的页面参数；将页面参数与预设入口文件相关联；在预设入口文件中查找与页面参数对应的渲染数据；基于渲染数据对待渲染页面进行渲染，生成目标页面。上述页面渲染方法可以让浏览器边下载javascript文件的同时渲染html页面，而不需要像传统方式那样等到所有javascript文件下载并执行完成之后才去渲染页面。同时SSR对服务器的压力也是相对较大的，和服务器简单输出静态文件相比，通过node去渲染出页面再传递给客户端显然开销是比较大的，需要注意准备好相应的服务器负载。与传统相比更快的首屏渲染速度，减少了页面等待时间。同时可以更好的有利于SEO，便于页面抓取。CN110321510ACN110321510A权利要求书1/1页1.一种页面渲染方法，其特征在于，包括以下步骤：获取待渲染页面的页面参数；将页面参数与预设入口文件相关联；在预设入口文件中查找与页面参数对应的渲染数据；基于渲染数据对待渲染页面进行渲染，生成目标页面。2.根据权利要求1所述的页面渲染方法，其特征在于，所述获取待渲染页面的页面参数的步骤包括：读取待渲染页面；对所述待渲染页面的各地址参数进行配置，并对所述待渲染页面的页面参数进行配置；将所述待渲染页面与各所述地址参数进行关联。3.根据权利要求1所述的页面渲染方法，其特征在于，所述将将页面参数与预设入口文件相关联的步骤包括：通过Webpack工具将所述页面参数和所述预设入口文件进行关联，得到数据包；将所述数据包输入至所述待渲染页面。4.根据权利要求3所述的页面渲染方法，其特征在于，所述通过Webpack工具将所述页面参数和所述预设入口文件进行关联，得到数据包的步骤中，所述通过Webpack工具分别对服务端打包配置及客户端打包配置。5.根据权利要求1所述的页面渲染方法，其特征在于，所述预设入口文件包括客户端入口文件、服务端入口文件。6.一种页面渲染系统，其特征在于，包括：参数获取模块，用以获取待渲染页面的页面参数；参数关联模块，用以将页面参数与预设入口文件相关联；数据查找模块，用以在预设入口文件中查找与页面参数对应的渲染数据；页面渲染模块，基于渲染数据对待渲染页面进行渲染，生成目标页面。7.根据权利要求6所述的页面渲染方法，其特征在于，参数获取模块包括：读取单元，用以读取待渲染页面；配置单元，用以对所述待渲染页面的各地址参数进行配置，并对所述待渲染页面的页面参数进行配置；关联单元，用以将所述待渲染页面与各所述地址参数进行关联。8.根据权利要求6所述的页面渲染方法，其特征在于，所述参数关联模块包括：Webpack打包单元，用以通过Webpack工具将所述页面参数和所述预设入口文件进行关联，得到数据包；数据包输入单元，用以将所述数据包输入至所述待渲染页面。9.根据权利要求8所述的页面渲染方法，其特征在于，Webpack打包单元分别对服务端打包配置及客户端打包配置。10.根据权利要求6所述的页面渲染方法，其特征在于，所述预设入口文件包括客户端入口文件、服务端入口文件。2CN110321510A说明书1/5页页面渲染方法和系统技术领域[0001]本发明涉及计算机信息领域，特别是涉及一种页面渲染方法及系统。背景技术[0002]SSR是ServerSideRender的缩写，即服务器端渲染。在没有SPA之前，绝大多数的网页都是通过服务器渲染生成的：用户向服务器发送请求，服务器获取请求，然后再查询数据库，根据查询的数据动态的生成一张网页，最后将网页内容返回给浏览器端。[0003]目前，SPA(singlepagewebapplication，单页Web应用)技术可以为用户提供更好的浏览体验，但是SPA技术只有一个Web页面，其余页面均通过JS(JavaScript，文件扩展)控制加载。另外，SEO(SearchEngineOptimization，搜索引擎优化)可以使网站更适合搜索引擎的索引原则，但是因为SPA的上述结构使得不利于SEO对页面进行抓取。为了便于SEO对页面的抓取，需要将所有的页面全部渲染成静态页面。[0004]现有的渲