Shulou(Shulou.com)06/03 Report--

What are the steps to protect JavaScript? in view of this question, this article introduces in detail the corresponding analysis and answers, hoping to help more partners who want to solve this problem to find a more simple and feasible way.

Text

Today, the use of JavaScript is everywhere. It runs on your browser and backend.

In addition, JavaScript is an ecosystem that is highly dependent on third-party libraries. Therefore, ensuring the security of JavaScript requires following best practices to reduce attacks. But how do we keep JavaScript applications secure? Let's find out.

1. Integrity check of JavaScript

As a front-end developer, you may have used * *

* * tag to import third-party libraries. Have you ever thought about the security risks of doing this? What if a third-party resource is tampered with? Yes, these things can happen when you render external resources on your website. As a result, your website may face a security vulnerability. As a security measure, you can add an integrity (also known as subresource integrity-SRI) code to your script, as shown below.

The integrity property allows the browser to check the acquired script to ensure that if the source is tampered with, the code will never be loaded.

Note: still make sure that the code you originally referenced does not contain any vulnerabilities.

two。 Regularly test NPM for vulnerabilities

I hope you all know that we can use the npm audit command to detect vulnerabilities in all installed dependencies. It provides vulnerability reports and fixes for them.

But how often do you do it?

Unless we automate it, these loopholes will pile up and make them difficult to fix. Remember, some of them may even be critical, allowing serious vulnerabilities. As a solution, you can run NPM for each pull request in your CI to identify vulnerabilities. Therefore, you can prevent any loopholes from going unnoticed.

NPM audit security report example

However, there are some vulnerabilities that require manual intervention by developers.

An additional measure of GitHub

Recently, GitHub launched a robot called Dependabot, which automatically scans NPM dependencies and informs you of the risks via email.

One such email I have gotten for one of my projects

3. Keep minor and patched versions updated

Have you seen any ^ or ~ symbols in front of the NPM package version?

These symbols represent automatic version upgrades to minor and patch versions (depending on the symbol). Technically, both minor and patch versions are backward compatible, reducing the risk of introducing errors into the application.

Since most hotfix vulnerabilities released by third-party libraries are bumps in the patch version, at least enabling automatic patch updates can help reduce security risks.

4. Have verification function to avoid virus injection

As a rule of thumb, we should not rely solely on client-side authentication, because attackers can change them as needed. However, by validating each input, some JavaScript injection can be omitted.

For example, if you enter something with quotation marks in the comment area

These quotation marks will be replaced with double quotation marks

>. Then the entered JavaScript code will not be executed. This is called cross-site scripting (XSS).

Similarly, there are other common ways to do JavaScript injection:

Use the developer's console to insert or change the JavaScript.

Enter "_ javascript:SCRIPT" in the address bar.

Preventing JS injection is important to keep your application secure.

As I mentioned earlier, where there is validation is one way to prevent it.

For example, before saving any input to the database, use the

; replace all >.

Content Security Policy (CSP) is another way to avoid malicious injection. Using CSP is very straightforward, as shown below.

Content-Security-Policy: trusted-types; Content-Security-Policy: trusted-types' none'; Content-Security-Policy: trusted-types; Content-Security-Policy: trusted-types' allow-duplicates'

For more information about CSP, please refer to these guides.

Https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP

5. Always keep strict mode on

Turning on strict mode will restrict you from writing unsafe code.

In addition, it is easy to enable this mode. It's as simple as adding the following line to your JavaScript file.

Use strict

When strict mode is turned on:

It throws mistakes for some mistakes that have been kept silent before.

Fixed a bug that made it difficult for the JavaScript engine to optimize.

The use of reserved words that may be defined in a future version of ECMAScript is prohibited.

An error is thrown when taking an "unsafe" action, such as gaining access to a global object.

For years, every modern browser has supported strict mode. If the browser does not support strict mode, the expression is simply ignored.

6. Lint Your Code

Linters does a static analysis of your code base. It helps to establish quality and avoid common pitfalls.

As quality and safety complement each other, inspection helps to reduce safety risks.

Several popular tools we use for JavaScript are as follows:

JSLint

JSHint

ESLint

In addition, tools like SonarCloud can also be used to identify code smells and known security vulnerabilities. A Sonar report will look like this.

Note: as you can see in the figure above, it has a security section that shows vulnerabilities and security hotspots.

7. Simplify and beautify your code

Attackers will usually try to understand your code in a way that invades them.

Therefore, having a readable source code in a production build increases aggression. As a common practice, if you minimize and vilify your JavaScript code, it's hard to exploit vulnerabilities in the code you write.

However, if you want to take extreme measures to hide your code from users / customers, it should be saved on the server side and need not be sent to the browser at all.

It is important to pay attention to security, especially in JavaScript applications, to make your application secure.

In addition, if you are looking for an advanced solution. In this case, there are tools such as Snyk and WhiteSource that specifically scan for vulnerabilities in your code and automate them through continuous integration.

The answers to the questions about the steps of protecting JavaScript are shared here. I hope the above content can be of some help to you. If you still have a lot of doubts to be solved, you can follow the industry information channel for more related knowledge.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.