CN114048405A - 入口模板文件生成方法、装置、设备及存储介质 - Google Patents
入口模板文件生成方法、装置、设备及存储介质 Download PDFInfo
- Publication number
- CN114048405A CN114048405A CN202111249013.9A CN202111249013A CN114048405A CN 114048405 A CN114048405 A CN 114048405A CN 202111249013 A CN202111249013 A CN 202111249013A CN 114048405 A CN114048405 A CN 114048405A
- Authority
- CN
- China
- Prior art keywords
- file
- entry
- identification information
- configuration information
- format
- 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.)
- Granted
Links
- 238000000034 method Methods 0.000 title claims abstract description 33
- 238000009877 rendering Methods 0.000 claims description 21
- 238000004590 computer program Methods 0.000 claims description 7
- 230000008859 change Effects 0.000 claims description 3
- 230000006870 function Effects 0.000 description 4
- 230000003287 optical effect Effects 0.000 description 4
- 238000010586 diagram Methods 0.000 description 3
- 238000005516 engineering process Methods 0.000 description 3
- 230000009286 beneficial effect Effects 0.000 description 2
- 238000004891 communication Methods 0.000 description 2
- 230000003068 static effect Effects 0.000 description 2
- 238000013459 approach Methods 0.000 description 1
- 238000011161 development Methods 0.000 description 1
- 238000000802 evaporation-induced self-assembly Methods 0.000 description 1
- 230000008676 import Effects 0.000 description 1
- 238000009434 installation Methods 0.000 description 1
- 230000008569 process Effects 0.000 description 1
- 238000012545 processing Methods 0.000 description 1
- 230000007723 transport mechanism Effects 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
- G06F16/9574—Browsing optimisation, e.g. caching or content distillation of access to content, e.g. by caching
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
- G06F16/986—Document structures and storage, e.g. HTML extensions
Landscapes
- Engineering & Computer Science (AREA)
- Databases & Information Systems (AREA)
- Theoretical Computer Science (AREA)
- Data Mining & Analysis (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Information Retrieval, Db Structures And Fs Structures Therefor (AREA)
Abstract
本发明公开了一种入口模板文件生成方法,并公开了具有入口模板文件生成方法的装置、终端及存储介质,其中入口模板文件生成方法通过修改入口文件的格式,将配置文件的标识信息置入到入口文件中,能够保证在可定制入口文件的同时,解决了浏览器缓存的问题。
Description
技术领域
本发明涉及计算机技术领域,特别涉及一种入口模板文件生成方法、装置、设备及存储设备。
背景技术
为了让网站在搜索引擎中具有较好的排名,服务端渲染(SSR,Server SideRender)是一种比较常用的技术。
React框架是一种用于实现服务端渲染的,具有强大组件功能的框架,经常被使用在页面开发当中。
在基于React框架的应用中,为了避免浏览器缓存出现问题,通常需要让渲染文件携带标识信息。
现有技术通常通过HtmlWebpackPlugin来实现标识信息的引入。但是这种方法无法进行定制入口文件。
发明内容
本发明旨在至少解决现有技术中存在的技术问题之一。为此,本发明提出一种入口模板文件生成方法,用于提供一种在react框架中,既可以定制入口文件的内容,还可以引入动态的标识信息配置方法。
本发明还提出一种具有上述入口模板文件生成方法的装置、电子设备及存储介质。
根据本发明的第一方面实施例的入口模板文件生成方法,包括步骤:
修改入口文件的文件格式;
在修改后的所述入口文件中置入配置信息,所述配置信息包括与渲染文件相对应的标识信息;
将所述标识信息插入修改后的所述入口文件中,得到入口模板文件。
根据本发明实施例的入口模板文件生成方法,至少具有如下有益效果:利用在入口文件中置入含有标识信息的配置文件的方式,实现了在可定制入口文件的框架中集成标识信息的方法,解决了浏览器缓存的问题。
根据本发明的一些实施例,所述渲染文件为js文件和css文件。
根据本发明的一些实施例,修改入口文件的文件格式,包括:
将所述入口文件的格式由HTML修改为tsx。
根据本发明的一些实施例,所述配置信息以json文件的形式进行存储。
根据本发明的一些实施例,所述将所述标识信息插入修改后的所述入口文件中,得到入口模板文件,包括:
根据所述配置信息生成数组,所述数组存储有渲染文件的标识信息;
将存储所述标识信息的数组循环写入渲染文件的引入位置中。
根据本发明的一些实施例,所述配置信息为由webpack生成的文件。
根据本发明的一些实施例,所述标识信息,包括:哈希值。
根据本发明的第二方面实施例的入口模板文件生成装置,包括:
格式更改模块,用于修改入口文件的文件格式;
配置文件生成模块,用于在修改后的所述入口文件中置入配置信息,所述配置信息包括与渲染文件相对应的标识信息;
标识信息读取模块,用于将所述标识信息插入修改后的所述入口文件中,得到入口模板文件。
根据本发明实施例的入口模板文件生成装置,至少具有如下有益效果:用于利用配置文件生成模块在入口文件中置入含有标识信息的配置文件,从而实现在入口文件为tsx格式的项目中,增加标识信息,解决浏览器缓存问题的需求。
根据本发明的一些实施例,所述标识信息读取模块,还包括:
渲染文件分析元件,用于根据所述配置信息生成数组,所述数组存储有渲染文件的标识信息;
循环写入元件,用于将所述存储标识信息的数组循环写入入口文件中渲染文件的引入位置中。
根据本申请第三方面实施例的电子设备,所述终端包括存储器、处理器及存储在该存储器上并可在该处理器上运行的计算机程序,所述处理器执行所述计算机程序以实现上述入口模板文件生成方法。
根据本申请第四方面实施例的计算机可读存储介质,所述存储介质存储有计算机可执行指令,所述计算机可执行指令用于执行上述入口模板文件生成方法。
本发明的附加方面和优点将在下面的描述中部分给出,部分将从下面的描述中变得明显,或通过本发明的实践了解到。
附图说明
本发明的上述和/或附加的方面和优点从结合下面附图对实施例的描述中将变得明显和容易理解,其中:
图1为本发明实施例的入口模板文件生成方法的总体步骤示意图;
图2为本发明实施例的入口模板文件生成方法的详细步骤示意图;
图3为根据本发明实施例提供了一种入口模板文件生成装置的框图结构示意图。
具体实施方式
下面详细描述本发明的实施例,所述实施例的示例在附图中示出,其中自始至终相同或类似的标号表示相同或类似的元件或具有相同或类似功能的元件。下面通过参考附图描述的实施例是示例性的,仅用于解释本发明,而不能理解为对本发明的限制。
本发明的描述中,除非另有明确的限定,设置、安装、连接等词语应做广义理解,所属技术领域技术人员可以结合技术方案的具体内容合理确定上述词语在本发明中的具体含义。
参照图1,图2,本申请的实施例提供了一种入口模板文件生成方法,包括以下步骤。
步骤S100、修改入口文件的文件格式。
通过webpack打包项目的时候都会有一个入口文件,根据业务需求来说,为了实现可定制入口文件的组合方式,需要将默认的HTML格式的入口文件改为tsx格式。其中,tsx文件为react框架中支持的一种文件格式,该格式的文件用于实现定制化入口。
步骤S200、在修改后的所述入口文件中置入配置信息。
其中,所述配置信息包括与渲染文件相对应的标识信息。
在构建服务端代码之前,需要读取webpack生成的manifest.json文件,将其写入入口文件当中。manifest.json文件存储了js和css文件对应的标识信息,将不同网页对应的js和css文件的标识信息以文件的形式进行存储,可以解决浏览器的缓存问题。
可以理解到的是,本实施例的目标是解决js文件和css文件对应的标识信息不显示导致的浏览器缓存问题,在本实施例中,由于导致浏览器缓存问题的通常都是哈希值,所以标识信息通常指哈希值。但不代表标识信息只能是哈希值,被替换成任何其他具有标记作用的信息,例如批注、URL地址等,都是不脱离本申请宗旨的。
步骤S300、将所述标识信息插入修改后的所述入口文件中,得到入口模板文件。
具体的,步骤300可以包括以下步骤:
步骤S301、根据所述配置信息生成数组,所述数组存储有渲染文件的标识信息。
在入口文件中导入webpack生成的manifest.json文件。方便后续的读取过程。
在入口文件中读取导入的manifest.json文件并生成一个数组,这个数组包含js文件和css文件对应的hash键值对。
步骤S302、将存储所述标识信息的数组循环写入入口文件中渲染文件的引入位置中。
将读取的数组循环写入js文件和css文件引入的位置。webpack构建后会生成一个HTML文件,HTML文件需要引入页面所需要的js文件和css文件,将存储有标识信息的数组写入tsx文件中,js文件和css文件所对应的位置。
根据本申请的第二方面,提供了一种入口模板文件生成装置,该装置20包括:
格式更改模块201,用于修改入口文件的文件格式;
配置文件生成模块202,用于在修改后的所述入口文件中置入配置信息,所述配置信息包括与渲染文件相对应的标识信息;
标识信息读取模块203,用于将所述标识信息插入修改后的所述入口文件中,得到入口模板文件。
本申请实施例通过修改入口文件的格式,并通过配置文件的形式将js文件和css文件的标识信息置入到页面中,用于保证在可定制入口文件的同时,还用于解决浏览器缓存的问题。
进一步地,所述标识信息读取模块203,还包括:
渲染文件分析元件,用于根据所述配置信息生成数组,所述数组存储有渲染文件的标识信息;
循环写入元件,用于将所述存储标识信息的数组循环写入入口文件中渲染文件的引入位置中。
本申请又一实施例提供了一种终端,包括:存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序,该处理器执行计算机程序时以实现上述入口模板文件生成方法。
具体地,处理器可以是CPU,通用处理器,DSP,ASIC,FPGA或者其他可编程逻辑器件、晶体管逻辑器件、硬件部件或者其任意组合。其可以实现或执行结合本申请公开内容所描述的各种示例性的逻辑方框,模块和电路。处理器也可以是实现计算功能的组合,例如包含一个或多个微处理器组合,DSP和微处理器的组合等。
具体地,处理器通过总线与存储器连接,总线可包括一通路,以用于传送信息。总线可以是PCI总线或EISA总线等。总线可以分为地址总线、数据总线、控制总线等。
存储器可以是ROM或可存储静态信息和指令的其他类型的静态存储设备,RAM或者可存储信息和指令的其他类型的动态存储设备,也可以是EEPROM、CD-ROM或其他光盘存储、光碟存储(包括压缩光碟、激光碟、光碟、数字通用光碟、蓝光光碟等)、磁盘存储介质或者其他磁存储设备、或者能够用于携带或存储具有指令或数据结构形式的期望的程序代码并能够由计算机存取的任何其他介质,但不限于此。
可选的,存储器用于存储执行本申请方案的计算机程序的代码,并由处理器来控制执行。处理器用于执行存储器中存储的应用程序代码,以实现图2所示实施例提供的入口模板文件生成装置的动作。
本申请实施例通过将入口文件设置为可定制的tsx格式,并通过配置文件的形式将js和css文件的标识信息置入到页面中,用于保证在可定制入口文件的同时,还能够解决浏览器缓存的问题。
本申请又一实施例提供了一种计算机可读存储介质,存储有计算机可执行指令,该计算机可执行指令用于执行上述图1所示的入口模板文件生成方法。
以上所描述的装置实施例仅是示意性的,其中作为分离部件说明的单元可以是或者也可以不是物理上分开的,即可以位于一个地方,或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部模块来实现本实施例方案的目的。
本领域普通技术人员可以理解,上文中所公开方法中的全部或某些步骤、系统可以被实施为软件、固件、硬件及其适当的组合。某些物理组件或所有物理组件可以被实施为由处理器,如中央处理器、数字信号处理器或微处理器执行的软件,或者被实施为硬件,或者被实施为集成电路,如专用集成电路。这样的软件可以分布在计算机可读介质上,计算机可读介质可以包括计算机存储介质(或非暂时性介质)和通信介质(或暂时性介质)。如本领域普通技术人员公知的,术语计算机存储介质包括在用于存储信息(诸如计算机可读指令、数据结构、程序模块或其他数据)的任何方法或技术中实施的易失性和非易失性、可移除和不可移除介质。计算机存储介质包括但不限于RAM、ROM、EEPROM、闪存或其他存储器技术、CD-ROM、数字多功能盘(DVD)或其他光盘存储、磁盒、磁带、磁盘存储或其他磁存储装置、或者可以用于存储期望的信息并且可以被计算机访问的任何其他的介质。此外,本领域普通技术人员公知的是,通信介质通常包含计算机可读指令、数据结构、程序模块或者诸如载波或其他传输机制之类的调制数据信号中的其他数据,并且可包括任何信息递送介质。
以上是对本申请的较佳实施进行了具体说明,但本申请并不局限于上述实施方式,熟悉本领域的技术人员在不违背本申请精神的前提下还可做出种种的等同变形或替换,这些等同的变形或替换均包含在本申请权利要求所限定的范围内。
Claims (10)
1.一种入口模板文件生成方法,其特征在于,所述方法包括:
修改入口文件的文件格式;
在修改后的所述入口文件中置入配置信息,所述配置信息包括与渲染文件相对应的标识信息;
将所述标识信息插入修改后的所述入口文件中,得到入口模板文件。
2.根据权利要求1所述的方法,其特征在于,所述渲染文件为js文件和css文件。
3.根据权利要求1所述的方法,其特征在于,修改入口文件的文件格式,包括:
将所述入口文件的格式由HTML修改为tsx。
4.根据权利要求1所述的方法,其特征在于,所述配置信息以json文件的形式进行存储。
5.根据权利要求1所述的方法,其特征在于,所述将所述标识信息插入修改后的所述入口文件中,得到入口模板文件,包括:
根据所述配置信息生成数组,所述数组存储有渲染文件的标识信息;
将存储所述标识信息的数组循环写入渲染文件的引入位置中。
6.根据权利要求1所述的方法,其特征在于,
所述配置信息为由webpack生成的文件。
7.根据权利要求1所述的方法,其特征在于,
所述标识信息,包括:哈希值。
8.一种入口模板文件生成装置,其特征在于,包括:
格式更改模块,用于修改入口文件的文件格式;
配置文件生成模块,用于在修改后的所述入口文件中置入配置信息,所述配置信息包括与渲染文件相对应的标识信息;
标识信息读取模块,用于将所述标识信息插入修改后的所述入口文件中,得到入口模板文件。
9.一种电子设备,包括:存储器、处理器及存储在该存储器上并可在该处理器上运行的计算机程序,其特征在于,所述处理器执行所述计算机程序以实现权利要1至7中任一项所述的方法。
10.一种计算机可读存储介质,存储有计算机可执行指令,所述计算机可执行指令用于执行权利要求1至7中任一项所述的方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202111249013.9A CN114048405B (zh) | 2021-10-26 | 2021-10-26 | 入口模板文件生成方法、装置、设备及存储介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202111249013.9A CN114048405B (zh) | 2021-10-26 | 2021-10-26 | 入口模板文件生成方法、装置、设备及存储介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN114048405A true CN114048405A (zh) | 2022-02-15 |
CN114048405B CN114048405B (zh) | 2024-04-09 |
Family
ID=80205870
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202111249013.9A Active CN114048405B (zh) | 2021-10-26 | 2021-10-26 | 入口模板文件生成方法、装置、设备及存储介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN114048405B (zh) |
Citations (12)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN106209925A (zh) * | 2015-04-29 | 2016-12-07 | 阿里巴巴集团控股有限公司 | 页面加载方法、客户端及系统 |
CN108304169A (zh) * | 2017-01-11 | 2018-07-20 | 阿里巴巴集团控股有限公司 | 针对html5应用的实现方法、装置和设备 |
CN110221824A (zh) * | 2019-06-03 | 2019-09-10 | 精硕科技(北京)股份有限公司 | 组件的生成方法和装置 |
CN110347378A (zh) * | 2019-07-12 | 2019-10-18 | 北京明略软件系统有限公司 | 项目开发环境的搭建方法及装置 |
CN110569467A (zh) * | 2019-08-27 | 2019-12-13 | 上海易点时空网络有限公司 | 用于客户端应用程序的离线访问方法以及装置 |
CN110647320A (zh) * | 2019-08-14 | 2020-01-03 | 平安普惠企业管理有限公司 | 项目框架的构建方法、装置、计算机设备和存储介质 |
CN111857709A (zh) * | 2020-06-12 | 2020-10-30 | 北京三快在线科技有限公司 | React组件和Flutter组件的映射方法、装置、电子设备及存储介质 |
CN112558980A (zh) * | 2020-12-15 | 2021-03-26 | 建信金融科技有限责任公司 | 多软件包管理方法及装置 |
US20210263779A1 (en) * | 2018-11-08 | 2021-08-26 | Intel Corporation | Function as a service (faas) system enhancements |
CN113408260A (zh) * | 2021-07-12 | 2021-09-17 | 网易(杭州)网络有限公司 | 一种项目工程生成方法、装置、计算机设备及存储介质 |
CN113448928A (zh) * | 2021-07-09 | 2021-09-28 | 网易(杭州)网络有限公司 | 文件清理方法、装置、处理器及电子装置 |
CN113486267A (zh) * | 2021-07-27 | 2021-10-08 | 平安国际智慧城市科技股份有限公司 | 应用入口页面的解析方法、装置、设备及存储介质 |
-
2021
- 2021-10-26 CN CN202111249013.9A patent/CN114048405B/zh active Active
Patent Citations (12)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN106209925A (zh) * | 2015-04-29 | 2016-12-07 | 阿里巴巴集团控股有限公司 | 页面加载方法、客户端及系统 |
CN108304169A (zh) * | 2017-01-11 | 2018-07-20 | 阿里巴巴集团控股有限公司 | 针对html5应用的实现方法、装置和设备 |
US20210263779A1 (en) * | 2018-11-08 | 2021-08-26 | Intel Corporation | Function as a service (faas) system enhancements |
CN110221824A (zh) * | 2019-06-03 | 2019-09-10 | 精硕科技(北京)股份有限公司 | 组件的生成方法和装置 |
CN110347378A (zh) * | 2019-07-12 | 2019-10-18 | 北京明略软件系统有限公司 | 项目开发环境的搭建方法及装置 |
CN110647320A (zh) * | 2019-08-14 | 2020-01-03 | 平安普惠企业管理有限公司 | 项目框架的构建方法、装置、计算机设备和存储介质 |
CN110569467A (zh) * | 2019-08-27 | 2019-12-13 | 上海易点时空网络有限公司 | 用于客户端应用程序的离线访问方法以及装置 |
CN111857709A (zh) * | 2020-06-12 | 2020-10-30 | 北京三快在线科技有限公司 | React组件和Flutter组件的映射方法、装置、电子设备及存储介质 |
CN112558980A (zh) * | 2020-12-15 | 2021-03-26 | 建信金融科技有限责任公司 | 多软件包管理方法及装置 |
CN113448928A (zh) * | 2021-07-09 | 2021-09-28 | 网易(杭州)网络有限公司 | 文件清理方法、装置、处理器及电子装置 |
CN113408260A (zh) * | 2021-07-12 | 2021-09-17 | 网易(杭州)网络有限公司 | 一种项目工程生成方法、装置、计算机设备及存储介质 |
CN113486267A (zh) * | 2021-07-27 | 2021-10-08 | 平安国际智慧城市科技股份有限公司 | 应用入口页面的解析方法、装置、设备及存储介质 |
Non-Patent Citations (2)
Title |
---|
李孟辉: "基于Web的云开发平台的研究与实现", 《中国优秀硕士学位论文全文数据库 信息科技辑》, 15 February 2018 (2018-02-15), pages 139 - 225 * |
顾慧慧: "面向智能客服的多人交互式WebAR系统的设计与实现", 《中国优秀硕士学位论文全文数据库 信息科技辑》, 15 May 2021 (2021-05-15), pages 138 - 381 * |
Also Published As
Publication number | Publication date |
---|---|
CN114048405B (zh) | 2024-04-09 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
US8689099B1 (en) | Cross-domain communication | |
CN104881318A (zh) | 一种接口调用方法、装置及终端 | |
CN104268229A (zh) | 一种基于多进程浏览器的资源获得方法及装置 | |
CN103593406A (zh) | 一种静态资源标识处理方法及装置 | |
CN108885544B (zh) | 前端页面国际化处理方法、应用服务器及计算机可读存储介质 | |
CN106874173B (zh) | 页面模板的测试方法和装置 | |
CN113641873B (zh) | 数据处理方法、装置、电子设备及可读存储介质 | |
CN109558548B (zh) | 一种消除css样式冗余的方法及相关产品 | |
CN114048405B (zh) | 入口模板文件生成方法、装置、设备及存储介质 | |
CN109324838B (zh) | 单片机程序的执行方法、执行装置及终端 | |
CN111382179A (zh) | 数据处理方法、装置及电子设备 | |
CN109558549B (zh) | 一种消除css样式冗余的方法及相关产品 | |
CN114254229A (zh) | 网页渲染方法及装置 | |
CN110929188A (zh) | 服务端页面渲染方法及装置 | |
US20170364496A1 (en) | Visualization interface for information object system | |
CN107239270B (zh) | 代码处理方法和装置 | |
CN111475748B (zh) | 图片的展示方法及装置 | |
CN113377376A (zh) | 数据包生成方法、数据包生成装置、电子设备及存储介质 | |
US9146720B1 (en) | Binary file application processing | |
US10798464B1 (en) | Streaming delivery of client-executable code | |
CN113297827B (zh) | 一种呈现内容信息的方法与设备 | |
CN117668925B (zh) | 一种文件指纹生成方法、装置、电子设备及存储介质 | |
CN111427868B (zh) | 数据库迁移中操作请求的处理方法、装置和电子设备 | |
CN113326456B (zh) | 网页资源获取方法、装置、设备、系统及存储介质 | |
CN107608947A (zh) | Html文件处理方法及装置、电子设备 |
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 | ||
TA01 | Transfer of patent application right | ||
TA01 | Transfer of patent application right |
Effective date of registration: 20230803 Address after: Room 404-405, 504, Building B-17-1, Big data Industrial Park, Kecheng Street, Yannan High tech Zone, Yancheng, Jiangsu Province, 224000 Applicant after: Yancheng Tianyanchawei Technology Co.,Ltd. Address before: 224000 room 501-503, building b-17-1, Xuehai road big data Industrial Park, Kecheng street, Yannan high tech Zone, Yancheng City, Jiangsu Province Applicant before: Yancheng Jindi Technology Co.,Ltd. |
|
GR01 | Patent grant | ||
GR01 | Patent grant |