CN108804159B - javascript模块加载方法及其预处理方法、装置和计算机设备 - Google Patents
javascript模块加载方法及其预处理方法、装置和计算机设备 Download PDFInfo
- Publication number
- CN108804159B CN108804159B CN201810613990.4A CN201810613990A CN108804159B CN 108804159 B CN108804159 B CN 108804159B CN 201810613990 A CN201810613990 A CN 201810613990A CN 108804159 B CN108804159 B CN 108804159B
- Authority
- CN
- China
- Prior art keywords
- module
- code
- dependent
- path
- main
- 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
Images
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
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Stored Programmes (AREA)
Abstract
本申请涉及一种javascript模块加载方法及其预处理方法、装置、计算机设备和可读存储介质。该加载方法包括：接收服务器根据页面加载请求返回的页面文件；解析页面文件；当解析到页面文件中的路径标签时，根据路径标签，向服务器发送模块加载请求；模块加载请求用于指示由服务器根据路径标签，获取入口函数、主模块代码和与主模块代码存在依赖关系的依赖模块代码；接收服务器返回的依赖模块代码、主模块代码和入口函数；执行依赖模块代码、主模块代码和入口函数。该加载方法仅需要根据路径标签获取主模块代码和依赖模块代码并执行，继而执行入口回调即可，节约了模块解析时间，提高了浏览器解析并加载页面的效率，避免了因模块解析造成的页面“假死”。
Description
技术领域
本申请涉及web前端开发技术领域，特别是涉及一种javascript模块加载方法及其预处理方法、装置、计算机设备和可读存储介质。
背景技术
随着Ajax(Asynchronous Javascript And XML，异步的JavaScript和XML)被提出，前端逻辑越来越复杂，并出现了全局变量、函数名冲突，依赖关系不好处理等问题，JavaScript模块化应运而生，并很好地解决了以上问题。
然而，传统的JavaScript模块加载执行方法，需要在页面中的添加JavaScript模块解析工具源码，由终端浏览器通过入口函数不断解析模块依赖，基于解析的依赖关系，获取主模块代码及其依赖模块代码并加载执行。当依赖模块较多时，需要耗费较长的解析时间，在解析过程中造成页面长时间处于“假死”状态而无法操作，导致浏览器解析并加载页面的效率低。
发明内容
基于此，有必要针对传统的模块加载执行方法导致浏览器解析并加载页面的效率低的技术问题，提供一种javascript模块加载方法及其预处理方法、装置、计算机设备和可读存储介质。
一种javascript模块加载方法，所述方法包括：
接收服务器根据页面加载请求返回的页面文件；
解析所述页面文件；
当解析到所述页面文件中的路径标签时，根据所述路径标签，向服务器发送模块加载请求；所述模块加载请求用于指示由服务器根据所述路径标签，获取入口函数、主模块代码和与所述主模块代码存在依赖关系的依赖模块代码；
接收所述服务器返回的所述依赖模块代码、所述主模块代码和入口函数；
执行所述依赖模块代码、所述主模块代码和所述入口函数。
一种javascript模块加载的预处理方法，所述方法包括：
获取对页面文件所调用模块定义的入口函数；
调用模块解析工具，解析所述入口函数，获取主模块代码以及与所述主模块代码存在依赖关系的依赖模块代码；
根据所述主模块代码、所述依赖模块代码以及所述入口函数，生成对应的路径标签；
将所述路径标签添加至所述页面文件。
一种javascript模块加载装置，所述装置包括：
页面接收单元，用于接收服务器根据页面加载请求返回的页面文件；
页面解析模块，用于解析所述页面文件；
加载请求模块，用于当解析到所述页面文件中的路径标签时，根据所述路径标签，向服务器发送模块加载请求；所述模块加载请求用于指示由服务器根据所述路径标签，获取入口函数、主模块代码和与所述主模块代码存在依赖关系的依赖模块代码；
代码接收模块，用于接收所述服务器返回的所述依赖模块代码、所述主模块代码和入口函数；
执行模块，用于执行所述依赖模块代码、所述主模块代码和所述入口函数。
一种javascript模块加载的预处理装置，所述装置包括：
入口函数获取模块，用于获取对页面文件所调用模块定义的入口函数；
入口函数解析模块，用于调用模块解析工具，解析所述入口函数，获取主模块代码以及与所述主模块代码存在依赖关系的依赖模块代码；
标签生成模块，用于根据所述主模块代码、所述依赖模块代码以及所述入口函数，生成对应的路径标签；
添加模块，用于将所述路径标签添加至所述页面文件。
一种计算机设备，包括存储器和处理器，所述存储器存储有计算机程序，所述处理器执行所述计算机程序时实现以下步骤：
接收服务器根据页面加载请求返回的页面文件；
解析所述页面文件；
当解析到所述页面文件中的路径标签时，根据所述路径标签，向服务器发送模块加载请求；所述模块加载请求用于指示由服务器根据所述路径标签，获取入口函数、主模块代码和与所述主模块代码存在依赖关系的依赖模块代码；
接收所述服务器返回的所述依赖模块代码、所述主模块代码和入口函数；
执行所述依赖模块代码、所述主模块代码和所述入口函数。
一种计算机设备，包括存储器和处理器，所述存储器存储有计算机程序，所述处理器执行所述计算机程序时实现以下步骤：
获取对页面文件所调用模块定义的入口函数；
调用模块解析工具，解析所述入口函数，获取主模块代码以及与所述主模块代码存在依赖关系的依赖模块代码；
根据所述主模块代码、所述依赖模块代码以及所述入口函数，生成对应的路径标签；
将所述路径标签添加至所述页面文件。
一种计算机可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现以下步骤：
接收服务器根据页面加载请求返回的页面文件；
解析所述页面文件；
当解析到所述页面文件中的路径标签时，根据所述路径标签，向服务器发送模块加载请求；所述模块加载请求用于指示由服务器根据所述路径标签，获取入口函数、主模块代码和与所述主模块代码存在依赖关系的依赖模块代码；
接收所述服务器返回的所述依赖模块代码、所述主模块代码和入口函数；
执行所述依赖模块代码、所述主模块代码和所述入口函数。
一种计算机可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现以下步骤：
获取对页面文件所调用模块定义的入口函数；
调用模块解析工具，解析所述入口函数，获取主模块代码以及与所述主模块代码存在依赖关系的依赖模块代码；
根据所述主模块代码、所述依赖模块代码以及所述入口函数，生成对应的路径标签；
将所述路径标签添加至所述页面文件。
上述javascript模块加载方法及其预处理方法、装置、计算机设备和可读存储介质，接收服务器根据页面加载请求返回的页面文件，解析页面文件，当解析到页面文件中的路径标签时，根据路径标签，向服务器发送的模块加载请求，由服务器根据路径标签，获取对应的入口函数、主模块代码和与主模块代码存在依赖关系的依赖模块代码并返回。当接收到依赖模块代码、主模块代码和入口函数后，直接执行依赖模块代码、主模块代码和入口回调。该模块加载方法仅需要根据路径标签获取主模块代码和依赖模块代码并执行，继而执行入口回调即可，节约了模块解析时间，进而提高了浏览器解析并加载页面的效率，避免了因模块解析造成的页面“假死”状态。
附图说明
图1为一个实施例中javascript模块加载方法及其预处理方法的应用环境图；
图2为一个实施例中javascript模块加载方法的流程示意图；
图3为一个实施例中javascript模块加载的预处理方法的流程示意图；
图4为一个实施例中获得模块代码并生成路径标签步骤的流程示意图；
图5为一个实施例中生成全局代码文件的路径标签步骤的流程示意图；
图6为一个实施例中javascript模块加载的预处理方法的流程示意图；
图7为一个实施例中javascript模块加载装置的结构框图；
图8为一个实施例中javascript模块加载的预处理装置的结构框图；
图9为一个实施例中入口函数解析模块的结构框图；
图10为一个实施例中标签生成模块的结构框图；
图11为一个实施例中计算机设备的结构框图。
具体实施方式
为了使本申请的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对本申请进行进一步详细说明。应当理解，此处所描述的具体实施例仅仅用以解释本申请，并不用于限定本申请。
图1为一个实施例中javascript模块加载方法及其预处理方法的应用环境图。参照图1，该javascript模块加载方法及其预处理方法方法应用于模块加载系统。该模块加载系统包括终端(浏览器端)110、服务器120和管理平台130。终端110和服务器120通过网络连接，服务器120和管理平台130通过网络连接。终端110具体可以是台式终端或移动终端，移动终端具体可以手机、平板电脑、笔记本电脑等中的至少一种。服务器120可以用独立的服务器或者是多个服务器组成的服务器集群来实现。
如图2所示，在一个实施例中，提供了一种javascript模块加载方法。本实施例主要以该方法应用于上述图1中的终端110来举例说明。参照图2，该javascript模块加载方法具体包括如下步骤：
S202，接收服务器根据页面加载请求返回的页面文件。
其中，页面加载请求是指浏览器基于用户输入的网址，按照Http(HyperTextTransfer Protocol，超文本传输协议)标准向对应服务器发送的索要页面文件的请求。页面文件是指服务器响应页面加载请求返回给浏览器的网页文本。常用的页面文件有html(HyperText Markup Language，超文本标记语言)格式的静态网页文本、shtml(ServerSide Include HyperText Markup Language，)格式的动态网页文本。
具体地，浏览器根据用户输入网址，向服务器发送页面加载请求，服务器接收到页面加载请求后响应该请求，并向浏览器返回一个页面文件，浏览器接收服务器返回的页面文件。
S204，解析页面文件。
由浏览器中的渲染引擎从上至下解析页面文件，根据页面文件生成DOM(DocumentObject Model，文档对象模型)树。基于DOM树进一步创建渲染树，最终根据渲染树计算各节点在屏幕中的位置并进行绘制，生成显示页面。
S206，当解析到页面文件中的路径标签时，根据路径标签，向服务器发送模块加载请求；模块加载请求用于指示由服务器根据路径标签，获取入口函数、主模块代码和与主模块代码存在依赖关系的依赖模块代码。
其中，路径标签是指携带有路径信息的标签，用于唯一指向服务器中的一个文件地址。路径信息具体是指在服务器中的存储路径，比如，路径信息可以是文件名。在本实施例中，路径标签分别对应于主模块代码、依赖模块代码以及入口函数在服务器中的存储路径，或者对应于主模块代码、依赖模块代码以及入口函数作为一个整体在服务器中的存储路径。
入口函数是指需要实现主模块功能时最开始调用的函数，入口函数中包括入口回调函数。主模块是指当前需要加载调用的模块，依赖模块是指在执行主模块代码时，需要进一步调用的模块，各模块均是指javascript模块。可以理解，依赖关系也就是指模块存在的调用关系，依赖关系包括直接依赖关系和间接依赖关系。比如，假设主模块A依赖于依赖模块B，依赖模块B进一步依赖于依赖模块C，则主模块A与依赖模块B为直接依赖关系，主模块A与依赖模块C为间接依赖关系，依赖模块B与依赖模块C为直接依赖关系。主模块代码和依赖模块代码分别是指主模块的定义代码和依赖模块的定义代码。
具体地，当解析到页面文件中的路径标签时，根据路径标签，生成携带有路径标签中路径信息的模块加载请求，并向服务器发送模块加载请求，服务器接收到模块加载请求后，按照模块加载请求中的路径信息，获取对应路径存储的入口函数、主模块代码和与主模块代码存在依赖关系的依赖模块代码，并返回至发送请求的浏览器端。
S208，接收服务器返回的依赖模块代码、主模块代码和入口函数。
浏览器端接收服务器返回的依赖模块代码、主模块代码和入口函数，由于接收的是可直接执行的代码文件，因此，无需进一步进行模块解析，节约了浏览器进行模块解析的时间，从而提升了页面加载效率。并且，由于网络状况的复杂性，在浏览器端进行模块解析时，容易导致因模块加载异常造成解析失败，导致页面入口回调无法执行，页面无法操作的问题。而在本实施例中，浏览器端接收到的为可直接执行的依赖模块代码、主模块代码和入口函数，有效规避了上述问题。
S210，执行依赖模块代码、主模块代码和入口函数。
在接收到依赖模块代码、主模块代码和入口函数后，按照依赖关系依次执行各依赖模块代码、主模块代码，在执行完主模块代码之后，再执行入口函数中的入口回调函数，从而实现调用主模块的功能。假设主模块A依赖于依赖模块B，依赖模块B进一步依赖于依赖模块C，则先执行依赖模块C代码，再由依赖模块B代码中的回调函数调用依赖模块C代码并执行，依赖模块B代码执行完毕，再由主模块A代码中的回调函数调用依赖模块B代码并执行，主模块A代码执行完毕，再由入口函数中的入口回调函数调用主模块A代码并执行。
上述javascript模块加载方法，接收服务器根据页面加载请求返回的页面文件，解析页面文件，当解析到页面文件中的路径标签时，根据路径标签，向服务器发送的模块加载请求，由服务器根据路径标签，获取对应的入口函数、主模块代码和与主模块代码存在依赖关系的依赖模块代码并返回。当接收到依赖模块代码、主模块代码和入口函数后，直接执行依赖模块代码、主模块代码和入口回调。该模块加载方法仅需要根据路径标签获取主模块代码和依赖模块代码并执行，继而执行入口回调即可，节约了模块解析时间，进而提高了浏览器解析并加载页面的效率，避免了因模块解析造成的页面白屏。
在一实施例中，路径标签为全局代码文件的路径标签，全局代码文件为包含入口函数，以及解析入口函数解析得到的、且按照依赖关系存储的主模块代码和依赖模块代码的一体化文件。
其中，全局代码文件是指包括调用模块时所需加载的所有代码的一个代码文件，具体地，包括入口函数，以及解析入口函数解析得到的、且按照依赖关系存储的主模块代码和依赖模块代码。可以理解，在本实施例中，路径标签只有一个，也就是全局代码文件的路径标签。按照依赖关系存储是指按照依赖性从小到大的顺序存储，比如，主模块A依赖于依赖模块B，依赖模块B进一步依赖于依赖模块C，则按照依赖模块C、依赖模块B、主模块A、入口函数的顺序存储各个代码，依赖模块C的代码处于全局代码文件的最前端，入口函数的代码处于全局代码文件的底部。
进一步地，执行主模块代码、依赖模块代码和入口函数的步骤，包括：按照依赖关系依次执行各依赖模块代码和主模块代码；当所有依赖模块代码和主模块代码执行完成后，执行入口函数。
在本实施例中，主模块代码和依赖模块代码是按照依赖关系存储的，在获取主模块代码和依赖模块代码时，按照依赖关系依次接收依赖模块代码和主模块代码后，按照依赖关系依次执行各模块代码，并在所有依赖模块代码和主模块代码执行完成后，执行入口函数中的入口回调函数。例如，直接从上至下执行全局代码文件中的各行代码，并在所有依赖模块代码和主模块代码执行完成后，执行入口函数的入口回调函数。
通过将调用模块时所需加载的所有代码的一个全局代码文件中，当需要调用模块，直接获取对应的全局代码文件并执行，无需解析各模块之间的依赖关系，提升了模块调用的效率。
如图3所示，在一个实施例中，提供了一种javascript模块加载的预处理方法。本实施例主要以该方法应用于上述图1中的管理平台130来举例说明。参照图3，该预处理方法具体包括如下步骤：
S302，获取对页面文件所调用模块定义的入口函数。
页面文件所调用模块实际上就是页面文件需要调用的主模块。入口函数是指需要实现主模块功能时最开始调用的函数。入口函数的编写规范与模块解析工具对应，可根据模块解析工具对应的编写规范，定义与主模块相关的入口函数，在此不作限定。比如，当采用seajs作为模块解析工具时，其入口函数格式为seajs.use()；当采用requirejs作为模块解析工具时，其入口函数格式为require()。在本实施例中，所获取入口函数为由研发人员定义的入口函数。
S304，调用模块解析工具，解析入口函数，获取主模块代码以及与主模块代码存在依赖关系的依赖模块代码。
其中，模块解析工具是指用于通过入口函数，层层解析模块之间的依赖关系，得到与主模块存在直接依赖关系或者间接依赖关系的依赖模块。主模块代码和依赖模块代码由开发人员预先按照模块定义规范进行编写，并按照时间戳命名代码文件后，上传至服务器进行存储。比如，将定义的A模块代码命名为“A.时间戳.js”，上传至CDN(Content DeliveryNetwork，内容分发网络)服务器存储，其中，A为模块标识，.js为文件扩展名。模块定义规范包括但不限于AMD(Asynchronous Module Definition，异步模块定义)规范。
具体地，调用模块解析工具，解析入口函数，获取主模块代码，并主模块代码进行解析，得到主模块存在依赖关系的依赖模块代码，进一步解析依赖模块代码，当依赖模块进一步依赖其他的依赖模块，进一步获取其他的依赖模块代码，通过层层解析，得到主模块直接依赖或者间接依赖的所有依赖模块代码。其中，主模块代码和依赖模块代码从其存储的服务器中获取得到。
S306，根据主模块代码、依赖模块代码以及入口函数，生成对应的路径标签。
如上所示，路径标签是指携带有路径信息的标签，路径信息具体是指在服务器中的存储路径。比如，当主模块代码、依赖模块代码以及入口函数存储在CDN中时，路径信息即为在CDN中的路径，假设模块A代码以文件名“A.时间戳.js”存储与CDN中，则路径信息可以为“A.时间戳.js”。
具体地，获取主模块代码、依赖模块代码以及入口函数对应的路径信息，根据预设的路径标签格式，将路径信息设置为路径标签的属性，生成对应的路径标签。比如，路径标签采用script标签的形式，将script标签的属性设置为主模块代码、依赖模块代码以及入口函数对应的文件名。
S308，将路径标签添加至页面文件。
具体地，将路径标签添加至服务器中该入口函数对应的页面文件中，使得在解析该页面文件时，直接根据路径标签获取对应路径中存储的代码并执行。
上述javascript模块加载的预处理方法，通过预先对定义的入口函数进行解析，得到所需要调用的主模块代码和与主模块代码存在依赖关系的依赖模块代码，并生成对应的路径标签，使得浏览器解析到页面文件的路径标签时，直接根据路径标签获取对应路径中存储的代码并执行即可，无需通过浏览器对调用模块的入口函数进行层层解析后，才能加载所需要调用的主模块代码和依赖模块代码，减少了浏览器的解析时间，进而提高了解析并加载页面文件的效率。并且，浏览器对入口函数进行解析时，并没有执行javascript主逻辑、页面文件其他内容以及与用户之间的交互操作，造成页面处于“假死”状态，降低了用户体验，而该方法直接加载执行主模块代码和依赖模块代码，避免了页面长期处于“假死”状态。
在一实施例中，如图4所示，调用模块解析工具，解析入口函数，获得主模块代码以及与主模块代码存在依赖关系的依赖模块代码，包括：
S401，调用模块解析工具，解析入口函数，获得主模块标识。
其中，主模块标识是指主模块的名称，比如主模块A，“A”即为主模块标识。入口函数中包括主模块名以及入口回调函数，通过调用模块解析工具，解析入口函数，得到入口函数中的主模块标识。
S402，根据主模块标识，获取主模块代码。
具体地，根据主模块标识，查找服务器中存储的代码文件，获取服务器中与主模块标识对应的主模块代码。
S403，解析主模块代码，识别主模块代码中的依赖函数，得到主模块标识依赖的依赖模块标识。
其中，依赖函数是指模块代码中需进一步调用其他模块的模块回调函数，依赖函数中包括所需调用的依赖模块标识。依赖模块标识是指依赖模块的名称。
当获得主模块代码后，通过模块解析工具对主模块代码进行解析，识别到主模块代码中的依赖函数，根据依赖函数得到主模块标识依赖的依赖模块标识。
S404，根据依赖模块标识，获取依赖模块代码。
具体地，根据依赖模块标识，查找服务器中存储的代码文件，获取服务器中与依赖模块标识对应的依赖模块代码。
S405，解析依赖模块代码，识别依赖模块代码中的依赖函数。
S406，当识别到依赖模块代码中的依赖函数时，得到当前解析的依赖模块标识依赖的依赖模块标识，并返回根据依赖模块标识，获取依赖模块代码的步骤。
当获得依赖模块代码后，通过模块解析工具对依赖模块代码进行解析，判断依赖模块代码中是否存在依赖函数，当识别到依赖模块代码中的依赖函数时，根据依赖函数得到当前解析的依赖模块标识依赖的依赖模块标识。也就是说，对依赖模块代码进行解析，进一步判断当前依赖模块是否也存在依赖的依赖模块，通过层层解析来获得主模块直接依赖或间接依赖的所有依赖模块。比如，假设主模块A依赖于依赖模块B，依赖模块B进一步依赖于依赖模块C，则主模块A直接依赖于依赖模块B，又间接依赖于依赖模块C。
可以理解，当未识别到依赖函数时，则结束解析的相关步骤，执行S407:根据主模块代码、依赖模块代码以及入口函数，生成对应的路径标签。
在一实施例中，根据主模块标识，获取主模块代码，包括：根据主模块标识，获取主模块标识的当前版本信息；根据主模块标识的当前版本信息，获取主模块代码。
通常，同一模块代码存在更新代码的情况，因此，同一模块代码存在多个不同版本，当前版本信息是指模块当前使用的版本的相关信息。比如，当前版本信息可以是对定义代码进行命名时的时间戳。
在根据主模块标识获取主模块代码时，首先根据主模块标识以及所维护的版本信息，获取主模块标识的当前版本信息，进一步根据主模块标识的当前版本信息，查找服务器中存储的代码文件，获取服务器中与主模块当前版本信息对应的主模块代码。通过按照当前版本信息获取主模块代码，确保所获取的模块代码为经过验证可正常执行的代码。
对应地，根据依赖模块标识，获取依赖模块代码，包括：根据依赖模块标识，获取依赖模块标识的当前版本信息；根据依赖模块标识的当前版本信息，获取依赖模块代码。
根据依赖模块标识以及所维护的版本信息，获取依赖模块标识的当前版本信息，进一步根据依赖模块标识的当前版本信息，查找服务器中存储的代码文件，获取服务器中与依赖模块当前版本信息对应的依赖模块代码。
在一实施例中，如图5所示，根据主模块代码、依赖模块代码以及入口函数，生成对应的路径标签，包括：
S502，当当前环境为生产环境时，将主模块代码以及依赖模块代码按照依赖关系存储至全局代码文件，并将入口函数存储至全局代码文件的底部。
其中，生产环境是指正式提供对外服务的，包含所有的功能的环境，任何项目所使用的环境都以这个为基础，然后根据客户的个性化需求来做调整或者修改。在本实施例中，生产环境是指可通过浏览器对外提供页面加载服务时的环境。
具体地，检测当前环境的类型，当当前环境为生产环境时，将主模块代码以及依赖模块代码按照依赖关系的先后顺序存储至全局代码文件，并将入口函数存储至全局代码文件的底部，同时将全局代码文件上传至服务器进行保存。比如，主模块A依赖于依赖模块B，依赖模块B进一步依赖于依赖模块C，则按照依赖模块C、依赖模块B、主模块A、入口函数的顺序存储各个代码，依赖模块C的代码处于全局代码文件的最前端，入口函数的代码处于全局代码文件的底部。
通过将页面文件调用模块时所需加载的所有模块的定义代码，以及入口函数融合至一个代码文件中，使得在执行页面文件时，直接获取所需调用模块对应的全局代码文件，并执行，无需进一步进行解析并依次加载各个模块代码。并且全局代码文件是按照依赖关系存储各个模块代码，确保在执行任一模块代码时，其依赖的依赖模块均已定义完成。
S504，获取全局代码文件的路径信息。
全局代码文件的路径信息是指全局代码文件存储在服务器中的路径，具体地，全局代码文件的路径信息为可用于唯一表征全局代码文件的文件名。比如，由主模块标识、全局代码文件标识、全局代码文件版本信息以及扩展名组成的文件名。具体地，根据全局代码文件的存储路径，得到全局代码文件的路径信息。
S506，生成携带有全局代码文件的路径信息的路径标签。
具体地，根据预设的路径标签格式，将全局代码文件的路径信息设置为路径标签的属性，生成对应的路径标签。比如，路径标签采用script标签的形式，将script标签的属性设置全局代码文件的文件名。
通过将页面文件调用模块时所需加载的所有模块的定义代码，以及入口函数融合至一个代码文件中，使得在执行页面文件时，直接获取所需调用模块对应的全局代码文件，并执行，无需进一步进行解析并依次加载各个模块代码，提高了页面文件加载的效率。
在一实施例中，该预处理方法还包括：当当前环境为测试环境时，获取主模块代码的路径信息、依赖模块代码的路径信息和入口函数的路径信息；分别生成携带有主模块代码的路径信息的路径标签、携带有依赖模块代码的路径信息的路径标签和携带有入口函数的路径信息的路径标签。
其中，测试环境是指内部研发人员使用的环境，开发人员调试代码、测试人员进行功能测试和集成测试等使用的环境。
通过对当前环境的类型进行检测，当当前环境为测试环境时，则获取主模块代码的路径信息，生成携带有主模块代码的路径信息的路径标签；获取各依赖模块代码的路径信息，分别生成携带有各依赖模块代码的路径信息的路径标签；获取入口函数的路径信息，生成携带有入口函数的路径信息的路径标签。在本实施例中，针对任一个模块代码，均生成一个对应的路径标签，便于在测试过程时，针对各模块代码分别进行调试。
进一步地，将路径标签添加至页面文件的步骤，包括：将携带有主模块代码的路径信息的路径标签、携带有依赖模块代码的路径信息的路径标签按照依赖关系依次添加至页面文件，当携带有主模块代码的路径信息的路径标签、携带有依赖模块代码的路径信息的路径标签添加完毕后，将携带有入口函数的路径信息的路径标签添加至页面文件。通过按照依赖关系依次添加对应路径标签至页面文件，使得在解析页面文件时，能够按照依赖关系依次获取依赖模块代码、主模块代码、入口函数并执行，确保在执行任意模块代码时，该模块所依赖的依赖模块均已定义。
在一实施例中，入口函数为页面文件中页面片段所调用模块的入口函数，将路径标签添加至页面文件，包括：将路径标签添加至页面片段；将页面片段添加至页面文件。
其中，页面片段是指通过对页面文件进行功能划分后的部分文件，一个页面文件由多个页面片段组成。通过进行页面片段划分，当更新其中任一个页面片段所调用模块的入口函数时，仅需要对该页面片段的内容进行更新，而无需对整个页面文件进行更新，降低了更新调用模块的入口函数时，页面文件处理的复杂度。
在本实施例中，入口函数为页面文件中页面片段所调用模块的入口函数，在生成路径标签后，将路径标签添加至服务器中该入口函数对应的页面片段中，并将该页面片段添加至对应的页面文件中。
在一实施例中，该预处理方法还包括：将定义函数的标准定义和依赖函数的标准定义添加至页面片段。
其中，定义函数是指对编写模块代码(也即模块的定义代码)时，所采用的函数，如define函数。依赖函数是指对调用模块时所采用的模块回调函数，如require函数。标准定义是指函数的标准编写格式。具体地，将定义函数的标准定义、依赖函数的标准定义以及路径标签同时添加至服务器中的页面片段。
如图6所示，提供一个javascript模块加载的预处理方法的完整实施例，包括以下步骤：
S601，获取对页面文件所调用模块定义的入口函数。
S602，调用模块解析工具，解析入口函数，获得主模块标识。
获取由研发人员定义的入口函数，入口函数中包括主模块名以及入口回调函数，通过调用模块解析工具，解析入口函数，得到入口函数中的主模块标识。
S603，根据主模块标识，获取主模块标识的当前版本信息。
S604，根据主模块标识的当前版本信息，获取主模块代码。
在根据主模块标识获取主模块代码时，首先根据主模块标识以及所维护的版本信息，获取主模块标识的当前版本信息，进一步根据主模块标识的当前版本信息，查找服务器中存储的代码文件，获取服务器中与主模块当前版本信息对应的主模块代码。通过按照当前版本信息获取主模块代码，确保所获取的模块代码为经过验证可正常执行的代码。
S605，解析主模块代码，识别主模块代码中的依赖函数，得到主模块标识依赖的依赖模块标识。
通过模块解析工具对主模块代码进行解析，识别得到主模块代码中的依赖函数，根据依赖函数得到主模块标识依赖的依赖模块标识。当未识别到依赖函数时，则判断当前环境是否为生产环境。
S606，根据依赖模块标识，获取依赖模块标识的当前版本信息。
S607，根据依赖模块标识的当前版本信息，获取依赖模块代码。
根据依赖模块标识以及所维护的版本信息，获取依赖模块标识的当前版本信息，进一步根据依赖模块标识的当前版本信息，查找服务器中存储的代码文件，获取服务器中与依赖模块当前版本信息对应的依赖模块代码。
S608，解析依赖模块代码，识别依赖模块代码中的依赖函数。
S609，当识别到依赖模块代码中的依赖函数时，得到当前解析的依赖模块标识依赖的依赖模块标识，并返回S606的步骤。当未识别到依赖函数时，执行步骤S610。
当获得依赖模块代码后，通过模块解析工具对依赖模块代码进行解析，判断依赖模块代码中是否存在依赖函数，当识别到依赖模块代码中的依赖函数时，根据依赖函数得到当前解析的依赖模块标识依赖的依赖模块标识。也就是说，对依赖模块代码进行解析，进一步判断当前依赖模块是否也存在依赖的依赖模块，通过层层解析来获得主模块直接依赖或间接依赖的所有依赖模块。
S610，判断当前环境是否为生产环境。
S611，当当前环境为生产环境时，将主模块代码以及依赖模块代码按照依赖关系存储至全局代码文件，并将入口函数存储至全局代码文件的底部。
S612，获取全局代码文件的路径信息。
具体地，当当前环境为生产环境时，将主模块代码以及依赖模块代码按照依赖关系的先后顺序存储至全局代码文件，并将入口函数存储至全局代码文件的底部，同时将全局代码文件上传至服务器进行保存，并获得全局代码文件的路径信息。
S613，生成携带有全局代码文件的路径信息的路径标签。
具体地，根据预设的路径标签格式，将全局代码文件的路径信息设置为路径标签的属性，生成对应的路径标签。比如，路径标签采用script标签的形式，将script标签的属性设置全局代码文件的文件名。
S614，当当前环境为测试环境时，获取主模块代码的路径信息、依赖模块代码的路径信息和入口函数的路径信息。
S615，分别生成携带有主模块代码的路径信息的路径标签、携带有依赖模块代码的路径信息的路径标签和携带有入口函数的路径信息的路径标签。
当当前环境为测试环境时，则获取主模块代码的路径信息，生成携带有主模块代码的路径信息的路径标签；获取各依赖模块代码的路径信息，分别生成携带有各依赖模块代码的路径信息的路径标签；获取入口函数的路径信息，生成携带有入口函数的路径信息的路径标签。在本实施例中，针对任一个模块代码，均生成一个对应的路径标签，便于在测试过程时，针对各模块代码分别进行调试。
S616，将路径标签、定义函数的标准定义和依赖函数的标准定义添加至页面片段。
S617，将页面片段添加至页面文件。
在本实施例中，入口函数为页面文件中页面片段所调用模块的入口函数，在生成路径标签后，将路径标签、定义函数的标准定义和依赖函数的标准定义，添加至服务器中该入口函数对应的页面片段中，并将该页面片段添加至服务器中对应的页面文件中。
通过由管理平台对定义的入口函数进行模块解析，得到主模块代码及其存在依赖关系的依赖模块代码。在生产环境时，将主模块代码、依赖模块代码以及入口函数融合至一个全局代码文件中，并生成全局代码文件对应的路径标签；或者，在测试环境中，分别生成依赖模块代码、主模块代码和入口函数对应的路径标签。使得在浏览器端直接根据路径标签获取对应代码，并直接进行执行，无需进行模块解析，节约了模块解析时间，进而提高了浏览器解析并加载页面的效率，避免了因长时间模块解析造成的页面“假死”状态，以及因解析失败而导致的入口回调无法执行、页面无法操作的问题。
图6为一个实施例中javascript模块加载的预处理方法的流程示意图。应该理解的是，虽然图6的流程图中的各个步骤按照箭头的指示依次显示，但是这些步骤并不是必然按照箭头指示的顺序依次执行。除非本文中有明确的说明，这些步骤的执行并没有严格的顺序限制，这些步骤可以以其它的顺序执行。而且，图6中的至少一部分步骤可以包括多个子步骤或者多个阶段，这些子步骤或者阶段并不必然是在同一时刻执行完成，而是可以在不同的时刻执行，这些子步骤或者阶段的执行顺序也不必然是依次进行，而是可以与其它步骤或者其它步骤的子步骤或者阶段的至少一部分轮流或者交替地执行。
在一实施例中，提供一种javascript模块加载装置，如图7所示，该装置包括：页面接收模块702、页面解析模块704、加载请求模块706、代码接收模块708和执行模块710。其中：
页面接收模块702，用于接收服务器根据页面加载请求返回的页面文件。
具体地，浏览器端根据用户输入网址，向服务器发送页面加载请求，服务器接收到页面加载请求后响应该请求，并向浏览器端返回一个页面文件，浏览器端的页面接收模块702接收服务器返回的页面文件。
页面解析模块704，用于解析所述页面文件。
页面解析模块704通过渲染引擎从上至下解析页面文件，根据页面文件生成DOM(Document Object Model，文档对象模型)树。基于DOM树进一步创建渲染树，最终根据渲染树计算各节点在屏幕中的位置并进行绘制，生成显示页面。
加载请求模块706，用于当解析到所述页面文件中的路径标签时，根据所述路径标签，向服务器发送模块加载请求；所述模块加载请求用于指示由服务器根据所述路径标签，获取入口函数、主模块代码和与所述主模块代码存在依赖关系的依赖模块代码。
具体地，当解析到页面文件中的路径标签时，加载请求模块706根据路径标签，生成携带有路径标签中路径信息的模块加载请求，并向服务器发送模块加载请求。服务器接收到模块加载请求后，按照模块加载请求中的路径信息，获取对应路径存储的入口函数、主模块代码和与主模块代码存在依赖关系的依赖模块代码，并返回至发送请求的浏览器端。
代码接收模块708，用于接收所述服务器返回的所述依赖模块代码、所述主模块代码和入口函数。
执行模块710，用于执行所述依赖模块代码、所述主模块代码和所述入口函数。
代码接收模块708接收依赖模块代码、主模块代码和入口函数，执行模块710按照依赖关系依次执行各依赖模块代码、主模块代码，在执行完主模块代码之后，再执行入口函数中的入口回调函数，从而实现调用主模块的功能。
上述javascript模块加载装置，接收服务器根据页面加载请求返回的页面文件，解析页面文件，当解析到页面文件中的路径标签时，根据路径标签，向服务器发送的模块加载请求，由服务器根据路径标签，获取对应的入口函数、主模块代码和与主模块代码存在依赖关系的依赖模块代码并返回。当接收到依赖模块代码、主模块代码和入口函数后，直接执行依赖模块代码、主模块代码和入口回调。该模块加载方法仅需要根据路径标签获取主模块代码和依赖模块代码并执行，继而执行入口回调即可，节约了模块解析时间，进而提高了浏览器解析并加载页面的效率，避免了因模块解析造成的页面白屏。
在一实施例中，路径标签为全局代码文件的路径标签，全局代码文件为包含入口函数，以及解析入口函数解析得到的、且按照依赖关系存储的主模块代码和依赖模块代码的一体化文件。执行模块710还用于按照所述依赖关系依次执行各所述依赖模块代码和所述主模块代码；当所有所述依赖模块代码和所述主模块代码执行完成后，执行所述入口函数。
在一实施例中，提供一种javascript模块加载的预处理装置，如图8所示，该装置包括：入口函数获取模块802、入口函数解析模块804、标签生成模块806和添加模块808。其中：
入口函数获取模块802，用于获取对页面文件所调用模块定义的入口函数。
入口函数解析模块804，用于调用模块解析工具，解析所述入口函数，获取主模块代码以及与所述主模块代码存在依赖关系的依赖模块代码。
具体地，入口函数解析模块804调用模块解析工具，解析入口函数，获取主模块代码，并主模块代码进行解析，得到主模块存在依赖关系的依赖模块代码，进一步解析依赖模块代码，当依赖模块进一步依赖其他的依赖模块，进一步获取其他的依赖模块代码，通过层层解析，得到主模块直接依赖或者间接依赖的所有依赖模块代码。
标签生成模块806，用于根据所述主模块代码、所述依赖模块代码以及所述入口函数，生成对应的路径标签。
具体地，标签生成模块806获取主模块代码、依赖模块代码以及入口函数对应的路径信息，根据预设的路径标签格式，将路径信息设置为路径标签的属性，生成对应的路径标签。
添加模块808，用于将所述路径标签添加至所述页面文件。
添加模块808将路径标签添加至服务器中该入口函数对应的页面文件中，使得在解析该页面文件时，直接根据路径标签获取对应路径中存储的代码并执行。
上述javascript模块加载的预处理装置，通过预先对定义的入口函数进行解析，得到所需要调用的主模块代码和与主模块代码存在依赖关系的依赖模块代码，并生成对应的路径标签，使得浏览器解析到页面文件的路径标签时，直接根据路径标签获取对应路径中存储的代码并执行即可，无需通过浏览器对调用模块的入口函数进行层层解析后，才能加载所需要调用的主模块代码和依赖模块代码，减少了浏览器的解析时间，进而提高了解析并加载页面文件的效率。并且，浏览器对入口函数进行解析时，并没有执行javascript主逻辑、页面文件其他内容以及与用户之间的交互操作，造成页面处于“假死”状态，降低了用户体验，而该方法直接加载执行主模块代码和依赖模块代码，避免了页面长期处于“假死”状态。
在一实施例中，如图9所示，入口函数解析模块进一步包括：调用模块901、主代码获取模块902、主代码解析模块903、依赖代码获取模块904、依赖函数识别模块905和依赖标识获取模块906。其中：
调用模块901，用于调用模块解析工具，解析所述入口函数，获得主模块标识。
入口函数中包括主模块名以及入口回调函数，通过调用模块解析工具，解析入口函数，得到入口函数中的主模块标识。
主代码获取模块902，用于根据所述主模块标识，获取主模块代码。具体地，主代码获取模块902根据主模块标识，查找服务器中存储的代码文件，获取服务器中与主模块标识对应的主模块代码。
主代码解析模块903，用于解析所述主模块代码，识别所述主模块代码中的依赖函数，得到所述主模块标识依赖的依赖模块标识。通过模块解析工具对主模块代码进行解析，识别到主模块代码中的依赖函数，根据依赖函数得到主模块标识依赖的依赖模块标识。
依赖代码获取模块904，用于根据所述依赖模块标识，获取依赖模块代码。具体地，根据依赖模块标识，查找服务器中存储的代码文件，获取服务器中与依赖模块标识对应的依赖模块代码。
依赖函数识别模块905，用于解析所述依赖模块代码，识别依赖模块代码中的依赖函数。具体地，通过模块解析工具对依赖模块代码进行解析，识别依赖模块代码中是否存在依赖函数。
依赖标识获取模块906，用于当识别到所述依赖模块代码中的依赖函数时，得到当前解析的所述依赖模块标识依赖的依赖模块标识。
在一实施例中，主代码获取模块902还用于根据主模块标识，获取主模块标识的当前版本信息；根据主模块标识的当前版本信息，获取主模块代码。
主代码获取模块902首先根据主模块标识以及所维护的版本信息，获取主模块标识的当前版本信息，进一步根据主模块标识的当前版本信息，查找服务器中存储的代码文件，获取服务器中与主模块当前版本信息对应的主模块代码。通过按照当前版本信息获取主模块代码，确保所获取的模块代码为经过验证可正常执行的代码。
在本实施例中，依赖代码获取模块904还用于根据依赖模块标识，获取依赖模块标识的当前版本信息；根据依赖模块标识的当前版本信息，获取依赖模块代码。具体地，根据依赖模块标识以及所维护的版本信息，获取依赖模块标识的当前版本信息，进一步根据依赖模块标识的当前版本信息，查找服务器中存储的代码文件，获取服务器中与依赖模块当前版本信息对应的依赖模块代码。
在一实施例中，如图10所示，标签生成模块进一步包括：全局代码生成模块1002、全局路径获取模块1004和全局标签生成模块1006。其中：
全局代码生成模块1002，用于当当前环境为生产环境时，将所述主模块代码以及依赖模块代码按照依赖关系存储至全局代码文件，并将所述入口函数存储至所述全局代码文件的底部。
具体地，检测当前环境的类型，当当前环境为生产环境时，全局代码生成模块1002将主模块代码以及依赖模块代码按照依赖关系的先后顺序存储至全局代码文件，并将入口函数存储至全局代码文件的底部，同时将全局代码文件上传至服务器进行保存。
全局路径获取模块1004，用于获取所述全局代码文件的路径信息。具体地，根据全局代码文件的存储路径，得到全局代码文件的路径信息。
全局标签生成模块1006，用于生成携带有所述全局代码文件的路径信息的路径标签。具体地，根据预设的路径标签格式，将全局代码文件的路径信息设置为路径标签的属性，生成对应的路径标签。比如，路径标签采用script标签的形式，将script标签的属性设置全局代码文件的文件名。
在一实施例中，标签生成模块还用于当当前环境为测试环境时，获取主模块代码的路径信息、依赖模块代码的路径信息和入口函数的路径信息；分别生成携带有主模块代码的路径信息的路径标签、携带有依赖模块代码的路径信息的路径标签和携带有入口函数的路径信息的路径标签。
通过对当前环境的类型进行检测，当当前环境为测试环境时，则获取主模块代码的路径信息，生成携带有主模块代码的路径信息的路径标签；获取各依赖模块代码的路径信息，分别生成携带有各依赖模块代码的路径信息的路径标签；获取入口函数的路径信息，生成携带有入口函数的路径信息的路径标签。在本实施例中，针对任一个模块代码，均生成一个对应的路径标签，便于在测试过程时，针对各模块代码分别进行调试。
在一实施例中，添加模块还用于将路径标签添加至页面片段；将页面片段添加至页面文件。
在本实施例中，入口函数为页面文件中页面片段所调用模块的入口函数，在生成路径标签后，将路径标签添加至服务器中该入口函数对应的页面片段中，并将该页面片段添加至对应的页面文件中。
在另一实施例中，添加模块还用于将定义函数的标准定义和依赖函数的标准定义添加至页面片段。
上述javascript模块加载的预处理装置，通过对定义的入口函数进行模块解析，得到主模块代码及其存在依赖关系的依赖模块代码。在生产环境时，将主模块代码、依赖模块代码以及入口函数融合至一个全局代码文件中，并生成全局代码文件对应的路径标签；或者，在测试环境中，分别生成依赖模块代码、主模块代码和入口函数对应的路径标签。使得在浏览器端直接根据路径标签获取对应代码，并直接进行执行，无需进行模块解析，节约了模块解析时间，进而提高了浏览器解析并加载页面的效率，避免了因长时间模块解析造成的页面“假死”状态，以及因解析失败而导致的入口回调无法执行、页面无法操作的问题。
图11示出了一个实施例中计算机设备的内部结构图。该计算机设备具体可以是图1中的终端110或管理平台130。如图11所示，该计算机设备包括该计算机设备包括通过系统总线连接的处理器、存储器、网络接口、输入装置和显示屏。其中，存储器包括非易失性存储介质和内存储器。该计算机设备的非易失性存储介质存储有操作系统，还可存储有计算机程序，该计算机程序被处理器执行时，可使得处理器实现javascript模块加载方法。该内存储器中也可储存有计算机程序，该计算机程序被处理器执行时，可使得处理器执行javascript模块加载方法。计算机设备的显示屏可以是液晶显示屏或者电子墨水显示屏，计算机设备的输入装置可以是显示屏上覆盖的触摸层，也可以是计算机设备外壳上设置的按键、轨迹球或触控板，还可以是外接的键盘、触控板或鼠标等。
本领域技术人员可以理解，图11中示出的结构，仅仅是与本申请方案相关的部分结构的框图，并不构成对本申请方案所应用于其上的计算机设备的限定，具体的计算机设备可以包括比图中所示更多或更少的部件，或者组合某些部件，或者具有不同的部件布置。
在一个实施例中，本申请提供的javascript模块加载装置和javascript模块加载的预处理装置可以实现为一种计算机程序的形式，计算机程序可在如图11所示的计算机设备上运行。计算机设备的存储器中可存储组成该javascript模块加载装置或javascript模块加载的预处理装置装置的各个程序模块，比如，图7所示的页面接收模块702、页面解析模块704、加载请求模块706、代码接收模块708和执行模块710；又或者图8所示的入口函数获取模块802、入口函数解析模块804、标签生成模块806和添加模块808。各个程序模块构成的计算机程序使得处理器执行本说明书中描述的本申请各个实施例的javascript模块加载方法或javascript模块加载的预处理方法中的步骤。
在一个实施例中，提供了一种计算机设备，包括存储器和处理器，存储器中存储有计算机程序，该处理器执行计算机程序时实现以下步骤：
接收服务器根据页面加载请求返回的页面文件；
解析页面文件；
当解析到页面文件中的路径标签时，根据路径标签，向服务器发送模块加载请求；模块加载请求用于指示由服务器根据路径标签，获取入口函数、主模块代码和与主模块代码存在依赖关系的依赖模块代码；
接收服务器返回的依赖模块代码、主模块代码和入口函数；
执行依赖模块代码、主模块代码和入口函数。
在一个实施例中，处理器执行计算机程序时还实现以下步骤：
按照依赖关系依次执行各依赖模块代码和主模块代码；
当所有依赖模块代码和主模块代码执行完成后，执行入口函数。
在一个实施例中，提供了一种计算机设备，包括存储器和处理器，存储器中存储有计算机程序，该处理器执行计算机程序时实现以下步骤：
获取对页面文件所调用模块定义的入口函数；
调用模块解析工具，解析入口函数，获取主模块代码以及与主模块代码存在依赖关系的依赖模块代码；
根据主模块代码、依赖模块代码以及入口函数，生成对应的路径标签；
将路径标签添加至页面文件。
在一个实施例中，处理器执行计算机程序时还实现以下步骤：
调用模块解析工具，解析入口函数，获得主模块标识；
根据主模块标识，获取主模块代码；
解析主模块代码，识别主模块代码中的依赖函数，得到主模块标识依赖的依赖模块标识；
根据依赖模块标识，获取依赖模块代码；
解析依赖模块代码，识别依赖模块代码中的依赖函数；
当识别到依赖模块代码中的依赖函数时，得到当前解析的依赖模块标识依赖的依赖模块标识，并返回根据依赖模块标识，获取依赖模块代码的步骤。
在一个实施例中，处理器执行计算机程序时还实现以下步骤：
根据主模块标识，获取主模块标识的当前版本信息；
根据主模块标识的当前版本信息，获取主模块代码；
根据依赖模块标识，获取依赖模块标识的当前版本信息；
根据依赖模块标识的当前版本信息，获取依赖模块代码。
在一个实施例中，处理器执行计算机程序时还实现以下步骤：
当当前环境为生产环境时，将主模块代码以及依赖模块代码按照依赖关系存储至全局代码文件，并将入口函数存储至全局代码文件的底部；
获取全局代码文件的路径信息；
生成携带有全局代码文件的路径信息的路径标签。
在一个实施例中，处理器执行计算机程序时还实现以下步骤：
当当前环境为测试环境时，获取主模块代码的路径信息、依赖模块代码的路径信息和入口函数的路径信息；
分别生成携带有主模块代码的路径信息的路径标签、携带有依赖模块代码的路径信息的路径标签和携带有入口函数的路径信息的路径标签。
在一个实施例中，处理器执行计算机程序时还实现以下步骤：
将路径标签添加至页面片段；
将页面片段添加至页面文件。
在一个实施例中，处理器执行计算机程序时还实现以下步骤：
将定义函数的标准定义和依赖函数的标准定义添加至页面片段。
在一个实施例中，提供了一种计算机可读存储介质，其上存储有计算机程序，计算机程序被处理器执行时实现以下步骤：
接收服务器根据页面加载请求返回的页面文件；
解析页面文件；
当解析到页面文件中的路径标签时，根据路径标签，向服务器发送模块加载请求；模块加载请求用于指示由服务器根据路径标签，获取入口函数、主模块代码和与主模块代码存在依赖关系的依赖模块代码；
接收服务器返回的依赖模块代码、主模块代码和入口函数；
执行依赖模块代码、主模块代码和入口函数。
在一个实施例中，计算机程序被处理器执行时还实现以下步骤：
按照依赖关系依次执行各依赖模块代码和主模块代码；
当所有依赖模块代码和主模块代码执行完成后，执行入口函数。
在一个实施例中，提供了一种计算机可读存储介质，其上存储有计算机程序，计算机程序被处理器执行时实现以下步骤：
获取对页面文件所调用模块定义的入口函数；
调用模块解析工具，解析入口函数，获取主模块代码以及与主模块代码存在依赖关系的依赖模块代码；
根据主模块代码、依赖模块代码以及入口函数，生成对应的路径标签；
将路径标签添加至页面文件。
在一个实施例中，计算机程序被处理器执行时还实现以下步骤：
调用模块解析工具，解析入口函数，获得主模块标识；
根据主模块标识，获取主模块代码；
解析主模块代码，识别主模块代码中的依赖函数，得到主模块标识依赖的依赖模块标识；
根据依赖模块标识，获取依赖模块代码；
解析依赖模块代码，识别依赖模块代码中的依赖函数；
当识别到依赖模块代码中的依赖函数时，得到当前解析的依赖模块标识依赖的依赖模块标识，并返回根据依赖模块标识，获取依赖模块代码的步骤。
在一个实施例中，计算机程序被处理器执行时还实现以下步骤：
根据主模块标识，获取主模块标识的当前版本信息；
根据主模块标识的当前版本信息，获取主模块代码；
根据依赖模块标识，获取依赖模块标识的当前版本信息；
根据依赖模块标识的当前版本信息，获取依赖模块代码。
在一个实施例中，计算机程序被处理器执行时还实现以下步骤：
当当前环境为生产环境时，将主模块代码以及依赖模块代码按照依赖关系存储至全局代码文件，并将入口函数存储至全局代码文件的底部；
获取全局代码文件的路径信息；
生成携带有全局代码文件的路径信息的路径标签。
在一个实施例中，计算机程序被处理器执行时还实现以下步骤：
当当前环境为测试环境时，获取主模块代码的路径信息、依赖模块代码的路径信息和入口函数的路径信息；
分别生成携带有主模块代码的路径信息的路径标签、携带有依赖模块代码的路径信息的路径标签和携带有入口函数的路径信息的路径标签。
在一个实施例中，计算机程序被处理器执行时还实现以下步骤：
将路径标签添加至页面片段；
将页面片段添加至页面文件。
在一个实施例中，计算机程序被处理器执行时还实现以下步骤：
将定义函数的标准定义和依赖函数的标准定义添加至页面片段。
本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程，是可以通过计算机程序来指令相关的硬件来完成，所述的程序可存储于一非易失性计算机可读取存储介质中，该程序在执行时，可包括如上述各方法的实施例的流程。其中，本申请所提供的各实施例中所使用的对存储器、存储、数据库或其它介质的任何调用，均可包括非易失性和/或易失性存储器。非易失性存储器可包括只读存储器(ROM)、可编程ROM(PROM)、电可编程ROM(EPROM)、电可擦除可编程ROM(EEPROM)或闪存。易失性存储器可包括随机存取存储器(RAM)或者外部高速缓冲存储器。作为说明而非局限，RAM以多种形式可得，诸如静态RAM(SRAM)、动态RAM(DRAM)、同步DRAM(SDRAM)、双数据率SDRAM(DDRSDRAM)、增强型SDRAM(ESDRAM)、同步链路(Synchlink)DRAM(SLDRAM)、存储器总线(Rambus)直接RAM(RDRAM)、直接存储器总线动态RAM(DRDRAM)、以及存储器总线动态RAM(RDRAM)等。
以上实施例的各技术特征可以进行任意的组合，为使描述简洁，未对上述实施例中的各个技术特征所有可能的组合都进行描述，然而，只要这些技术特征的组合不存在矛盾，都应当认为是本说明书记载的范围。
以上所述实施例仅表达了本申请的几种实施方式，其描述较为具体和详细，但并不能因此而理解为对本申请专利范围的限制。应当指出的是，对于本领域的普通技术人员来说，在不脱离本申请构思的前提下，还可以做出若干变形和改进，这些都属于本申请的保护范围。因此，本申请专利的保护范围应以所附权利要求为准。
Claims (20)
1.一种javascript模块加载方法，其特征在于，所述方法包括：
接收服务器根据页面加载请求返回的页面文件；其中，由管理平台预先获取对页面文件所调用模块定义的入口函数；调用模块解析工具，解析所述入口函数，获取主模块代码以及与所述主模块代码存在依赖关系的依赖模块代码；根据所述主模块代码、所述依赖模块代码以及所述入口函数获取对应的路径信息，根据预设的路径标签格式，将所述路径信息设置为路径标签的属性，生成对应的路径标签，将所述路径标签添加至所述页面文件；所述路径标签为全局代码文件的路径标签，用于唯一指向服务器中的文件地址；所述全局代码文件为包含入口函数，以及解析所述入口函数解析得到的、且按照依赖关系存储的主模块代码和依赖模块代码的一体化文件；
解析所述页面文件；
当解析到所述页面文件中的路径标签时，根据所述路径标签，向服务器发送模块加载请求；所述模块加载请求用于指示由服务器根据所述路径标签，获取入口函数、主模块代码和与所述主模块代码存在依赖关系的依赖模块代码；
接收所述服务器返回的所述依赖模块代码、所述主模块代码和入口函数；
执行所述依赖模块代码、所述主模块代码和所述入口函数。
2.根据权利要求1所述的方法，其特征在于，所述执行所述主模块代码、依赖模块代码和所述入口函数，包括：
按照所述依赖关系依次执行各所述依赖模块代码和所述主模块代码；
当所有所述依赖模块代码和所述主模块代码执行完成后，执行所述入口函数。
3.一种javascript模块加载的预处理方法，其特征在于，所述方法包括：
获取对页面文件所调用模块定义的入口函数；
调用模块解析工具，解析所述入口函数，获取主模块代码以及与所述主模块代码存在依赖关系的依赖模块代码；根据所述主模块代码、所述依赖模块代码以及所述入口函数获取对应的路径信息，根据预设的路径标签格式，将所述路径信息设置为路径标签的属性，生成对应的路径标签；所述路径标签为全局代码文件的路径标签，用于唯一指向服务器中的文件地址；所述全局代码文件为包含入口函数，以及解析所述入口函数解析得到的、且按照依赖关系存储的主模块代码和依赖模块代码的一体化文件；
将所述路径标签添加至所述页面文件；其中，当浏览器解析到所述页面文件中的路径标签时，根据所述路径标签，向服务器发送模块加载请求；所述模块加载请求用于指示由服务器根据所述路径标签，获取入口函数、主模块代码和与所述主模块代码存在依赖关系的依赖模块代码；接收所述服务器返回的所述依赖模块代码、所述主模块代码和入口函数，并执行所述依赖模块代码、所述主模块代码和所述入口函数。
4.根据权利要求3所述的方法，其特征在于，所述调用模块解析工具，解析所述入口函数，获得主模块代码以及与所述主模块代码存在依赖关系的依赖模块代码，包括：
调用模块解析工具，解析所述入口函数，获得主模块标识；
根据所述主模块标识，获取主模块代码；
解析所述主模块代码，识别所述主模块代码中的依赖函数，得到所述主模块标识依赖的依赖模块标识；
根据所述依赖模块标识，获取依赖模块代码；
解析所述依赖模块代码，识别依赖模块代码中的依赖函数；
当识别到所述依赖模块代码中的依赖函数时，得到当前解析的所述依赖模块标识依赖的依赖模块标识，并返回所述根据所述依赖模块标识，获取依赖模块代码的步骤。
5.根据权利要求4所述的方法，其特征在于，所述根据所述主模块标识，获取主模块代码，包括：
根据所述主模块标识，获取所述主模块标识的当前版本信息；
根据所述主模块标识的当前版本信息，获取主模块代码；
所述根据所述依赖模块标识，获取依赖模块代码，包括：
根据所述依赖模块标识，获取所述依赖模块标识的当前版本信息；
根据所述依赖模块标识的当前版本信息，获取依赖模块代码。
6.根据权利要求3所述的方法，其特征在于，所述根据所述主模块代码、所述依赖模块代码以及所述入口函数，生成对应的路径标签，包括：
当当前环境为生产环境时，将所述主模块代码以及依赖模块代码按照依赖关系存储至全局代码文件，并将所述入口函数存储至所述全局代码文件的底部；
获取所述全局代码文件的路径信息；
生成携带有所述全局代码文件的路径信息的路径标签。
7.根据权利要求6所述的方法，其特征在于，还包括：
当当前环境为测试环境时，获取所述主模块代码的路径信息、所述依赖模块代码的路径信息和所述入口函数的路径信息；
分别生成携带有所述主模块代码的路径信息的路径标签、携带有所述依赖模块代码的路径信息的路径标签和携带有所述入口函数的路径信息的路径标签。
8.根据权利要求3所述的方法，其特征在于，所述入口函数为所述页面文件中页面片段所调用模块的入口函数，所述将所述路径标签添加至所述页面文件，包括：
将所述路径标签添加至所述页面片段；
将所述页面片段添加至所述页面文件。
9.根据权利要求8所述的方法，其特征在于，还包括：
将定义函数的标准定义和依赖函数的标准定义添加至所述页面片段。
10.一种javascript模块加载装置，其特征在于，所述装置包括：
页面接收模块，用于接收服务器根据页面加载请求返回的页面文件；其中，由管理平台预先获取对页面文件所调用模块定义的入口函数；调用模块解析工具，解析所述入口函数，获取主模块代码以及与所述主模块代码存在依赖关系的依赖模块代码；根据所述主模块代码、所述依赖模块代码以及所述入口函数获取对应的路径信息，根据预设的路径标签格式，将所述路径信息设置为路径标签的属性，生成对应的路径标签，将所述路径标签添加至所述页面文件；所述路径标签为全局代码文件的路径标签，用于唯一指向服务器中的文件地址；所述全局代码文件为包含入口函数，以及解析所述入口函数解析得到的、且按照依赖关系存储的主模块代码和依赖模块代码的一体化文件；
页面解析模块，用于解析所述页面文件；
加载请求模块，用于当解析到所述页面文件中的路径标签时，根据所述路径标签，向服务器发送模块加载请求；所述模块加载请求用于指示由服务器根据所述路径标签，获取入口函数、主模块代码和与所述主模块代码存在依赖关系的依赖模块代码；
代码接收模块，用于接收所述服务器返回的所述依赖模块代码、所述主模块代码和入口函数；
执行模块，用于执行所述依赖模块代码、所述主模块代码和所述入口函数。
11.根据权利要求10所述的装置，其特征在于，所述执行模块，还用于：
按照所述依赖关系依次执行各所述依赖模块代码和所述主模块代码；
当所有所述依赖模块代码和所述主模块代码执行完成后，执行所述入口函数。
12.一种javascript模块加载的预处理装置，其特征在于，所述装置包括：
入口函数获取模块，用于获取对页面文件所调用模块定义的入口函数；
入口函数解析模块，用于调用模块解析工具，解析所述入口函数，获取主模块代码以及与所述主模块代码存在依赖关系的依赖模块代码；
标签生成模块，用于根据所述主模块代码、所述依赖模块代码以及所述入口函数获取对应的路径信息，根据预设的路径标签格式，将所述路径信息设置为路径标签的属性，生成对应的路径标签；所述路径标签为全局代码文件的路径标签，用于唯一指向服务器中的文件地址；所述全局代码文件为包含入口函数，以及解析所述入口函数解析得到的、且按照依赖关系存储的主模块代码和依赖模块代码的一体化文件；
添加模块，用于将所述路径标签添加至所述页面文件；其中，当浏览器解析到所述页面文件中的路径标签时，根据所述路径标签，向服务器发送模块加载请求；所述模块加载请求用于指示由服务器根据所述路径标签，获取入口函数、主模块代码和与所述主模块代码存在依赖关系的依赖模块代码；接收所述服务器返回的所述依赖模块代码、所述主模块代码和入口函数，并执行所述依赖模块代码、所述主模块代码和所述入口函数。
13.根据权利要求12所述的装置，其特征在于，所述入口函数解析模块，包括：
调用模块，用于调用模块解析工具，解析所述入口函数，获得主模块标识；
主代码获取模块，用于根据所述主模块标识，获取主模块代码；
主代码解析模块，用于解析所述主模块代码，识别所述主模块代码中的依赖函数，得到所述主模块标识依赖的依赖模块标识；
依赖代码获取模块，用于根据所述依赖模块标识，获取依赖模块代码；
依赖函数识别模块，用于解析所述依赖模块代码，识别依赖模块代码中的依赖函数；
依赖标识获取模块，用于当识别到所述依赖模块代码中的依赖函数时，得到当前解析的所述依赖模块标识依赖的依赖模块标识。
14.根据权利要求13所述的装置，其特征在于，所述主代码获取模块还用于：根据所述主模块标识，获取所述主模块标识的当前版本信息；根据所述主模块标识的当前版本信息，获取主模块代码；
所述依赖代码获取模块还用于：根据所述依赖模块标识，获取所述依赖模块标识的当前版本信息；根据所述依赖模块标识的当前版本信息，获取依赖模块代码。
15.根据权利要求12所述的装置，其特征在于，标签生成模块还包括：
全局代码生成模块，用于当当前环境为生产环境时，将所述主模块代码以及依赖模块代码按照依赖关系存储至全局代码文件，并将所述入口函数存储至所述全局代码文件的底部；
全局路径获取模块，用于获取所述全局代码文件的路径信息；
全局标签生成模块，用于生成携带有所述全局代码文件的路径信息的路径标签。
16.根据权利要求15所述的装置，其特征在于，所述标签生成模块还用于：
当当前环境为测试环境时，获取所述主模块代码的路径信息、所述依赖模块代码的路径信息和所述入口函数的路径信息；分别生成携带有所述主模块代码的路径信息的路径标签、携带有所述依赖模块代码的路径信息的路径标签和携带有所述入口函数的路径信息的路径标签。
17.根据权利要求12所述的装置，其特征在于，所述添加模块还用于：
将所述路径标签添加至所述页面片段；将所述页面片段添加至所述页面文件。
18.根据权利要求17所述的装置，其特征在于，所述添加模块，还用于：将定义函数的标准定义和依赖函数的标准定义添加至所述页面片段。
19.一种计算机设备，包括存储器和处理器，所述存储器存储有计算机程序，其特征在于，所述处理器执行所述计算机程序时实现权利要求1至9中任一项所述方法的步骤。
20.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现权利要求1至9中任一项所述的方法的步骤。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201810613990.4A CN108804159B (zh) | 2018-06-14 | 2018-06-14 | javascript模块加载方法及其预处理方法、装置和计算机设备 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201810613990.4A CN108804159B (zh) | 2018-06-14 | 2018-06-14 | javascript模块加载方法及其预处理方法、装置和计算机设备 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN108804159A CN108804159A (zh) | 2018-11-13 |
| CN108804159B true CN108804159B (zh) | 2022-02-18 |
Family
ID=64086064
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201810613990.4A Active CN108804159B (zh) | 2018-06-14 | 2018-06-14 | javascript模块加载方法及其预处理方法、装置和计算机设备 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN108804159B (zh) |
Families Citing this family (10)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN109634654A (zh) * | 2018-12-04 | 2019-04-16 | 北京马上慧科技术有限公司 | 一种页面封装方法、装置、系统、计算机设备和存储介质 |
| CN109766099B (zh) * | 2018-12-11 | 2020-07-31 | 浙江口碑网络技术有限公司 | 前端源码编译方法、装置、存储介质及计算机设备 |
| CN110262846A (zh) * | 2019-05-07 | 2019-09-20 | 平安科技（深圳）有限公司 | 基于模块的界面加载方法、系统、计算机设备及存储介质 |
| CN110362792B (zh) * | 2019-07-05 | 2023-05-23 | 五八有限公司 | 将rn文件转换为小程序文件的方法、装置及转换设备 |
| CN112948010B (zh) * | 2019-11-25 | 2023-06-13 | 上海哔哩哔哩科技有限公司 | JavaScript模块化HTML文件前端加载方法 |
| CN113849242A (zh) * | 2020-06-12 | 2021-12-28 | 华为技术有限公司 | 生成、注册ui服务包、以及加载ui服务的方法及装置 |
| CN112181374B (zh) * | 2020-09-25 | 2024-03-12 | 广州力挚网络科技有限公司 | 一种数据整合方法、装置、电子设备及存储介质 |
| CN112445500A (zh) * | 2020-11-30 | 2021-03-05 | 北京达佳互联信息技术有限公司 | 应用程序处理方法、应用程序运行方法及相关设备 |
| CN112882764B (zh) * | 2021-01-20 | 2022-07-22 | 网易（杭州）网络有限公司 | 组件加载方法、装置、计算机设备及存储介质 |
| CN114637548A (zh) * | 2022-02-18 | 2022-06-17 | 高德信息技术有限公司 | 依赖模块的加载方法、装置及计算机程序产品 |
Citations (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103136290A (zh) * | 2011-12-05 | 2013-06-05 | 金蝶软件（中国）有限公司 | 网页脚本文件处理方法及处理装置 |
| CN106547527A (zh) * | 2015-09-22 | 2017-03-29 | 阿里巴巴集团控股有限公司 | 一种JavaScript文件构建方法及装置 |
Family Cites Families (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US8347272B2 (en) * | 2008-07-23 | 2013-01-01 | International Business Machines Corporation | Call graph dependency extraction by static source code analysis |
| US9262138B2 (en) * | 2010-05-27 | 2016-02-16 | Salesforce.Com, Inc. | Adding directives for JavaScript files directly into source code in a multi-tenant database environment |
| US9513885B2 (en) * | 2013-08-22 | 2016-12-06 | Peter Warren | Web application development platform with relationship modeling |
-
2018
- 2018-06-14 CN CN201810613990.4A patent/CN108804159B/zh active Active
Patent Citations (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103136290A (zh) * | 2011-12-05 | 2013-06-05 | 金蝶软件（中国）有限公司 | 网页脚本文件处理方法及处理装置 |
| CN106547527A (zh) * | 2015-09-22 | 2017-03-29 | 阿里巴巴集团控股有限公司 | 一种JavaScript文件构建方法及装置 |
Also Published As
| Publication number | Publication date |
|---|---|
| CN108804159A (zh) | 2018-11-13 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN108804159B (zh) | javascript模块加载方法及其预处理方法、装置和计算机设备 | |
| CN108446116B (zh) | 应用程序页面的生成方法、装置、计算机设备和存储介质 | |
| CN109901834B (zh) | 文档页面生成方法、装置、计算机设备和存储介质 | |
| CN109684607B (zh) | Json数据解析方法、装置、计算机设备和存储介质 | |
| CN110688598B (zh) | 业务参数采集方法、装置、计算机设备和存储介质 | |
| CN110647320A (zh) | 项目框架的构建方法、装置、计算机设备和存储介质 | |
| CN111176996A (zh) | 测试用例生成方法、装置、计算机设备及存储介质 | |
| CN108595697B (zh) | 网页集成方法、装置及系统 | |
| CN109840083B (zh) | 网页组件模板构建方法、装置、计算机设备和存储介质 | |
| CN111310427A (zh) | 业务数据配置处理方法、装置、计算机设备和存储介质 | |
| CN109062925B (zh) | 自动生成insert语句的方法、装置、计算机设备及存储介质 | |
| CN109597618B (zh) | 程序开发方法、装置、计算机设备及存储介质 | |
| CN111367595B (zh) | 数据处理方法、程序运行方法、装置及处理设备 | |
| CN110955608B (zh) | 测试数据处理方法、装置、计算机设备和存储介质 | |
| CN111736811A (zh) | 表单数据校验方法、系统、服务器和用户终端 | |
| CN111431767B (zh) | 多浏览器资源同步方法、装置、计算机设备和存储介质 | |
| CN112035186A (zh) | H5页面的预加载及跳转方法、装置、设备及介质 | |
| CN110309457B (zh) | 网页数据处理方法、装置、计算机设备和存储介质 | |
| CN110020280B (zh) | 应用页面展示方法、装置、存储介质和计算机设备 | |
| CN109542501B (zh) | 浏览器表格兼容方法、装置、计算机设备及存储介质 | |
| CN115599386A (zh) | 代码生成方法、装置、设备及存储介质 | |
| CN110213067B (zh) | 业务请求的跟踪信息处理方法、装置和系统 | |
| CN111901383B (zh) | 数据请求处理方法、装置、计算机设备和存储介质 | |
| CN111552527A (zh) | 用户界面内文字翻译方法、装置、系统及存储介质 | |
| CN115640316A (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 |