Summary of common cross-domain configurations

1. Instructions on disabling https by Google

Note: For security reasons, individual browsers automatically convert the http request protocol into the https protocol specification.
Solution: You need to make Google Chrome disable HTTPS.
Command: chrome://net-internals/#hsts
Insert picture description here

2. Open suffix type matching instructions

2.1. Business description

Note: When the user visits index.html, they will find the index.html page in the webapp directory. If there are more product information in the future, it will inevitably prepare xxxx.html/ for multiple products. This workload is too large.
Optimization: Intercept the user's request, turn to the specified template page, and then realize the data filling.
Insert picture description here

2.2. Edit configuration class

Note: By default, springMVC can only intercept prefix requests such as /index. If you visit /index.html, you are accessing a specific page. So you need to let springMVC intercept suffix requests. Realize the jump of the product list.
Insert picture description here

2.3. How search engines work

Note: Generally, search engines only record static pages at the end of .html. After the search engine records, if the user finds information through retrieval, the search engine will push the website to the user, increasing the exposure of the website!

Core mechanism: inverted index
Insert picture description here

2.4. Pseudo-static description

Pseudo-static is relatively real static. Usually, in order to enhance the friendliness of search engines, we generate static pages of article content, but some friends want to display some information in real time. Or you want to use dynamic scripts to solve some problems. You cannot use static methods to display website content. But this loses the friendliness of search engines. How to find an intermediate method between the two? This produces pseudo-static technology. Pseudo-static technology means that the display is in the form of static pages such as html, but it is actually processed by dynamic scripts such as ASP.
Summary: The technology of dynamic pages ending in .html

3. Cross-domain implementation

3.1.JSONP method

3.1.1 JSONP description

JSONP (JSON with Padding) is a "use mode" of JSON, which can be used to solve the problem of cross-domain data access in mainstream browsers. Due to the same-origin policy, generally speaking, web pages located at server1.example.com cannot communicate with servers other than server1.example.com, and HTML pages

3.1.2 JSONP principle description

Steps:
1). Use the src attribute in javaScript to achieve remote data acquisition. The acquired data is a JS object and the browser is responsible for parsing the JS.

<script type="text/javascript" src="http://manage.jt.com/test.json"></script>

2).自定义回调函数.
	<script type="text/javascript">
	/*JS是解释执行的语言  */
	/*定义回调函数  */
	function hello(data){
     
     
		alert(data.name);
	}
	</script>
3).将返回值结果,经过特殊的格式封装.

3.1.3 JSONP optimization

1). The function name should be dynamically passed in the past.
2). Can the regular ajax be used to implement JSONP calls.
3). Can a callback function be dynamically generated.

3.1.4 JSONP implementation entry case

Insert picture description here

3.1.5. Edit JSONPController

Description: Define JSONPController in JT-MANAGE Insert picture description here

3.1.5 JSONP Advanced API (2)

Insert picture description here

3.2. Cross-domain implementation-CORS method

3.2.1. Introduction to CORS

Cross-origin resource sharing (English: Cross-origin resource sharing, abbreviation: CORS) is a mechanism used to allow restricted resources of a web page to be accessed by pages of other domain names. (Implement cross-domain), CORS allows cross-domain URLs by identifying in the response header. Later, the same-origin policy is based on security specifications to release a cross-domain access method.
Note: It is necessary to add a logo that allows access to the server. can.

Through this mechanism, pages can freely use images, styles, scripts, iframes, and videos from different sources (English: cross-origin). Some cross-domain requests (especially Ajax) are often prohibited by the same-origin policy (English: Same-origin policy). Cross-origin resource sharing defines a way for browsers and servers to mutually confirm whether they are sufficiently secure to use cross-origin requests (English: cross-origin requests). This will be more free and functional than a pure same-origin request, but more secure than a pure cross-origin request.
Cross-domain resource sharing is a specification of browser technology, which provides a method for Web services to send sandbox scripts from different domains to avoid the browser's same-origin policy

3.2.2 Edit CORS configuration class

@Configuration
public class CORSConfig implements WebMvcConfigurer {
    
    

    /**
     *   添加资源共享的策略
     *   参数说明:
     *      1.addMapping()  什么样的请求允许跨域
     *      2.allowedOrigins()  设定允许访问的网址
     *      3.allowCredentials() 是否允许携带cookie
     *
     */
    @Override
    public void addCorsMappings(CorsRegistry registry) {
    
    
        registry.addMapping("/**")
                .allowedOrigins("*")
                //如果设置true时,则必须设定允许访问的网址,不可以用*号标识.
                .allowCredentials(false);
                //.maxAge()       30分钟
                //.allowedMethods("*")  GET POST  HEAD
    }
}

3.2.3 Page effect access

Insert picture description here