CN113641932A - 一种基于h5的页面更新方法及*** - Google Patents
一种基于h5的页面更新方法及*** Download PDFInfo
- Publication number
- CN113641932A CN113641932A CN202110698491.1A CN202110698491A CN113641932A CN 113641932 A CN113641932 A CN 113641932A CN 202110698491 A CN202110698491 A CN 202110698491A CN 113641932 A CN113641932 A CN 113641932A
- Authority
- CN
- China
- Prior art keywords
- file
- static
- web server
- dynamic
- server
- 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
Links
- 238000000034 method Methods 0.000 title claims abstract description 16
- 230000003068 static effect Effects 0.000 claims abstract description 53
- 238000004590 computer program Methods 0.000 claims description 6
- 230000009286 beneficial effect Effects 0.000 description 1
- 239000003086 colorant Substances 0.000 description 1
- 238000010586 diagram Methods 0.000 description 1
- 230000008846 dynamic interplay Effects 0.000 description 1
- 230000000694 effects Effects 0.000 description 1
- 238000000926 separation method Methods 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/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
-
- 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
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 Transfer Between Computers (AREA)
Abstract
本发明提供的一种基于H5的页面更新方法及***，通过后台生成包含有相同标识信息的动态文件和静态文件，并将所述动态文件设置于web服务器上，将所述静态文件设置于oss云服务器上；用户端从所述web服务器获取动态文件，并根据获取的动态文件中的标识信息从所述oss云服务器获取相应的静态文件；用户端根据获取的动态文件和静态文件进行页面更新，解决了版本更新后用户不能马上更新到最新版本的问题，提高用户体验。
Description
技术领域
本发明涉及计算机技术领域，特别涉及一种基于H5的页面更新方法及***。
背景技术
HTML是目前网络上应用最为广泛的语言，也是构成网页文档的主要语言。HTML只不过是组合成一个文本文件的一系列标签，编写HTML代码就是在编辑纯文本文件，但HTML是一种规范，需要通过添加特定的标记符，组成的描述性文本，可以说明文字、图形、动画、声音、表格、链接等，告诉浏览器如何显示网页，即确定内容的格式。HTML的结构包括头部、主体两大部分，其中头部描述浏览器所需的信息，而主体则包含所要说明的具体内容。浏览器按顺序阅读HTML文件，然后根据内容周围的HTML标记符解释和显示各种内容，展现出丰富多彩的页面。其中html可以认为是页面的框架，包括元素及元素的属性定义，css是层叠样式，是可以重写页面的样式改变元素形状、颜色、表现形式等，javascript是解释形的脚本语言，可以处理页面上各种动态交互。Html+css+javascript组合就构成了一个个页面。
动静分离是将网站静态资源(HTML，JavaScript，CSS，img等文件)与后台应用分开部署，提高用户访问静态代码的速度，降低对后台应用访问。动静分离的通用做法是将静态资源部署在静态缓存服务器上(nginx或cdn)，后台项目部署到应用服务器上，根据一定规则静态资源的请求全部请求静态缓存服务器，达到动静分离的目标。但是该方案将html文件、javascrip(js文件)、css文件都放在静态缓存服务器上，因此静态缓存服务器上就存储了页面的所有元素html+css+javascript，所以整个页面都被静态缓存起来，因为缓存有一定的过期时间，所以在更新版本后缓存未过期的时间内用户只能看到静态缓存服务器上的页面(html+css+javascript)，该页面并不是最新更新上去的页面，所以用户看到的是旧版本的页面用户会延迟看到最新版本的页面。待静态服务器上缓存过期后重新拉取最新页面(html+css+javascript),用户才能看到最新版本的页面。。
因此，为了解决服务器更新后，用户不能第一时间看到最新版本页面的问题，需要一种基于H5的页面更新方法及***，能够解决版本更新后用户不能马上更新到最新版本的问题，提高用户体验。
发明内容
(一)要解决的技术问题
为了解决现有技术的上述问题，本发明提供一种基于H5的页面更新方法，能够解决版本更新后用户不能马上更新到最新版本的问题，提高用户体验。
(二)技术方案
为了达到上述目的，本发明采用的一种技术方案为：
一种基于H5的页面更新方法，包括步骤：
S1、后台生成包含有相同标识信息的动态文件和静态文件，并将所述动态文件设置于web服务器上，将所述静态文件设置于oss云服务器上；
S2、用户端从所述web服务器获取动态文件，并根据获取的动态文件中的标识信息从所述oss云服务器获取相应的静态文件；
S3、用户端根据获取的动态文件和静态文件进行页面更新。
为了达到上述目的，本发明采用的另一种技术方案为：
一种基于H5的页面更新***，包括后台和用户端，所述后台包括第一存储器、第一处理器及存储在第一存储器上并可在第一处理器上运行的第一计算机程序，所述用户端包括第二存储器、第二处理器及存储在第二存储器上并可在第二处理器上运行的第二计算机程序，所述第一处理器执行所述程序时实现以下步骤：
S1、生成包含有相同标识信息的动态文件和静态文件，并将所述动态文件设置于web服务器上，将所述静态文件设置于oss云服务器上；
所述第二处理器执行所述程序时实现以下步骤：
S2、从所述web服务器获取动态文件，并根据获取的动态文件中的标识信息从所述oss云服务器获取相应的静态文件；
S3、根据获取的动态文件和静态文件进行页面更新。
(三)有益效果
本发明的有益效果在于：通过后台生成包含有相同标识信息的动态文件和静态文件，并将所述动态文件设置于web服务器上，将所述静态文件设置于oss云服务器上；用户端从所述web服务器获取动态文件，并根据获取的动态文件中的标识信息从所述oss云服务器获取相应的静态文件；用户端根据获取的动态文件和静态文件进行页面更新，解决了版本更新后用户不能马上更新到最新版本的问题，提高用户体验。
附图说明
图1为本发明实施例的基于H5的页面更新方法流程图；
图2为本发明实施例的基于H5的页面更新***的整体结构示意图。
【附图标记说明】
1：基于H5的页面更新***；
2：后台；
3：用户端；
4、第一存储器；
5、第一处理器；
6、第二存储器；
7、第二处理器。
具体实施方式
为了更好的解释本发明，以便于理解，下面结合附图，通过具体实施方式，对本发明作详细描述。
请参照图1，一种基于H5的页面更新方法，包括步骤：
S1、后台生成包含有相同标识信息的动态文件和静态文件，并将所述动态文件设置于web服务器上，将所述静态文件设置于oss云服务器上；
S2、用户端从所述web服务器获取动态文件，并根据获取的动态文件中的标识信息从所述oss云服务器获取相应的静态文件；
所述步骤S2包括：
S21、用户端发送第一请求至所述web服务器，以使得所述web服务器返回动态文件。
所述步骤S2还包括：
S22、用户端根据接收到的动态文件中的标识信息发送第二请求至所述web服务器，以使得所述web服务器根据接收到的第二请求解析cdn域名，得到相应的cdn服务器，并发送相应的指令信息至所述cdn服务器；
S23、用户端接收所述cdn服务器根据指令信息从所述oss云服务器抓取的静态文件。
S3、用户端根据获取的动态文件和静态文件进行页面更新。
所述动态文件为html文件，所述静态文件为css文件和js文件。
实施例二
本实施例和实施例一的区别在于，本实施例将结合具体的应用场景，进一步说明本发明上述基于H5的页面更新方法是如何实现的：
1、后台生成包含有相同版本的html文件、css文件和js文件，并将所述html文件设置于web服务器上，将所述css文件和js文件设置于oss云服务器上；
具体地，所述web服务器上包含最新版本的html文件，oss云服务器上包含各个版本的css文件和js文件，即包括历史版本和最新版本。
2.1、用户端发送第一请求至所述web服务器，以使得所述web服务器返回html。
2.2、用户端根据接收到的html文件中的标识信息发送第二请求至所述web服务器，以使得所述web服务器根据接收到的第二请求解析cdn域名，得到相应的cdn服务器，并发送相应的指令信息至所述cdn服务器；
2.3、用户端接收所述cdn服务器根据指令信息从所述oss云服务器抓取的css文件和js文件。
3、用户端根据获取的html文件、css文件和js文件进行页面更新。
如后台生成版本n的html文件、css文件和js文件，并将所述版本n的html文件设置于web服务器上，将所述版本n的css文件和js文件设置于oss云服务器上；
用户请求访问web服务器上的html文件；
用户端浏览器从web服务器下载版本n的html文件；
由于版本n的html文件引用了版本n的css文件和js文件，因此，浏览器将请求web服务器下载版本n的css文件和js文件；
web服务器通过解析cdn域名，得到相应的cdn服务器，并发送相应的指令信息至所述cdn服务器；
用户端接收所述cdn服务器根据指令信息从所述oss云服务器抓取的版本n的css文件和js文件；
最后用户端浏览器将呈现由版本n的html文件、css文件和js文件构建的页面。
实施例三
请参照图2，一种基于H5的页面更新***1，包括后台2和用户端3，所述后台2包括第一存储器4、第一处理器5及存储在第一存储器4上并可在第一处理器5上运行的第一计算机程序，所述用户端3包括第二存储器6、第二处理器7及存储在第二存储器6上并可在第二处理器7上运行的第二计算机程序，所述第一处理器5执行所述程序时实现以下步骤：
S1、生成包含有相同标识信息的动态文件和静态文件，并将所述动态文件设置于web服务器上，将所述静态文件设置于oss云服务器上；
所述第二处理器7执行所述程序时实现以下步骤：
S2、从所述web服务器获取动态文件，并根据获取的动态文件中的标识信息从所述oss云服务器获取相应的静态文件；
所述步骤S2包括：
S21、发送第一请求至所述web服务器，以使得所述web服务器返回动态文件。
所述步骤S2还包括：
S22、根据接收到的动态文件中的标识信息发送第二请求至所述web服务器，以使得所述web服务器根据接收到的第二请求解析cdn域名，得到相应的cdn服务器，并发送相应的指令信息至所述cdn服务器；
S23、接收所述cdn服务器根据指令信息从所述oss云服务器抓取的静态文件。
S3、根据获取的动态文件和静态文件进行页面更新
所述动态文件为html文件，所述静态文件为css文件和js文件。
以上所述仅为本发明的实施例，并非因此限制本发明的专利范围，凡是利用本发明说明书及附图内容所作的等同变换，或直接或间接运用在相关的技术领域，均同理包括在本发明的专利保护范围内。
Claims (8)
1.一种基于H5的页面更新方法，其特征在于，包括步骤：
S1、后台生成包含有相同标识信息的动态文件和静态文件，并将所述动态文件设置于web服务器上，将所述静态文件设置于oss云服务器上；
S2、用户端从所述web服务器获取动态文件，并根据获取的动态文件中的标识信息从所述oss云服务器获取相应的静态文件；
S3、用户端根据获取的动态文件和静态文件进行页面更新。
2.根据权利要求1所述的基于H5的页面更新方法，其特征在于，所述步骤S2包括：
S21、用户端发送第一请求至所述web服务器，以使得所述web服务器返回动态文件。
3.根据权利要求2所述的基于H5的页面更新方法，其特征在于，所述步骤S2还包括：
S22、用户端根据接收到的动态文件中的标识信息发送第二请求至所述web服务器，以使得所述web服务器根据接收到的第二请求解析cdn域名，得到相应的cdn服务器，并发送相应的指令信息至所述cdn服务器；
S23、用户端接收所述cdn服务器根据指令信息从所述oss云服务器抓取的静态文件。
4.根据权利要求1所述的基于H5的页面更新方法，其特征在于，所述动态文件为html文件，所述静态文件为css文件和js文件。
5.一种基于H5的页面更新***，包括后台和用户端，所述后台包括第一存储器、第一处理器及存储在第一存储器上并可在第一处理器上运行的第一计算机程序，所述用户端包括第二存储器、第二处理器及存储在第二存储器上并可在第二处理器上运行的第二计算机程序，其特征在于，所述第一处理器执行所述程序时实现以下步骤：
S1、生成包含有相同标识信息的动态文件和静态文件，并将所述动态文件设置于web服务器上，将所述静态文件设置于oss云服务器上；
所述第二处理器执行所述程序时实现以下步骤：
S2、从所述web服务器获取动态文件，并根据获取的动态文件中的标识信息从所述oss云服务器获取相应的静态文件；
S3、根据获取的动态文件和静态文件进行页面更新。
6.根据权利要求1所述的基于H5的页面更新***，其特征在于，所述步骤S2包括：
S21、发送第一请求至所述web服务器，以使得所述web服务器返回动态文件。
7.根据权利要求6所述的基于H5的页面更新***，其特征在于，所述步骤S2还包括：
S22、根据接收到的动态文件中的标识信息发送第二请求至所述web服务器，以使得所述web服务器根据接收到的第二请求解析cdn域名，得到相应的cdn服务器，并发送相应的指令信息至所述cdn服务器；
S23、接收所述cdn服务器根据指令信息从所述oss云服务器抓取的静态文件。
8.根据权利要求1所述的基于H5的页面更新***，其特征在于，所述动态文件为html文件，所述静态文件为css文件和js文件。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202110698491.1A CN113641932A (zh) | 2021-06-23 | 2021-06-23 | 一种基于h5的页面更新方法及*** |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202110698491.1A CN113641932A (zh) | 2021-06-23 | 2021-06-23 | 一种基于h5的页面更新方法及*** |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN113641932A true CN113641932A (zh) | 2021-11-12 |
Family
ID=78416130
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202110698491.1A Pending CN113641932A (zh) | 2021-06-23 | 2021-06-23 | 一种基于h5的页面更新方法及*** |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN113641932A (zh) |
Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| JP2004310206A (ja) * | 2003-04-02 | 2004-11-04 | Yasuo Nishizawa | 構造化ｈｔｍｌ生成システムと動的静的ページ統一管理システム |
| CN108416029A (zh) * | 2018-03-09 | 2018-08-17 | 深圳市富途网络科技有限公司 | 一种静态资源更新方法及*** |
| CN111310084A (zh) * | 2018-12-12 | 2020-06-19 | 北京嘀嘀无限科技发展有限公司 | 页面加载方法、装置、***、用户终端及可读存储介质 |
| CN111475180A (zh) * | 2019-01-24 | 2020-07-31 | 北京京东尚科信息技术有限公司 | 更新客户端缓存的方法和*** |
| CN112015485A (zh) * | 2020-08-14 | 2020-12-01 | 北京达佳互联信息技术有限公司 | 页面展示方法、装置、电子设备及存储介质 |
-
2021
- 2021-06-23 CN CN202110698491.1A patent/CN113641932A/zh active Pending
Patent Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| JP2004310206A (ja) * | 2003-04-02 | 2004-11-04 | Yasuo Nishizawa | 構造化ｈｔｍｌ生成システムと動的静的ページ統一管理システム |
| CN108416029A (zh) * | 2018-03-09 | 2018-08-17 | 深圳市富途网络科技有限公司 | 一种静态资源更新方法及*** |
| CN111310084A (zh) * | 2018-12-12 | 2020-06-19 | 北京嘀嘀无限科技发展有限公司 | 页面加载方法、装置、***、用户终端及可读存储介质 |
| CN111475180A (zh) * | 2019-01-24 | 2020-07-31 | 北京京东尚科信息技术有限公司 | 更新客户端缓存的方法和*** |
| CN112015485A (zh) * | 2020-08-14 | 2020-12-01 | 北京达佳互联信息技术有限公司 | 页面展示方法、装置、电子设备及存储介质 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US7921353B1 (en) | Method and system for providing client-server injection framework using asynchronous JavaScript and XML | |
| CN100462964C (zh) | 一种网页数据的更新显示方法 | |
| US7865544B2 (en) | Method and system for providing XML-based asynchronous and interactive feeds for web applications | |
| US10185704B2 (en) | Webpage browsing method, webapp framework, method and device for executing javascript and mobile terminal | |
| US5946697A (en) | Rapid transfer of HTML files | |
| US9641591B1 (en) | Modifying web content at a client | |
| CN105095280B (zh) | 一种浏览器缓存方法和装置 | |
| US8516155B1 (en) | Dynamic content conversion | |
| US9077681B2 (en) | Page loading optimization using page-maintained cache | |
| CA2729272C (en) | Embedding macros in web pages with advertisements | |
| TWI322950B (zh) | ||
| US7523158B1 (en) | System and method for partial page updates using a proxy element | |
| US20100223322A1 (en) | Server based framework for improving ajax performance | |
| US20090112824A1 (en) | Method and apparatus for generating presentation configuration file of document content | |
| CN110647699A (zh) | Web页面的渲染方法、装置、计算机设备和存储介质 | |
| US7228493B2 (en) | Serving content to a client | |
| CN104077310B (zh) | 加载资源文件的方法、设备和*** | |
| WO2016131311A1 (zh) | 一种浏览器兼容方法及浏览器 | |
| CN109933349A (zh) | 一种基于vue spa及时更新的方法、***及设备 | |
| CN112637361B (zh) | 一种页面代理方法、装置、电子设备及存储介质 | |
| WO2017096475A1 (en) | System and method for transforming online content to obfuscate an inclusion of supplemental content | |
| US20040205488A1 (en) | Active web page for editing with any browser | |
| CN106372130A (zh) | 一种静态资源管理方法 | |
| CN112799663A (zh) | 页面显示方法、装置、计算机可读存储介质及电子设备 | |
| US7703015B2 (en) | Delta-handling in server-pages |
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 | ||
| RJ01 | Rejection of invention patent application after publication | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20211112 |