CN114661273A

CN114661273A - Front-end construction method and device

Info

Publication number: CN114661273A
Application number: CN202210203871.8A
Authority: CN
Inventors: 朱磊
Original assignee: Wireless Life Hangzhou Information Technology Co ltd
Current assignee: Wireless Life Hangzhou Information Technology Co ltd
Priority date: 2022-03-03
Filing date: 2022-03-03
Publication date: 2022-06-24

Abstract

The invention relates to a front-end construction method and a front-end construction device. The method comprises the following steps: acquiring all JavaScript files in a front-end project and a first source mapping file of the JavaScript files; determining JavaScript files needing to be confused in all JavaScript files according to the configuration of a user; obfuscating the JavaScript file to be obfuscated to obtain an obfuscated code and a second source mapping file; converting the first source mapping file and the second source mapping file into a third source mapping file, so that the third source mapping file maps the obfuscated codes to original codes of the JavaScript file before obfuscation; and packaging the obfuscated code and the third source mapping file to generate a target file for the browser to use. Therefore, the confusion as required is realized, and the performance loss caused by code deep confusion can be greatly reduced.

Description

Front-end construction method and device

Technical Field

The present disclosure relates to the field of front end technologies, and in particular, to a front end construction method and apparatus.

Background

Due to the characteristics of the client browser, the front-end code runs in a transparent environment, any business logic is in a 'naked running' state, and the improvement of the safety of the front-end code is a problem which needs to be considered in the field of web front-end development. In most scenarios, the security of the code can be improved by performing obfuscated compression on the front-end code by using plug-ins of some front-end building tools (such as webpack (a static module packaging tool for JavaScript (client scripting language) application), rolup (a module packaging tool), and the like) such as UglifyJs and terser. However, the promotion is limited, and an attacker still can attack the data through a developer tool of the browser, anti-confusion and other means, which is obviously insufficient in some scenes where data security is particularly important. For such a scenario, the industry also has a tool JavaScript-obfuscator that can deeply obfuscate JavaScript code. Although the tool can carry out deep and thorough code obfuscation, so that browser debugging and anti-obfuscation become extremely difficult, the execution performance of the code is reduced, and the user experience is greatly influenced by large-area use.

At present, the mode of using the javascript-obfuscator in the industry is mainly combined with construction tools such as webpack and the like, and the construction tool inserts of the javascript-obfuscator such as the webpack-obfuscator, rollup-plug-javascript-obfuscator and the like are used for code deep confusion. However, these building tool plug-ins are all obfuscated, and taking webpack-obfuscator as an example, in SPA (Single Page Application), the smallest unit it processes is chunk (webpack terminology), i.e. all code in a Single Page Application is obfuscated. This full obfuscation can greatly increase code size and reduce execution efficiency.

Disclosure of Invention

To overcome the problems in the related art, embodiments of the present disclosure provide a front-end construction method and apparatus. The technical scheme is as follows:

according to a first aspect of embodiments of the present disclosure, there is provided a front-end construction method, including:

acquiring all JavaScript files in a front-end project and a first source mapping file of the JavaScript files;

determining JavaScript files needing to be confused in all JavaScript files according to the configuration of a user;

obfuscating the JavaScript file to be obfuscated to obtain an obfuscated code and a second source mapping file;

converting the first source mapping file and the second source mapping file into a third source mapping file, so that the third source mapping file maps the obfuscated codes to original codes of the JavaScript file before obfuscation;

and packaging the obfuscated code and the third source mapping file to generate a target file for the browser to use.

In an embodiment, acquiring all JavaScript files in the front-end project includes: acquiring all JavaScript files in a front-end project through regular matching;

acquiring a first source mapping file of the JavaScript file, wherein the acquiring comprises the following steps: and extracting the existing source mapping file of the JavaScript file by using the source-map-loader.

In one embodiment, a third party dependency of a source mapping file is transmitted backwards according to the requirement configured by a user, and a source code of the third party dependency and a fourth source mapping file corresponding to the third party dependency are obtained;

and packaging the obfuscated codes, the third source mapping file, the third-party dependent source codes and a fourth source mapping file corresponding to the third-party dependence together to generate a target file for a browser to use.

In an embodiment, the determining, according to the configuration of the user, the JavaScript file that needs to be obfuscated in all JavaScript files includes:

an absolute path of the user-configured JavaScript file that needs to be obfuscated is received.

According to a second aspect of embodiments of the present disclosure, there is provided a front-end building apparatus including:

the system comprises a first acquisition module, a second acquisition module and a third acquisition module, wherein the first acquisition module is used for acquiring all JavaScript files in a front-end project and a first source mapping file of the JavaScript files;

the determining module is used for determining JavaScript files needing to be confused in all JavaScript files according to the configuration of a user;

the obfuscation module is used for obfuscating the JavaScript file to be obfuscated to obtain an obfuscated code and a second source mapping file;

a conversion module, configured to convert the first source mapping file and the second source mapping file into a third source mapping file, so that the third source mapping file maps the obfuscated code to an original code of the JavaScript file before obfuscation;

and the packaging module is used for packaging the obfuscated code and the third source mapping file to generate a target file for the browser to use.

In an embodiment, obtaining the JavaScript file in the front-end project includes: obtaining a JavaScript file in a front-end project through regular matching; acquiring a first source mapping file of the JavaScript file, wherein the acquiring comprises the following steps: and extracting the existing source mapping file of the JavaScript file by using the source-map-loader.

In one embodiment, the apparatus further comprises:

the second acquisition module is used for transmitting the third party dependence of the source mapping file backwards according to the requirement configured by the user, and acquiring the source code of the third party dependence and a fourth source mapping file corresponding to the third party dependence;

and the packaging module is also used for packaging the obfuscated codes, the third source mapping file, the third-party dependent source codes and a fourth source mapping file corresponding to the third-party dependence together to generate a target file for the browser to use.

In one embodiment, the determining module is configured to:

According to a third aspect of an embodiment of the present disclosure, there is provided a front-end building apparatus characterized by including:

a processor;

a memory for storing processor-executable instructions;

wherein the processor is configured to:

According to a fourth aspect of embodiments of the present disclosure, there is provided a computer-readable storage medium having stored thereon computer instructions, characterized in that the instructions, when executed by a processor, implement the steps of the method of any one of the first aspect of the embodiments of the present disclosure.

According to the technical scheme, by obtaining the JS files which need to be confused and are configured by the user, the goal that the webpack module is used as the minimum unit is achieved, a finer-grained obfuscating mode is provided, the user configuration is supported, obfuscation is carried out as required, and performance loss caused by code deep obfuscation can be greatly reduced. In addition, in the process of code obfuscation, the source map mapping problem is considered, the obfuscated code can still be pointed to the original code after multiple conversions, and the local debugging efficiency in development is improved.

It is to be understood that both the foregoing general description and the following detailed description are exemplary and explanatory only and are not restrictive of the disclosure.

Drawings

The accompanying drawings, which are incorporated in and constitute a part of this specification, illustrate embodiments consistent with the present disclosure and together with the description, serve to explain the principles of the disclosure.

FIG. 1 is a flow diagram illustrating a front-end build method according to an exemplary embodiment;

FIG. 2 is a diagram illustrating source map conversion, according to an exemplary embodiment;

FIG. 3 is a flow diagram illustrating a front-end build method according to an exemplary embodiment;

FIG. 4 is a block diagram of a front end build device shown in accordance with an exemplary embodiment;

FIG. 5 is a block diagram of a front end build device shown in accordance with an exemplary embodiment;

FIG. 6 is a block diagram illustrating a front end building apparatus according to an example embodiment.

Detailed Description

Reference will now be made in detail to the exemplary embodiments, examples of which are illustrated in the accompanying drawings. When the following description refers to the accompanying drawings, like numbers in different drawings represent the same or similar elements unless otherwise indicated. The implementations described in the exemplary embodiments below do not represent all implementations consistent with the present disclosure. Rather, they are merely examples of apparatus and methods consistent with certain aspects of the present disclosure, as detailed in the appended claims.

At present, the mode of using the javascript-obfuscator in the industry is mainly combined with construction tools such as webpack and the like, and the construction tool inserts of the javascript-obfuscator such as the webpack-obfuscator, rollup-plug-javascript-obfuscator and the like are used for code deep confusion. However, these building tool plug-ins are all full obfuscations, such as webpack-obfuscator, in SPA applications, all code in a single page application is obfuscated, and this full obfuscation greatly increases the code size and reduces the execution efficiency. Embodiments of the present invention provide a front-end construction method to improve this situation.

An embodiment of the present invention provides a front-end construction method, as shown in fig. 1, including the following steps 101 to 105:

in step 101, all JavaScript files (hereinafter referred to as JS files) in the front-end item and a first source mapping file of the JS files are obtained.

By way of example, the front end items may include, for example, single web applications, websites, and the like. The front-end code runs on the client browser and may include code files such as HTML (hypertext markup language), CSS (cascading style sheet), JS, etc. In the method, important content and private content (such as user information, an encryption algorithm and the like) in the code exist in some JS files, so that in most of scenes, the front end only needs to perform deep obfuscation on some JS files (called modules in webpack) to meet the requirement, rather than full obfuscation in a tangential manner.

The first source mapping file corresponding to the JS file is the existing source mapping file of the JS file. The source map files source maps are data formats, store the position mapping relation between source codes and generated codes, and can be generally used for providing convenience for debugging compressed codes. The JS file may have been transformed (e.g., compressed, merged, compiled from other languages), etc. at the time of generation, and thus, it may already have a source map file. The first source mapping file maps the code of the JS file to the original code of the JS file.

For example, the JS file may be acquired in various suitable manners, which is not limited in the present application. In one embodiment, acquiring a JS file in a front-end item includes: and obtaining the JS file in the front-end project through regular matching. For example, a file suffixed by js is matched by regular matching.

In an embodiment, obtaining the first source mapping file of the JS file includes: and extracting the existing source mapping file of the JS file by applying a source-map-loader.

In step 102, according to the configuration of the user, the JS files needing to be confused in all the acquired JS files are determined.

In one embodiment, the JS file requiring confusion is determined by receiving a path of the JS file requiring confusion configured by a user (developer). The user can configure by entering the absolute path of the JS file that needs to be obfuscated at any suitable time prior to this step. The absolute path of the JS file is used here so that the JS file can be found accurately. The method for confirming the JS file needing to be confused comprises the following steps: when the JavaScript code contains contents with higher security risks, such as user privacy information, an encryption algorithm, core business logic and the like, if the business considers that the contents are exposed and seriously lost, the files can be deeply confused so as to improve the security.

In step 103, the JS file to be obfuscated is obfuscated to obtain an obfuscated code and a second source mapping file.

For example, in one embodiment, an open-source javascript-obfuscator plug-in may be invoked to obfuscate the JS file. And obtaining a second source mapping file after the obfuscation, wherein the second source mapping file maps the obfuscated codes to the codes of the JS file.

In step 104, the first source mapping file and the second source mapping file are converted into a third source mapping file, so that the third source mapping file maps the obfuscated code to the original code of the JS file before obfuscation.

As shown in fig. 2, the Original Code (Original Code) is converted into Generated Code (Generated Code), and a corresponding first source mapping file for mapping the Generated Code to the Original Code is Generated. The generated Code is converted into Obfuscated Code (Obfuscated Code), and a corresponding second source mapping file is generated, the first source mapping file being used to map the Obfuscated Code to the generated Code. Converting the first source mapping file and the second source mapping file into a new third source mapping file may enable the obfuscated code to be directly mapped to the original code through the third source mapping file.

By way of example, source maps 1 and 2 may be translated into new source maps 3 using a multi-stage-source map (a multi-level source mapping process plug-in).

This step can avoid the problem that the source mapping cannot point to the original code during multiple translations.

In step 105, the obfuscated code and the third source mapping file are packaged to generate a target file for the browser to use.

For example, the front-end building tool webpack may be utilized for packaging to generate a target file for use by a browser.

In the technical scheme provided by the embodiment of the invention, the JS files which need to be confused and are configured by the user are obtained, so that a finer-grained confusion mode is realized by taking the webpack module as the minimum unit, the user configuration is supported, confusion is carried out as required, and the performance loss caused by code deep confusion can be greatly reduced. In addition, in the process of code obfuscation, the source map mapping problem is considered, the obfuscated code can still be kept to point to the original code after multiple conversions, and the local debugging efficiency in development is improved.

In specific implementation, the steps 1 to 4 provided by the invention can be implemented as a plug-in of webpack. During packaging (packaging, namely building, which is a general term and refers to a general term for all things done by converting development-time code into runtime code, including but not limited to translation, compression, obfuscation, content replacement, style processing, picture processing, and the like), the webpack is called, the webpack transmits JS file content processed by other plug-ins or processes to the plug-in as input, the plug-in transmits processed content to the webpack after obfuscating the input content, and the webpack transmits the content to the next plug-in for processing or subsequent processes.

In one embodiment, the method further comprises step a:

and step A, transmitting the third party dependence of the source mapping file backwards according to the requirement configured by the user, and acquiring the source code of the third party dependence and a fourth source mapping file corresponding to the third party dependence.

In this step, the third party dependent name that needs to be passed back to the source mapping file may be configured by the developer, so that the source code and the source mapping file that the third party depends on may be obtained according to the name.

In packaging the generated target file, step 105 may be performed as:

and packaging the obfuscated codes and the third source mapping file and the third-party dependent source codes and the fourth source mapping file together to generate a target file for the browser to use.

The embodiment can support the source maps which are depended by the third party to be transmitted to the front-end construction tool webpack, and can ensure that the source maps which are depended by the third party cannot be lost.

The implementation process is described in detail by the following embodiments.

FIG. 3 is a schematic flow chart diagram illustrating a front-end construction method in accordance with an exemplary embodiment. As shown in fig. 3, the method comprises the following steps:

in step 301, the canonical matches are made to all JS files in the webpack construction process.

In step 302, source-map-loader is preferentially applied to the matched JS file, the existing source maps of the JS file are extracted and transmitted to webpack, and therefore the webpack can maintain source map data in a cross-library and continuous mode.

In step 303, the JS file path that needs to be obfuscated (absolute path) and the third party dependent name that needs to pass source map backward are configured.

This step can be done by the user at any time.

In step 304, the third party dependencies configured in step 303 are matched according to the dependency name, and then the dependent source code and source maps are passed to webpack.

This step can solve the problem that third party dependent source maps are lost during multiple loader processing.

In step 305, according to the JS file which needs to be obfuscated and is configured in the file path matching step 303, the javascript-obfuscator is invoked to obfuscate the JS file, and an obfuscated code and source maps are obtained.

In step 306, the source maps extracted in step 302 and the source maps generated in step 305 are translated into new source maps using multi-stage-source maps, which map the code generated in step 305 to the original code pointed to by the source maps in step 302.

In step 307, the code generated in step 305 and the source maps generated in step 306 are passed to the webpack.

Subsequent webpack can package the code and source maps obtained in

steps

304 and 307 to generate a target file for the browser to use. Or the webpack can pack the codes and source maps obtained in step 304 and step 307 and other files that need to be packed (such as un-obfuscated files) to generate an object file for the browser to use, and the technique of webpack is in the prior art and will not be described in detail herein.

According to the technical scheme provided by the embodiment of the disclosure, by acquiring the JS file which needs to be obfuscated and is configured by the user, a webpack module is taken as a minimum unit, a finer-grained obfuscating mode is provided, the user configuration is supported, obfuscation is performed as required, and performance loss caused by code deep obfuscation can be greatly reduced. In addition, in the process of code obfuscation, the source map mapping problem is considered, obfuscated codes can still be kept to point to original codes after multiple conversions, local debugging efficiency during development is improved, source maps which a third party depends on are transmitted to webpack, and the source maps which the third party depends on can be prevented from being lost.

The following are embodiments of the disclosed apparatus that may be used to perform embodiments of the disclosed methods.

Fig. 4 is a block diagram of a front-end building apparatus according to an exemplary embodiment, where the front-end building apparatus may be a server or a part of a server, or may also be a terminal or a part of a terminal, and the front-end building apparatus may be implemented as part of or all of an electronic device through software, hardware, or a combination of the two. As shown in fig. 4, the front-end building apparatus includes:

the first obtaining module 401 is configured to obtain all JavaScript files in the front-end project and a first source mapping file of the JavaScript files;

a determining module 402, configured to determine, according to the configuration of the user, JavaScript files that need to be obfuscated from all JavaScript files;

an obfuscating module 403, configured to obfuscate the javascript file to be obfuscated, to obtain an obfuscated code and a second source mapping file;

a conversion module 404, configured to convert the first source mapping file and the second source mapping file into a third source mapping file, so that the third source mapping file maps the obfuscated code to an original code of the JavaScript file before obfuscation;

and a packaging module 405, configured to package the obfuscated code and the third source mapping file to generate a target file for the browser to use.

In an embodiment, obtaining the JavaScript file in the front-end project includes: acquiring a JavaScript file in a front-end project through regular matching; acquiring a first source mapping file of the JavaScript file, wherein the acquiring comprises the following steps: and extracting the existing source mapping file of the JavaScript file by using the source-map-loader.

In one embodiment, the apparatus further comprises:

the second acquisition module is used for transmitting the third party dependence of the source mapping file backwards according to the requirement configured by the user, and acquiring the source code of the third party dependence and a fourth source mapping file;

and the packaging module is also used for packaging the obfuscated codes, the third source mapping file, the third party dependent source codes and the fourth source mapping file together to generate a target file for the browser to use.

In one embodiment, the determining module is configured to:

receiving an absolute path of the JavaScript file which needs to be confused and is configured by a user.

The embodiment of the disclosure provides a front-end building device, which achieves a mode of confusion with webpack module as the minimum unit and finer granularity by acquiring a JS file which needs to be confused and is configured by a user, supports user configuration, obfuscates as needed, and can greatly reduce performance loss caused by code deep obfuscation. In addition, in the process of code obfuscation, the source map mapping problem is considered, the obfuscated code can still be pointed to the original code after multiple conversions, and the local debugging efficiency in development is improved.

Fig. 5 is a block diagram of a front-end building apparatus 50 according to an exemplary embodiment, where the front-end building apparatus may be a server or a part of a server, or may be a terminal or a part of a terminal, and the front-end building apparatus includes:

a processor 501;

a memory 502 for storing instructions executable by the processor 501;

wherein the processor 501 is configured to:

and packaging the obfuscated code and the third source mapping file to generate a target file for a browser to use.

and packaging the obfuscated codes and the third source mapping file together with the source codes of the third-party dependence and a fourth source mapping file corresponding to the third-party dependence to generate a target file for the browser to use.

Fig. 6 is a block diagram illustrating an apparatus 600 for front end construction according to an exemplary embodiment, which may be a mobile phone, a computer, a digital broadcast terminal, a messaging device, a game console, a tablet device, a medical device, an exercise device, a personal digital assistant, and the like.

The apparatus may include one or more of the following components: processing component 602, memory 604, power component 606, multimedia component 608, audio component 610, input/output (I/O) interface 612, sensor component 614, and communication component 616.

The processing component 602 generally controls overall operation of the device 600, such as operations associated with display, telephone calls, data communications, camera operations, and recording operations. The processing elements 502 may include one or more processors 620 to execute instructions to perform all or a portion of the steps of the methods described above. Further, the processing component 602 can include one or more modules that facilitate interaction between the processing component 602 and other components. For example, the processing component 602 can include a multimedia module to facilitate interaction between the multimedia component 508 and the processing component 602.

The memory 604 is configured to store no various types of data to support operations at the apparatus 600. Examples of such data include instructions for any application or method operating on device 600, contact data, phonebook data, messages, pictures, videos, and so forth. The memory 604 may be implemented by any type or combination of volatile or non-volatile memory devices such as Static Random Access Memory (SRAM), electrically erasable programmable read-only memory (EEPROM), erasable programmable read-only memory (EPROM), programmable read-only memory (PROM), read-only memory (ROM), magnetic memory, flash memory, magnetic or optical disks.

Power supply component 606 provides power to the various components of device 600. The power components 606 may include a power management system, one or more power supplies, and other components associated with generating, managing, and distributing power for the apparatus 600.

The multimedia component 608 includes a screen that provides an output interface between the device 600 and the user. In some embodiments, the screen may include a Liquid Crystal Display (LCD) and a Touch Panel (TP). If the screen includes a touch panel, the screen may be implemented as a touch screen to receive an input signal from a user. The touch panel includes one or more touch sensors to sense touch, slide, and gestures on the touch panel. The touch sensor may not only sense the boundary of a touch or slide action, but also detect the duration and pressure associated with the touch or slide operation. In some embodiments, the multimedia component 608 includes a front facing camera and/or a rear facing camera. The front camera and/or the rear camera may receive external multimedia data when the device 600 is in an operating mode, such as a shooting mode or a video mode. Each front camera and rear camera may be a fixed optical lens system or have a focal length and optical zoom capability.

The audio component 610 is configured to output and/or input audio signals. For example, audio component 610 includes a Microphone (MIC) configured to receive external audio signals when apparatus 600 is in an operational mode, such as a call mode, a recording mode, and a voice recognition mode. The received audio signal may further be stored in the memory 604 or transmitted via the communication component 616. In some embodiments, audio component 610 further includes a speaker for outputting audio signals.

The I/O interface 612 provides an interface between the processing component 602 and peripheral interface modules, which may be keyboards, click wheels, buttons, etc. These buttons may include, but are not limited to: a home button, a volume button, a start button, and a lock button.

The sensor component 614 includes one or more sensors for providing status assessment of various aspects of the apparatus 600. For example, the sensor component 614 may detect an open/closed state of the device 600, the relative positioning of components, such as a display and keypad of the device 600, the sensor component 614 may also detect a change in position of the device 600 or a component of the device 600, the presence or absence of user contact with the device 600, orientation or acceleration/deceleration of the device 600, and a change in temperature of the device 600. The sensor assembly 614 may include a proximity sensor configured to detect the presence of a nearby object without any physical contact. The sensor assembly 614 may also include a light sensor, such as a CMOS or CCD image sensor, for use in imaging applications. In some embodiments, the sensor assembly 514 may also include an acceleration sensor, a gyroscope sensor, a magnetic sensor, a pressure sensor, or a temperature sensor.

The communication component 616 is configured to facilitate communications between the apparatus 600 and other devices in a wired or wireless manner. The apparatus 600 may access a wireless network based on a communication standard, such as a walkie-talkie private network, WiFi, 2G, 3G, 4G, or 5G, or a combination thereof. In an exemplary embodiment, the communication component 616 receives broadcast signals or broadcast related information from an external broadcast management system via a broadcast channel. In an exemplary embodiment, the communication component 616 further includes a Near Field Communication (NFC) module to facilitate short-range communications. For example, the NFC module may be implemented based on Radio Frequency Identification (RFID) technology, infrared data association (IrDA) technology, Ultra Wideband (UWB) technology, Bluetooth (BT) technology, and other technologies.

In an exemplary embodiment, the apparatus 600 may be implemented by one or more Application Specific Integrated Circuits (ASICs), Digital Signal Processors (DSPs), Digital Signal Processing Devices (DSPDs), Programmable Logic Devices (PLDs), Field Programmable Gate Arrays (FPGAs), controllers, micro-controllers, microprocessors or other electronic components for performing the above-described methods.

In an exemplary embodiment, a non-transitory computer readable storage medium comprising instructions, such as the memory 604 comprising instructions, executable by the processor 620 of the apparatus 600 to perform the above-described method is also provided. For example, the non-transitory computer readable storage medium may be a ROM, a Random Access Memory (RAM), a CD-ROM, a magnetic tape, a floppy disk, an optical data storage device, and the like.

A non-transitory computer readable storage medium, wherein instructions, when executed by a processor of the apparatus 600, enable the apparatus 600 to perform the above-described front-end construction method, the method comprising:

In one embodiment, a third party dependency of a source mapping file is transmitted backwards according to the requirement configured by a user, and a source code and a fourth source mapping file of the third party dependency are obtained;

and packaging the obfuscated codes and the third source mapping file and the third party dependent source codes and the fourth source mapping file together to generate a target file for the browser to use.

Other embodiments of the disclosure will be apparent to those skilled in the art from consideration of the specification and practice of the disclosure disclosed herein. This application is intended to cover any variations, uses, or adaptations of the disclosure following, in general, the principles of the disclosure and including such departures from the present disclosure as come within known or customary practice within the art to which the disclosure pertains. It is intended that the specification and examples be considered as exemplary only, with a true scope and spirit of the disclosure being indicated by the following claims.

It will be understood that the present disclosure is not limited to the precise arrangements described above and shown in the drawings and that various modifications and changes may be made without departing from the scope thereof. The scope of the present disclosure is limited only by the appended claims.

Claims

1. A front-end construction method, comprising:

2. The method of claim 1,

acquiring all JavaScript files in a front-end project, including: acquiring all JavaScript files in a front-end project through regular matching;

3. The method of claim 1, further comprising:

according to the third party dependence of the source mapping file which is configured by the user and needs to be transmitted backwards, the source code of the third party dependence and a fourth source mapping file corresponding to the third party dependence are obtained;

4. The method according to claim 1, wherein the determining, according to the configuration of the user, the JavaScript file that needs to be obfuscated includes:

5. A front-end construction apparatus, comprising:

6. The apparatus of claim 5,

7. The apparatus of claim 5, further comprising:

8. The apparatus of claim 5, wherein the determining module is configured to:

9. A front-end construction apparatus, comprising:

a processor;

a memory for storing processor-executable instructions;

wherein the processor is configured to:

10. A computer-readable storage medium having stored thereon computer instructions, which when executed by a processor, perform the steps of the method of any one of claims 1 to 4.