溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》
您好，登錄后才能下訂單哦！
這篇文章主要介紹“怎么搭建前后端跨域傳遞cookie環(huán)境”，在日常操作中，相信很多人在怎么搭建前后端跨域傳遞cookie環(huán)境問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對大家解答”怎么搭建前后端跨域傳遞cookie環(huán)境”的疑惑有所幫助！接下來，請跟著小編一起來學習吧！
后端
新建maven項目
pom.xml
<?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"> <modelVersion>4.0.0</modelVersion> <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>2.1.6.RELEASE</version> <relativePath/> <!-- lookup parent from repository --> </parent> <groupId>com.example</groupId> <artifactId>test-cors</artifactId> <version>0.0.1-SNAPSHOT</version> <name>test-cors</name> <description>Demo project for Spring Boot</description> <properties> <java.version>1.8</java.version> </properties> <dependencies> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-test</artifactId> <scope>test</scope> </dependency> </dependencies> <build> <plugins> <plugin> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-maven-plugin</artifactId> </plugin> </plugins> </build> </project>
應(yīng)用啟動類
package com.example.testcors;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
@SpringBootApplication
public class TestCorsApplication {
public static void main(String[] args) {
SpringApplication.run(TestCorsApplication.class, args);
}
}控制器
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;
}
}配置類
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;
@Configuration
public class WebMvcConfiguration implements WebMvcConfigurer {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**")
.allowCredentials(true)
.allowedMethods("*")
.allowedOrigins("*")
.allowedHeaders("*");
}
}另建項目
前端
html文件
將jquery文件放入同目錄下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<title>Page Index</title>
</head>
<body>
<h3>前臺系統(tǒng)</h3>
<p id="info"></p>
</body>
<script src="jquery-3.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
// $.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("跨域訪問成功:" + data);
},
error: function (data) {
$("#info").html("跨域失敗!!");
},
})
</script>
</html>本地hosts配置
添加一行
127.0.0.1 test.testcors.com
瀏覽器使用cookie相關(guān)插件添加cookie
域名為.testcors.com
名為 testcookie
值為任意值
到此，關(guān)于“怎么搭建前后端跨域傳遞cookie環(huán)境”的學習就結(jié)束了，希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學習，快去試試吧！若想繼續(xù)學習更多相關(guān)知識，請繼續(xù)關(guān)注億速云網(wǎng)站，小編會繼續(xù)努力為大家?guī)砀鄬嵱玫奈恼拢?/p>
免責聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：is@yisu.com進行舉報，并提供相關(guān)證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權(quán)內(nèi)容。
億速云公眾號
手機網(wǎng)站二維碼