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

This article mainly introduces "how to build the front and back end cross-domain delivery cookie environment". In the daily operation, I believe that many people have doubts about how to build the front and back end cross-domain delivery cookie environment. The editor consulted all kinds of materials and sorted out simple and useful operation methods, hoping to help you answer the doubts about "how to build the front and back end cross-domain delivery cookie environment". Next, please follow the editor to study!

Back end

Create a new maven project

Pom.xml

4.0.0 org.springframework.boot spring-boot-starter-parent 2.1.6.RELEASE com.example test-cors 0.0.1-SNAPSHOT test-cors Demo project for Spring Boot 1.8 org.springframework.boot spring-boot-starter-web org .springframework.boot spring-boot-starter-test test org.springframework.boot spring-boot-maven-plugin

Application startup class

Package com.example.testcors;import org.springframework.boot.SpringApplication;import org.springframework.boot.autoconfigure.SpringBootApplication;@SpringBootApplicationpublic class TestCorsApplication {public static void main (String [] args) {SpringApplication.run (TestCorsApplication.class, args);}}

Controller

Package com.example.testcors;import org.springframework.web.bind.annotation.CookieValue;import org.springframework.web.bind.annotation.GetMapping;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RestController;@RestController@RequestMapping ("hello1") public class CorsController {@ GetMapping ("hello2") public String testController (@ CookieValue (name = "testcookie") String testCookie) {return testCookie;}}

Configuration class

Package com.example.testcors;import org.springframework.context.annotation.Configuration;import org.springframework.web.servlet.config.annotation.CorsRegistry;import org.springframework.web.servlet.config.annotation.WebMvcConfigurer @ Configurationpublic class WebMvcConfiguration implements WebMvcConfigurer {@ Override public void addCorsMappings (CorsRegistry registry) {registry.addMapping ("/ * *") .allowCredentials (true) .al lowedMethods ("*") .allowedOrigins ("*") .allowedHeaders ("*");}}

Build another project

Front end

Html file

Put the jquery file in the same directory

Page Index foreground system

/ / $.cookie ('testcookie','test-value'); / / console.log ($.cookie (' testcookie')) $.ajax ({url: 'http://test.testcors.com:8080/hello1/hello2', type: "GET", crossDomain: true, xhrFields: {withCredentials: true}, success: function (data) {$("# info") .html ("Cross-domain access successful:" + data) }, error: function (data) {$("# info") .html ("Cross-domain failure!");},})

Local hosts configuration

Add a row

127.0.0.1 test.testcors.com

Browsers use cookie-related plug-ins to add cookie

The domain name is .testcors.com

Named testcookie

Value is any value

At this point, the study on "how to build a front-end cross-domain delivery cookie environment" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

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.