CN113778543B - 一种应用于插件的页面内容更新方法和装置 - Google Patents
一种应用于插件的页面内容更新方法和装置 Download PDFInfo
- Publication number
- CN113778543B CN113778543B CN202010916508.1A CN202010916508A CN113778543B CN 113778543 B CN113778543 B CN 113778543B CN 202010916508 A CN202010916508 A CN 202010916508A CN 113778543 B CN113778543 B CN 113778543B
- Authority
- CN
- China
- Prior art keywords
- plug
- page
- resource
- script
- resource content
- 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.)
- Active
Links
- 238000000034 method Methods 0.000 title claims abstract description 52
- 238000013515 script Methods 0.000 claims abstract description 116
- 238000009434 installation Methods 0.000 claims abstract description 34
- 230000006870 function Effects 0.000 claims description 26
- 230000003068 static effect Effects 0.000 claims description 19
- 230000008859 change Effects 0.000 claims description 10
- 238000009877 rendering Methods 0.000 claims description 10
- 238000004590 computer program Methods 0.000 claims description 9
- 238000004806 packaging method and process Methods 0.000 claims description 6
- 230000004044 response Effects 0.000 claims description 6
- 230000009191 jumping Effects 0.000 claims description 5
- VYZAMTAEIAYCRO-UHFFFAOYSA-N Chromium Chemical compound [Cr] VYZAMTAEIAYCRO-UHFFFAOYSA-N 0.000 description 14
- 238000010586 diagram Methods 0.000 description 12
- 238000004891 communication Methods 0.000 description 7
- 230000003287 optical effect Effects 0.000 description 4
- 230000008569 process Effects 0.000 description 4
- 238000012986 modification Methods 0.000 description 3
- 230000004048 modification Effects 0.000 description 3
- 230000008447 perception Effects 0.000 description 3
- 238000012545 processing Methods 0.000 description 3
- 239000004606 Fillers/Extenders Substances 0.000 description 2
- 238000005516 engineering process Methods 0.000 description 2
- 239000000835 fiber Substances 0.000 description 2
- 230000000644 propagated effect Effects 0.000 description 2
- 239000004065 semiconductor Substances 0.000 description 2
- 238000000926 separation method Methods 0.000 description 2
- 230000009286 beneficial effect Effects 0.000 description 1
- 238000010276 construction Methods 0.000 description 1
- 230000001419 dependent effect Effects 0.000 description 1
- 238000013461 design Methods 0.000 description 1
- 238000011161 development Methods 0.000 description 1
- 230000000694 effects Effects 0.000 description 1
- 239000004973 liquid crystal related substance Substances 0.000 description 1
- 239000013307 optical fiber Substances 0.000 description 1
- 238000012856 packing Methods 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
- 238000012546 transfer Methods 0.000 description 1
- 230000001960 triggered effect Effects 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/445—Program loading or initiating
- G06F9/44521—Dynamic linking or loading; Link editing at or after load time, e.g. Java class loading
- G06F9/44526—Plug-ins; Add-ons
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/60—Software deployment
- G06F8/65—Updates
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- Computer Security & Cryptography (AREA)
- Stored Programmes (AREA)
- Information Transfer Between Computers (AREA)
Abstract
本发明公开了一种应用于插件的页面内容更新方法和装置，涉及计算机技术领域。该方法的一具体实施方式包括：响应于对插件的点击操作，触发与所述插件对应的属性脚本，以打开所述插件的主页面；通过所述插件的主入口脚本，获取所述主页面网址中的访问路径，以从与所述插件对应的资源站点中，加载与所述访问路径对应的资源内容；将资源内容添加至页面脚本的文档主体中，以通过所述文档主体将资源内容渲染至所述主页面，完成主页面资源内容更新。该实施方式仅在首次安装时依赖于用户的安装操作，后续对于插件中资源内容的更新与获取，无需用户操作，解决了现有无法控制用户主动安装的问题，实现用户无感知更新即可体验插件新功能的目的。
Description
技术领域
本发明涉及计算机技术领域，尤其涉及一种应用于插件的页面内容更新方法和装置。
背景技术
目前浏览器插件依赖于用户的自主安装。以谷歌浏览器chrome插件为例，可以通过两种方式进行：
1)将插件源代码(包括所有的资源内容和页面)打包为crx文件并发送给用户，用户通过访问chrome地址chrome://extensions，将crx文件拖拽到浏览器的安装页面即可完成安装；
2)直接将包含源代码的文件发送给用户，用户同样需访问chrome地址chrome://extensions，点击“加载已解压的扩展程序”，选择源代码文件完成安装。
在实现本发明的过程中，发明人发现现有技术在更新插件时至少存在如下问题：
1)需开发者重新打包源代码为crx文件或者直接将源代码文件发送给用户，耗时耗力能效低；
2)无法做到主动更新，只能被动依赖用户的自主安装，易出现放弃安装新版本的情况，导致其无法使用和体验插件更新后的新功能，使得插件推广能力受限。
发明内容
有鉴于此，本发明实施例提供一种应用于插件的页面内容更新方法和装置，至少能够解决现有技术中开发者操作繁琐以及被动依赖用户自主更新的现象。
为实现上述目的，根据本发明实施例的一个方面，提供了一种应用于插件的页面内容更新方法，包括：
响应于对插件的点击操作，触发与所述插件对应的属性脚本，以打开所述插件的主页面；
通过所述插件的主入口脚本，获取所述主页面网址中的访问路径，以从与所述插件对应的资源站点中，加载与所述访问路径对应的资源内容；
将资源内容添加至页面脚本的文档主体中，以通过所述文档主体将资源内容渲染至所述主页面，完成主页面资源内容更新。
可选的，所述通过所述插件的主入口脚本，获取所述主页面网址中的访问路径，以从与所述插件对应的资源站点中，加载与所述访问路径对应的资源内容，包括：
通过所述插件的主入口脚本，获取所述主页面的网址中的第一哈希值，判断所述第一哈希值是否为空；
若不为空，则去除所述第一哈希值中的特定字符，得到剩余字符，否则设置为第一默认字符；其中，剩余字符或第一默认字符表示访问路径；
确定与所述插件对应资源站点的第一访问地址，拼接所述第一访问地址和剩余字符/第一默认字符，得到第二访问地址，以从所述资源站点中获取与所述第二访问地址对应的资源内容。
可选的，主页面和子页面共用一个页面脚本；
在所述完成主页面资源内容更新之后，还包括：
响应于对所述主页面中一功能的点击操作，从所述主页面跳转至与所述功能对应的子页面中；
通过所述插件的主入口脚本，获取所述子页面的网址中的第二哈希值，判断所述第二哈希值是否为空；
若不为空，则去除所述第二哈希值中的特定字符，得到剩余字符，否则设置为第二默认字符；
拼接所述第一访问地址和剩余字符/第二默认字符，得到第三访问地址，以从所述资源站点中获取与所述第三访问地址对应的资源内容；
将资源内容添加至页面脚本的所述文档主体中，以通过所述文档主体将资源内容渲染至所述子页面，完成子页面资源内容更新。
可选的，在所述响应于对插件图标的点击操作之前，还包括：
从服务端下载所述插件的安装包并安装，在安装完成后，生成插件图标；其中，安装包通过将源代码应用打包为特定类型的文件得到，源代码应用包括属性脚本、主入口脚本和页面脚本。
可选的，所述源代码应用还包括基础配置文件，所述基础配置文件包括安全策略，所述安全策略配置有所述主页面可以跨站点访问的站点。
可选的，资源内容包括资源文件、层叠样式表访问地址和编程语言访问地址，所述安全策略中配置有与所述层叠样式表访问地址对应的站点和与所述编程语言访问地址对应的站点；
所述将资源内容添加至页面脚本的文档主体中，包括：
从与所述层叠样式表访问地址对应的页面中，加载层叠样式表脚本；
从与所述编程语言访问地址对应的页面中，加载编程语言脚本；
将所述资源文件、所述层叠样式表脚本和所述编程语言脚本，添加至页面脚本的所述文档主体中。
可选的，还包括：服务端接收对所述插件的静态资源应用的创建操作、以及对所述静态资源应用中资源内容的存储操作，并在存储完毕后，将资源内容上传至与所述插件对应的资源站点中；以及
接收对资源内容的更改操作，在更改完毕后，将更改后的资源内容上传至与所述插件对应的资源站点中。
为实现上述目的，根据本发明实施例的另一方面，提供了一种应用于插件的页面内容更新装置，包括：
触发模块，用于响应于对插件的点击操作，触发与所述插件对应的属性脚本，以打开所述插件的主页面；
加载模块，用于通过所述插件的主入口脚本，获取所述主页面网址中的访问路径，以从与所述插件对应的资源站点中，加载与所述访问路径对应的资源内容；
主页面渲染模块，用于将资源内容添加至页面脚本的文档主体中，以通过所述文档主体将资源内容渲染至所述主页面，完成主页面资源内容更新。
可选的，所述加载模块，用于：通过所述插件的主入口脚本，获取所述主页面的网址中的第一哈希值，判断所述第一哈希值是否为空；
若不为空，则去除所述第一哈希值中的特定字符，得到剩余字符，否则设置为第一默认字符；其中，剩余字符或第一默认字符表示访问路径；
确定与所述插件对应资源站点的第一访问地址，拼接所述第一访问地址和剩余字符/第一默认字符，得到第二访问地址，以从所述资源站点中获取与所述第二访问地址对应的资源内容。
可选的，主页面和子页面共用一个页面脚本；
还包括子页面渲染模块，用于：响应于对所述主页面中一功能的点击操作，从所述主页面跳转至与所述功能对应的子页面中；
通过所述插件的主入口脚本，获取所述子页面的网址中的第二哈希值，判断所述第二哈希值是否为空；
若不为空，则去除所述第二哈希值中的特定字符，得到剩余字符，否则设置为第二默认字符；
拼接所述第一访问地址和剩余字符/第二默认字符，得到第三访问地址，以从所述资源站点中获取与所述第三访问地址对应的资源内容；
将资源内容添加至页面脚本的所述文档主体中，以通过所述文档主体将资源内容渲染至所述子页面，完成子页面资源内容更新。
可选的，还包括首次安装模块，用于：从服务端下载所述插件的安装包并安装，在安装完成后，生成插件图标；其中，安装包通过将源代码应用打包为特定类型的文件得到，源代码应用包括属性脚本、主入口脚本和页面脚本。
可选的，所述源代码应用还包括基础配置文件，所述基础配置文件包括安全策略，所述安全策略配置有所述主页面可以跨站点访问的站点。
可选的，资源内容包括资源文件、层叠样式表访问地址和编程语言访问地址，所述安全策略中配置有与所述层叠样式表访问地址对应的站点和与所述编程语言访问地址对应的站点；
所述主页面渲染模块，用于：从与所述层叠样式表访问地址对应的页面中，加载层叠样式表脚本；
从与所述编程语言访问地址对应的页面中，加载编程语言脚本；
将所述资源文件、所述层叠样式表脚本和所述编程语言脚本，添加至页面脚本的所述文档主体中。
可选的，还包括服务端的资源内容上传模块，用于：
服务端接收对所述插件的静态资源应用的创建操作、以及对所述静态资源应用中资源内容的存储操作，并在存储完毕后，将资源内容上传至与所述插件对应的资源站点中；以及
接收对资源内容的更改操作，在更改完毕后，将更改后的资源内容上传至与所述插件对应的资源站点中。
为实现上述目的，根据本发明实施例的再一方面，提供了一种应用于插件的页面内容更新电子设备。
本发明实施例的电子设备包括：一个或多个处理器；存储装置，用于存储一个或多个程序，当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现上述任一所述的应用于插件的页面内容更新方法。
为实现上述目的，根据本发明实施例的再一方面，提供了一种计算机可读介质，其上存储有计算机程序，所述程序被处理器执行时实现上述任一所述的应用于插件的页面内容更新方法。
根据本发明所述提供的方案，上述发明中的一个实施例具有如下优点或有益效果：摒弃现有将资源内容和插件源代码一起打包在安装包里的思想，仅将源代码发送至客户端进行安装，而资源内容发布至资源站点中，实现两者分离，后续插件需实时获取远程资源站点下最新的资源内容对页面进行渲染，以此达到用户无感知即可体验新升级插件的目的。
上述的非惯用的可选方式所具有的进一步效果将在下文中结合具体实施方式加以说明。
附图说明
附图用于更好地理解本发明，不构成对本发明的不当限定。其中：
图1是根据本发明实施例的一种应用于插件的页面内容更新方法的主要流程示意图；
图2是根据本发明实施例的一种可选的应用于插件的页面内容更新方法的流程示意图；
图3是根据本发明实施例的另一种可选的应用于插件的页面内容更新方法的流程示意图；
图4是根据本发明实施例的开发者处理插件的方法的流程示意图；
图5是根据本发明实施例的又一种可选的应用于插件的页面内容更新方法的流程示意图；
图6是根据本发明实施例的一种应用于插件的页面内容更新装置的主要模块示意图；
图7是本发明实施例可以浏览器于其中的示例性***架构图；
图8是适于用来实现本发明实施例的移动设备或服务器的计算机***的结构示意图。
具体实施方式
以下结合附图对本发明的示范性实施例做出说明，其中包括本发明实施例的各种细节以助于理解，应当将它们认为仅仅是示范性的。因此，本领域普通技术人员应当认识到，可以对这里描述的实施例做出各种改变和修改，而不会背离本发明的范围和精神。同样，为了清楚和简明，以下的描述中省略了对公知功能和结构的描述。
需要说明的是，插件技术会因浏览器的不同而存有细微差异，如配置项、语法等，但核心技术思想都是相同的。本发明仅适用于PC端浏览器中插件的页面内容更新，并以谷歌浏览器chrome插件为例进行说明。
站点可视为一个网址的首页，如页面A的站点为www.xx.com、页面B的站点为www.xxxxx.com。本发明中由于站点需配置在插件的安全策略中，因此仅考虑由域名组成的站点，不考虑IP地址形式的站点。
参见图1，示出的是本发明实施例提供的一种应用于插件的页面内容更新方法的主要流程图，包括如下步骤：
S101：响应于对插件的点击操作，触发与所述插件对应的属性脚本，以打开所述插件的主页面；
S102：通过所述插件的主入口脚本，获取所述主页面网址中的访问路径，以从与所述插件对应的资源站点中，加载与所述访问路径对应的资源内容；
S103：将所述资源内容添加至页面脚本的文档主体中，以通过所述文档主体将所述资源内容渲染至所述主页面，完成主页面资源内容更新。
上述实施方式中，对于步骤S101，浏览器插件在安装成功后，通常以图标的形式显示在浏览器的边角位置，例如右上角、右下角。
点击插件图标即可触发事件，默认执行插件background.js脚本(即属性脚本)中的代码，以打开插件本地的index.html页面。此时index.html页面可以为空白页面，需要由后续步骤进行渲染。其中，background.js脚本用于为插件图标添加点击事件，当用户点击插件图标时，即可触发浏览器打开插件的主页面，其代码如下：
chrome.browserAction.onClicked.addListener(function(tab){
window.open(chrome.extension.getURL('index.html'))
})
对于步骤S102，本发明中插件的安装包与资源内容是分离进行存储的，用户下载的安装包仅为插件的基本代码，所需资源内容仍存储于插件的资源站点中，需要通过一定方式获取得到。获取方式为：
浏览器在打开index.html页面的同时，还会加载插件本地的index.js脚本。在加载完毕后会立即执行index.js脚本，获取当前主页面网址中的访问路径，具体获取方式参见后续图2所示描述。
资源站点中存储有与多个访问路径对应的资源内容，开发者在更新资源内容后，同样发布至资源站点中。因此，在确定主页面网址中的访问路径后，可以从资源站点中获取主页面的实时最新资源内容。
对于步骤S103，插件是安装到浏览器中的，在加载到主页面的资源内容后，需添加到插件本地index.html脚本的body节点(即文档主体)中，以将最新的资源内容展示给用户浏览；其中，body是html的一个标签，包含浏览器页面中所能看到的所有内容。
上述实施例所提供的方法，仅在首次安装时依赖于用户的安装操作，后续对于插件中资源内容的更新与获取，无需用户操作，解决了现有无法控制用户主动安装的问题，实现用户无感知更新即可体验插件新功能的目的。
参见图2，示出了根据本发明实施例的一种可选的应用于插件的页面内容更新方法流程示意图，包括如下步骤：
S201：响应于对插件的点击操作，触发与所述插件对应的属性脚本，以打开所述插件的主页面；
S202：通过所述插件的主入口脚本，获取所述主页面的网址中的第一哈希值，判断所述第一哈希值是否为空；
S203：若不为空，则去除所述第一哈希值中的特定字符，得到剩余字符，否则设置为第一默认字符；其中，剩余字符或第一默认字符表示访问路径；
S204：确定与所述插件对应资源站点的第一访问地址，拼接所述第一访问地址和剩余字符/第一默认字符，得到第二访问地址，以从所述资源站点中获取与所述第二访问地址对应的资源内容；
S205：将资源内容添加至页面脚本的文档主体中，以通过所述文档主体将资源内容渲染至所述主页面，完成主页面资源内容更新。
上述实施方式中，对于步骤S201和S205可参见图1所示步骤S101和S103的描述，在此不再赘述。
上述实施方式中，对于步骤S202～S203，index.js脚本获取主页面网址中的hash值，即url(uniform resource locator，统一资源定位符)中#号以及#号后面的内容；其中，“#号后面的内容”表示访问路径。
需要说明的是，hash值的获取方式为浏览器自带支持的功能。例如一个网址变量url：www.xxxxx.com#user，通过语法url.hash()得到的“#user”，即为该url的hash值。但若没有，则为第一默认字符(如0)，即默认向资源站点获取插件主页面的最新资源内容。
由于获取到的hash值是包含#号的，而传递的参数是#号后面的内容，因此在获取到插件主页面网址中的hash值之后，需要截取掉#号，将剩余字符作为访问路径。在hash值为空的情况下，可以将第一默认字符作为访问路径。
对于步骤S204，资源站点存储于网站中，通过将资源站点的第一访问地址和上述获取的访问路径进行拼接，可以直接得到对资源站点中某一资源内容的***，即第二访问地址。
通过jquery的ajax，加载与第二访问地址对应的页面，如https://xx.xx.com/static/resources/html/index.html，得到页面的html内容并返回给用户浏览。
上述实施例所提供的方法，通过index.js脚本获取插件主页面中的访问路径，经过与资源站点的访问地址拼接，可以直接得到加载资源站点中一资源内容的***，简单并高效。
参见图3，示出了根据本发明实施例的另一种可选的应用于插件的页面内容更新方法流程示意图，包括如下步骤：
S301：响应于对插件的点击操作，触发与所述插件对应的属性脚本，以打开所述插件的主页面；
S302：通过所述插件的主入口脚本，获取所述主页面的网址中的第一哈希值，判断所述第一哈希值是否为空；
S303：若不为空，则去除所述第一哈希值中的特定字符，得到剩余字符，否则设置为默认字符；其中，剩余字符或默认字符表示访问路径；
S304：确定与所述插件对应资源站点的第一访问地址，拼接所述第一访问地址和剩余字符/默认字符，得到第二访问地址，以从所述资源站点中获取与所述第二访问地址对应的资源内容；
S305：将资源内容添加至页面脚本的文档主体中，以通过所述文档主体将资源内容渲染至所述主页面，完成主页面资源内容更新；
S306：响应于对所述主页面中一功能的点击操作，从所述主页面跳转至与所述功能对应的子页面中；
S307：通过所述插件的主入口脚本，获取所述子页面的网址中的第二哈希值，判断所述第二哈希值是否为空；
S308：若不为空，则去除所述第二哈希值中的特定字符，得到剩余字符，否则设置为第二默认字符；
S309：拼接所述第一访问地址和剩余字符/第二默认字符，得到第三访问地址，以从所述资源站点中获取与所述第三访问地址对应的资源内容；
S310：将资源内容添加至页面脚本的所述文档主体中，以通过所述文档主体将资源内容渲染至所述子页面，完成子页面资源内容更新。
上述实施方式中，对于步骤S301和S305可参见图1所示步骤S101和S103的描述，步骤S302～S304可参见图2所示步骤S202～S204的描述，在此不再赘述。
上述实施方式中，对于步骤S306～S310，对于图2所示对主页面加载资源内容的方式，同样适用于对子页面资源内容的加载，只不过需建立在主页面加载完毕的基础上进行，但同样需访问资源站点。
资源站点中针对页面中每个功能设置一个存放路径，以进行区分存储。例如，页面中有xyz三个功能，用户点击x功能时，需要去资源站点查找与x功能对应的子页面的最新资源内容，yz同理。
上述实施例所提供的方法，对于插件中主页面的资源更新方式，同样适用于子页面中资源内容的加载，简单并高效。
参见图4，示出了根据本发明实施例的一种开发者开发插件的方法流程示意图，包括如下步骤：
S401：服务端接收对插件的静态资源应用的创建操作、以及对所述静态资源应用中资源内容的存储操作，并在存储完毕后，将资源内容上传至与所述插件对应的资源站点中；
S402：接收对资源内容的更改操作，在更改完毕后，将更改后的资源内容上传至与所述插件对应的资源站点中；
S403：接收对所述插件的源代码应用的创建操作，在创建完毕后，将源代码应用打包为特定类型的文件，得到安装包；其中，源代码应用包括属性脚本、主入口脚本和页面脚本；
S404：客户端从服务端下载所述插件的安装包并安装，在安装完成后，生成插件图标。
上述实施方式中，对于步骤S401～S404，本实施方式应用于开发者所处的服务端。开发者在服务端需要创建2个应用：插件源代码应用和插件静态资源应用：
1)插件静态资源应用：内部存放插件的资源内容，如html、js、css、img等，并在开发完毕后将资源内容发布到资源站点下；其中，静态资源包括插件的最新内容和数据。
首次创建时，开发者需将插件所需的资源内容存储至插件静态资源应用。对于非首次情况，仅对应于资源内容的更新操作，且更新时仅更新增量资源内容。
2)插件源代码应用：包括一个index.html脚本、一个index.js脚本和一个background.js脚本；其中，index.html对应于插件的主页面，如www.xx.com，index.js为组件的主入口脚本，background设置页面中所有的背景属性。
①index.html脚本代码如下：
②index.js脚本，用以访问资源站点下的资源数据，解析后返回到页面中供用户浏览。其代码如下：
③background.js脚本，用以为插件图标添加点击事件，当用户点击插件图标时，会在浏览器中打开插件的主页面。其代码如下：
chrome.browserAction.onClicked.addListener(function(tab){
window.open(chrome.extension.getURL('index.html'))
})
以上作为最基础的插件源代码，在创建完毕后，将插件源代码应用打包为crx文件并传输给客户端用于首次安装，且后续无需用户重复安装，因为仅更新资源内容。
通过上述步骤，用户通过插件所访问的所有资源内容，均是通过远程获取资源站点下发布的资源内容得到的。因此当开发者对插件有更新升级操作后，只需要将相关资源内容提交到插件静态资源应用，并发布到资源站点下，即可完成插件的更新，并且用户全程无感知，即可体验到升级后的新功能。
上述实施例所提供的方法，将插件安装源代码和静态资源分离存储，客户端中仅安装插件的基础代码，页面所需资源内容一直存储于资源站点中，以便开发者实时更新和客户端的实时获取，以此达到开发者对插件有更新时用户将无感知升级的目的。
参见图5，示出了根据本发明实施例的又一种可选的应用于插件的页面内容更新方法流程示意图，包括如下步骤：
S501：响应于对插件的点击操作，触发与所述插件对应的属性脚本，以打开所述插件的主页面；
S502：通过所述插件的主入口脚本，获取所述主页面网址中的访问路径，以从与所述插件对应的资源站点中，加载与所述访问路径对应的资源内容；其中，所述资源内容包括资源文件、层叠样式表访问地址和编程语言访问地址；
S503：从与所述层叠样式表访问地址对应的页面中，加载层叠样式表脚本；
S504：从与所述编程语言访问地址对应的页面中，加载编程语言脚本；
S505：将所述资源文件、所述层叠样式表脚本和所述编程语言脚本，添加至所述页面脚本的所述文档主体中，以通过所述文档主体将所述资源内容渲染至所述主页面，完成主页面资源内容更新。
上述实施方式中，对于步骤S501可参见图1所示步骤S101的描述，在此不再赘述。
上述实施方式中，对于步骤S502～S505，在加载资源内容并存储至body节点后，还需要加载这些资源内容所携带的远程文件。例如，资源内容中包含网址，即需要获取与该网址对应的远程文件。
资源内容除了包含资源文件外，还包含css(cascading style sheet s，层叠样式表)访问地址和编程语言(如js)访问地址，如：
<link href＝"https://xx.xx.com/static/resources/css/layui.css">
<script src＝"https://xx.xx.com/static/resources/layui.js"></script>
在加载资源内容后，chrome将立刻通过css访问地址加载css脚本，以及通过js访问地址加载js脚本。
另外，插件源代码应用中还设置有基础配置文件，在基础配置文件中还配置有安全策略，以设置主页面可以跨站点访问的站点。如chr ome插件manifest.json配置文件中的一个配置：
"content_security_policy":"script-src'self'https://xx.xx.com；object-src'self'"
content_security_policy(以下简称CSP)，是chrome扩展程序***为了一些安全方面(如跨站点脚本攻击)而遵循的安全策略，用以控制扩展程序能够跨站点加载哪些脚本和资源。
由于在客户端的插件源代码里配置了manifest.json文件的CSP策略，所以chrome允许执行跨站点的远程js脚本和css脚本获取。反之如果没有配置CSP策略，那么在通过jquery的ajax加载远程index.html并渲染后body节点下之后，浏览器将报错，不支持使用不安全的跨站点资源。
上述实施例所提供的方法，本方案借助浏览器插件天生支持跨站点访问的特点，只需要在插件的配置文件中配置需要跨站点访问的目标站点即可，以此解决跨站点问题，保证了资源内容的正常获取。
参见图6，示出了本发明实施例提供的一种应用于插件的页面内容更新装置600的主要模块示意图，包括：
触发模块601，用于响应于对插件的点击操作，触发与所述插件对应的属性脚本，以打开所述插件的主页面；
加载模块602，用于通过所述插件的主入口脚本，获取所述主页面网址中的访问路径，以从与所述插件对应的资源站点中，加载与所述访问路径对应的资源内容；
主页面渲染模块603，用于将资源内容添加至页面脚本的文档主体中，以通过所述文档主体将资源内容渲染至所述主页面，完成主页面资源内容更新。
本发明实施装置中，所述加载模块602，用于：
通过所述插件的主入口脚本，获取所述主页面的网址中的第一哈希值，判断所述第一哈希值是否为空；
若不为空，则去除所述第一哈希值中的特定字符，得到剩余字符，否则设置为第一默认字符；其中，剩余字符或第一默认字符表示访问路径；
确定与所述插件对应资源站点的第一访问地址，拼接所述第一访问地址和剩余字符/第一默认字符，得到第二访问地址，以从所述资源站点中获取与所述第二访问地址对应的资源内容。
本发明实施装置中，主页面和子页面共用一个页面脚本；
还包括子页面渲染模块604(图中未标出)，用于：
响应于对所述主页面中一功能的点击操作，从所述主页面跳转至与所述功能对应的子页面中；
通过所述插件的主入口脚本，获取所述子页面的网址中的第二哈希值，判断所述第二哈希值是否为空；
若不为空，则去除所述第二哈希值中的特定字符，得到剩余字符，否则设置为第二默认字符；
拼接所述第一访问地址和剩余字符/第二默认字符，得到第三访问地址，以从所述资源站点中获取与所述第三访问地址对应的资源内容；
将资源内容添加至页面脚本的所述文档主体中，以通过所述文档主体将资源内容渲染至所述子页面，完成子页面资源内容更新。
本发明实施装置还包括首次安装模块605(图中未标出)，用于：
从服务端下载所述插件的安装包并安装，在安装完成后，生成插件图标；其中，安装包通过将源代码应用打包为特定类型的文件得到，源代码应用包括属性脚本、主入口脚本和页面脚本。
本发明实施装置中，所述源代码应用还包括基础配置文件，所述基础配置文件包括安全策略，所述安全策略配置有所述主页面可以跨站点访问的站点。
本发明实施装置中，资源内容包括资源文件、层叠样式表访问地址和编程语言访问地址，所述安全策略中配置有与所述层叠样式表访问地址对应的站点和与所述编程语言访问地址对应的站点；
所述主页面渲染模块603，用于：从与所述层叠样式表访问地址对应的页面中，加载层叠样式表脚本；
从与所述编程语言访问地址对应的页面中，加载编程语言脚本；
将所述资源文件、所述层叠样式表脚本和所述编程语言脚本，添加至页面脚本的所述文档主体中。
本发明实施装置还包括服务端的资源内容上传模块606(图中未标出)，用于：
服务端接收对所述插件的静态资源应用的创建操作、以及对所述静态资源应用中资源内容的存储操作，并在存储完毕后，将资源内容上传至与所述插件对应的资源站点中；以及
接收对资源内容的更改操作，在更改完毕后，将更改后的资源内容上传至与所述插件对应的资源站点中。
另外，在本发明实施例中所述装置的具体实施内容，在上面所述方法中已经详细说明了，故在此重复内容不再说明。
图7示出了可以浏览器本发明实施例的示例性***架构700。
如图7所示，***架构700可以包括终端设备701、702、703，网络704和服务器705(仅仅是示例)。网络704用以在终端设备701、702、703和服务器705之间提供通信链路的介质。网络704可以包括各种连接类型，例如有线、无线通信链路或者光纤电缆等等。
用户可以使用终端设备701、702、703通过网络704与服务器705交互，以接收或发送消息等。终端设备701、702、703上可以安装有各种通讯客户端浏览器。
终端设备701、702、703可以是具有显示屏并且支持网页浏览的各种电子设备，服务器705可以是提供各种服务的服务器。
需要说明的是，本发明实施例所提供的方法一般由服务器705执行，相应地，装置一般设置于服务器705中。
应该理解，图7中的终端设备、网络和服务器的数目仅仅是示意性的。根据实现需要，可以具有任意数目的终端设备、网络和服务器。
下面参考图8，其示出了适于用来实现本发明实施例的终端设备的计算机***800的结构示意图。图8示出的终端设备仅仅是一个示例，不应对本发明实施例的功能和使用范围带来任何限制。
如图8所示，计算机***800包括中央处理单元(CPU)801，其可以根据存储在只读存储器(ROM)802中的程序或者从存储部分808加载到随机访问存储器(RAM)803中的程序而执行各种适当的动作和处理。在RAM 803中，还存储有***800操作所需的各种程序和数据。CPU 801、ROM 802以及RAM 803通过总线804彼此相连。输入/输出(I/O)接口805也连接至总线804。
以下部件连接至I/O接口805：包括键盘、鼠标等的输入部分806；包括诸如阴极射线管(CRT)、液晶显示器(LCD)等以及扬声器等的输出部分807；包括硬盘等的存储部分808；以及包括诸如LAN卡、调制解调器等的网络接口卡的通信部分809。通信部分809经由诸如因特网的网络执行通信处理。驱动器810也根据需要连接至I/O接口805。可拆卸介质811，诸如磁盘、光盘、磁光盘、半导体存储器等等，根据需要安装在驱动器810上，以便于从其上读出的计算机程序根据需要被安装入存储部分808。
特别地，根据本发明公开的实施例，上文参考流程图描述的过程可以被实现为计算机软件程序。例如，本发明公开的实施例包括一种计算机程序产品，其包括承载在计算机可读介质上的计算机程序，该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中，该计算机程序可以通过通信部分809从网络上被下载和安装，和/或从可拆卸介质811被安装。在该计算机程序被中央处理单元(CPU)801执行时，执行本发明的***中限定的上述功能。
需要说明的是，本发明所示的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的***、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本发明中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行***、装置或者器件使用或者与其结合使用。而在本发明中，计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读介质可以发送、传播或者传输用于由指令执行***、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于：无线、电线、光缆、RF等等，或者上述的任意合适的组合。
附图中的流程图和框图，图示了按照本发明各种实施例的***、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分，上述模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个接连地表示的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图或流程图中的每个方框、以及框图或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的***来实现，或者可以用专用硬件与计算机指令的组合来实现。
描述于本发明实施例中所涉及到的模块可以通过软件的方式实现，也可以通过硬件的方式来实现。所描述的模块也可以设置在处理器中，例如，可以描述为：一种处理器包括触发模块、加载模块、主页面渲染模块。其中，这些模块的名称在某种情况下并不构成对该模块本身的限定，例如，加载模块还可以被描述为“加载资源内容模块”。
作为另一方面，本发明还提供了一种计算机可读介质，该计算机可读介质可以是上述实施例中描述的设备中所包含的；也可以是单独存在，而未装配入该设备中。上述计算机可读介质承载有一个或者多个程序，当上述一个或者多个程序被一个该设备执行时，使得该设备包括：
响应于对插件的点击操作，触发与所述插件对应的属性脚本，以打开所述插件的主页面；
通过所述插件的主入口脚本，获取所述主页面网址中的访问路径，以从与所述插件对应的资源站点中，加载与所述访问路径对应的资源内容；
将资源内容添加至页面脚本的文档主体中，以通过所述文档主体将资源内容渲染至所述主页面，完成主页面资源内容更新。
根据本发明实施例的技术方案，摒弃现有将资源内容和插件源代码一起打包在安装包里的思想，仅将源代码发送至客户端进行安装，而资源内容发布至资源站点中，实现两者分离，后续插件需实时获取远程资源站点下最新的资源内容对页面进行渲染，以此达到用户无感知即可体验新升级插件的目的。
上述具体实施方式，并不构成对本发明保护范围的限制。本领域技术人员应该明白的是，取决于设计要求和其他因素，可以发生各种各样的修改、组合、子组合和替代。任何在本发明的精神和原则之内所作的修改、等同替换和改进等，均应包含在本发明保护范围之内。
Claims (10)
1.一种应用于插件的页面内容更新方法，其特征在于，包括：
响应于对插件的点击操作，触发与所述插件对应的属性脚本，以打开所述插件的主页面；
通过所述插件的主入口脚本，获取所述主页面网址中的访问路径，以从与所述插件对应的资源站点中，加载与所述访问路径对应的资源内容；
将资源内容添加至页面脚本的文档主体中，以通过所述文档主体将资源内容渲染至所述主页面，完成主页面资源内容更新。
2.根据权利要求1所述的方法，其特征在于，所述通过所述插件的主入口脚本，获取所述主页面网址中的访问路径，以从与所述插件对应的资源站点中，加载与所述访问路径对应的资源内容，包括：
通过所述插件的主入口脚本，获取所述主页面的网址中的第一哈希值，判断所述第一哈希值是否为空；
若不为空，则去除所述第一哈希值中的特定字符，得到剩余字符，否则设置为第一默认字符；其中，剩余字符或第一默认字符表示访问路径；
确定与所述插件对应资源站点的第一访问地址，拼接所述第一访问地址和剩余字符/第一默认字符，得到第二访问地址，以从所述资源站点中获取与所述第二访问地址对应的资源内容。
3.根据权利要求2所述的方法，其特征在于，主页面和子页面共用一个页面脚本；
在所述完成主页面资源内容更新之后，还包括：
响应于对所述主页面中一功能的点击操作，从所述主页面跳转至与所述功能对应的子页面中；
通过所述插件的主入口脚本，获取所述子页面的网址中的第二哈希值，判断所述第二哈希值是否为空；
若不为空，则去除所述第二哈希值中的特定字符，得到剩余字符，否则设置为第二默认字符；
拼接所述第一访问地址和剩余字符/第二默认字符，得到第三访问地址，以从所述资源站点中获取与所述第三访问地址对应的资源内容；
将资源内容添加至页面脚本的所述文档主体中，以通过所述文档主体将资源内容渲染至所述子页面，完成子页面资源内容更新。
4.根据权利要求1所述的方法，其特征在于，在所述响应于对插件图标的点击操作之前，还包括：
从服务端下载所述插件的安装包并安装，在安装完成后，生成插件图标；其中，安装包通过将源代码应用打包为特定类型的文件得到，源代码应用包括属性脚本、主入口脚本和页面脚本。
5.根据权利要求4所述的方法，其特征在于，所述源代码应用还包括基础配置文件，所述基础配置文件包括安全策略，所述安全策略配置有所述主页面可以跨站点访问的站点。
6.根据权利要求5所述的方法，其特征在于，资源内容包括资源文件、层叠样式表访问地址和编程语言访问地址，所述安全策略中配置有与所述层叠样式表访问地址对应的站点和与所述编程语言访问地址对应的站点；
所述将资源内容添加至页面脚本的文档主体中，包括：
从与所述层叠样式表访问地址对应的页面中，加载层叠样式表脚本；
从与所述编程语言访问地址对应的页面中，加载编程语言脚本；
将所述资源文件、所述层叠样式表脚本和所述编程语言脚本，添加至页面脚本的所述文档主体中。
7.根据权利要求1所述的方法，其特征在于，还包括：
服务端接收对所述插件的静态资源应用的创建操作、以及对所述静态资源应用中资源内容的存储操作，并在存储完毕后，将资源内容上传至与所述插件对应的资源站点中；以及
接收对资源内容的更改操作，在更改完毕后，将更改后的资源内容上传至与所述插件对应的资源站点中。
8.一种应用于插件的页面内容更新装置，其特征在于，包括：
触发模块，用于响应于对插件的点击操作，触发与所述插件对应的属性脚本，以打开所述插件的主页面；
加载模块，用于通过所述插件的主入口脚本，获取所述主页面网址中的访问路径，以从与所述插件对应的资源站点中，加载与所述访问路径对应的资源内容；
主页面渲染模块，用于将资源内容添加至页面脚本的文档主体中，以通过所述文档主体将资源内容渲染至所述主页面，完成主页面资源内容更新。
9.一种电子设备，其特征在于，包括：
一个或多个处理器；
存储装置，用于存储一个或多个程序，
当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现如权利要求1-7中任一所述的方法。
10.一种计算机可读介质，其上存储有计算机程序，其特征在于，所述程序被处理器执行时实现如权利要求1-7中任一所述的方法。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010916508.1A CN113778543B (zh) | 2020-09-03 | 2020-09-03 | 一种应用于插件的页面内容更新方法和装置 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010916508.1A CN113778543B (zh) | 2020-09-03 | 2020-09-03 | 一种应用于插件的页面内容更新方法和装置 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN113778543A CN113778543A (zh) | 2021-12-10 |
| CN113778543B true CN113778543B (zh) | 2024-04-05 |
Family
ID=78834973
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202010916508.1A Active CN113778543B (zh) | 2020-09-03 | 2020-09-03 | 一种应用于插件的页面内容更新方法和装置 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN113778543B (zh) |
Families Citing this family (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN117407115B (zh) * | 2023-12-15 | 2024-02-20 | 江苏金融租赁股份有限公司 | 一种基于动态加载插件的界面显示方法及装置 |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN104317624A (zh) * | 2014-11-04 | 2015-01-28 | 南京联创科技集团股份有限公司 | 基于插件处理的数据装配方法 |
| CN110990731A (zh) * | 2019-10-12 | 2020-04-10 | 平安国际智慧城市科技股份有限公司 | 一种静态网页的渲染方法、装置、设备及计算机存储介质 |
| CN111143729A (zh) * | 2019-12-11 | 2020-05-12 | 中国平安财产保险股份有限公司 | 基于单页面应用的优化方法、装置、设备及存储介质 |
| CN111381852A (zh) * | 2020-03-10 | 2020-07-07 | 江苏满运软件科技有限公司 | 基于Flutter的应用动态更新方法、装置、存储介质及电子设备 |
Family Cites Families (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US9218100B2 (en) * | 2010-03-04 | 2015-12-22 | International Business Machines Corporation | Method and system for partitioning asset management plugins |
| US9158563B2 (en) * | 2012-03-27 | 2015-10-13 | Microsoft Technology Licensing, Llc | Dynamic plugin(s) for cloud application(s) |
-
2020
- 2020-09-03 CN CN202010916508.1A patent/CN113778543B/zh active Active
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN104317624A (zh) * | 2014-11-04 | 2015-01-28 | 南京联创科技集团股份有限公司 | 基于插件处理的数据装配方法 |
| CN110990731A (zh) * | 2019-10-12 | 2020-04-10 | 平安国际智慧城市科技股份有限公司 | 一种静态网页的渲染方法、装置、设备及计算机存储介质 |
| CN111143729A (zh) * | 2019-12-11 | 2020-05-12 | 中国平安财产保险股份有限公司 | 基于单页面应用的优化方法、装置、设备及存储介质 |
| CN111381852A (zh) * | 2020-03-10 | 2020-07-07 | 江苏满运软件科技有限公司 | 基于Flutter的应用动态更新方法、装置、存储介质及电子设备 |
Non-Patent Citations (1)
| Title |
|---|
| 基于HTML5的EX-DRM Web离线应用***;欧少闽;龚明龙;朱凌枫;侯晓利;蔡伟鸿;;汕头大学学报(自然科学版)(第04期);全文 * |
Also Published As
| Publication number | Publication date |
|---|---|
| CN113778543A (zh) | 2021-12-10 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US10831858B2 (en) | Mobile enablement of existing web sites | |
| CN108038134B (zh) | 页面展示的方法、装置和存储介质以及电子设备 | |
| US9077770B2 (en) | Mobile web app infrastructure | |
| CN107844324B (zh) | 客户端页面跳转处理方法和装置 | |
| CN110120917B (zh) | 基于内容的路由方法及装置 | |
| US20130159892A1 (en) | Non-technical creation of mobile web applications | |
| CN110324169B (zh) | 一种接口管理的方法和装置 | |
| CN106874519B (zh) | 页面展现方法和装置 | |
| US10037215B2 (en) | Method and apparatus for interworking application and web browser | |
| US20140281859A1 (en) | Enhanced mobilization of existing web sites | |
| CN109525584B (zh) | 一种构建移动端跨平台多类型应用容器的方法 | |
| CN113382083B (zh) | 一种网页截图方法和装置 | |
| CN113760324A (zh) | 构建微前端应用的方法和装置 | |
| US20120117491A1 (en) | Web interface for remote platform build | |
| CN113590974B (zh) | 推荐页面配置方法、装置、电子设备和计算机可读介质 | |
| CN109670132A (zh) | 一种页面绘制方法、装置、终端设备及存储介质 | |
| CN103634393A (zh) | Ivr及其实现方法 | |
| CN114237651A (zh) | 云原生应用的安装方法、装置、电子设备和介质 | |
| CN113778543B (zh) | 一种应用于插件的页面内容更新方法和装置 | |
| CN112835568A (zh) | 一种项目构建方法和装置 | |
| CN112905225A (zh) | 创建持续集成工具构建任务的方法和装置 | |
| CN112486482A (zh) | 一种页面展示方法和装置 | |
| US11392663B2 (en) | Response based on browser engine | |
| US9754327B2 (en) | Method and apparatus for configuring social networking site sharing functions | |
| CN114253441B (zh) | 目标功能的启用方法及装置、存储介质、电子装置 |
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 | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |