前端跨域解决方案（前端跨域解决方案cors）

科技前沿 • 2025-06-10 22:49 • 阅读 29

大家好，我是讯享网，很高兴认识大家。

以下是一个完整的Java和JavaScript使用CORS解决跨域问题的代码示例：

Java后端代码（使用Spring Boot框架）：

@RestController public class ApiController { @GetMapping(&quot;/data&quot;) public ResponseEntity&lt;String&gt; getData() { // 处理请求逻辑 String responseData = &quot;This is the response data&quot;; return ResponseEntity.ok(responseData); } }

讯享网

JavaScript前端代码：

讯享网var xhr = new XMLHttpRequest(); xhr.open(&#39;GET&#39;, &#39;http://localhost:8080/data&#39;, true); xhr.setRequestHeader(&#39;Content-Type&#39;, &#39;application/json&#39;); xhr.setRequestHeader(&#39;Origin&#39;, &#39;http://example.com&#39;); // 请求源 xhr.withCredentials = true; // 允许发送Cookie xhr.onreadystatechange = function() { if (xhr.readyState === 4 &amp;&amp; xhr.status === 200) { var response = JSON.parse(xhr.responseText); console.log(response); // 处理响应 } }; xhr.send();

在上述示例中，Java后端使用Spring Boot框架创建了一个简单的RestController，其中包含一个处理GET请求的方法getData()。该方法返回一个字符串作为响应数据。

在JavaScript前端，使用XMLHttpRequest对象发送了一个GET请求到Java后端的/data路径。在请求头中设置了Content-Type和Origin字段，其中Origin字段指定了请求源。还设置了withCredentials属性为true，以允许发送Cookie。在接收到响应后，可以通过处理xhr.responseText来获取响应数据。

请确保将Java后端代码部署在localhost:8080上，并将JavaScript前端代码部署在一个不同的源（例如http://example.com）上以进行跨域请求。

这个示例演示了如何使用Java和JavaScript中的CORS来解决跨域问题。在实际应用中，你需要根据你的需求和框架进行适当的配置和处理。

前端跨域解决方案（前端跨域解决方案cors）

相关推荐