Spring Boot 和 Html：请求的资源上不存在“Access-Control-Allow-Origin”标头
Posted
技术标签:
【中文标题】Spring Boot 和 Html：请求的资源上不存在“Access-Control-Allow-Origin”标头【英文标题】：SpringBoot and Html: No 'Access-Control-Allow-Origin' header is present on the requested resource 【发布时间】：2018-03-05 07:19:45 【问题描述】：当我尝试通过 Chrome 在我的计算机上运行 .html 文件时，我遇到了错误“请求的资源上不存在 'Access-Control-Allow-Origin' 标头”。它正在尝试访问我在 localhost:8080 上运行的 SpringBoot Web 服务。
我可以通过直接通过 Chrome 调用 Web 服务本身来获得结果，但尝试通过 index.html 调用 Web 服务会出现访问控制错误。
我也尝试过 Spring tutorial，但我仍然遇到同样的问题。
index.html
<title>My Worst Enemy</title>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script>
$( document).ready(function()
$("#run").click(function()
var summonerName = document.getElementById("summonerName");
console.log(summonerName.value);
$.ajax(
type: "GET",
dataType: "json",
url: "http://localhost:8080/summonerName/" + summonerName.value,
success: function(data)
alert(data);
);
);
);
</script>
</head>
<body>
<input type="text" name="summonerName" id="summonerName" value="Zann Starfire">
<button id="run">Run Summoner</button><br>
</body>
</html>
WebController.java
package com.myWorstEnemy.web.controller;
import org.springframework.web.bind.annotation.*;
@RestController
public class WebController
@RequestMapping("/")
public String helloWorld()
return "Hello world!";
@CrossOrigin(origins = "http://localhost:8080")
@RequestMapping(method = RequestMethod.GET, value = "/summonerName/summonerName")
public String summonerName(@PathVariable String summonerName)
return "The summoner name = " + summonerName;
为什么这是一个跨域请求？我正在从我的计算机上运行 index.html，我不认为 localhost 与我正在运行的网页的来源不同，但我显然遗漏了一些东西。
有什么我可以添加到我的 index.html 以启用跨域请求，还是我需要在其他地方做？
【问题讨论】：
您是通过网络应用还是通过文件系统获取文件？ chrome 中的 url 是 localhost/.../index.html 还是 file://.../index.html ？ file:// 是一个不同的域，我认为；试试 origins='*' origin这个词并不意味着“相同的系统”或“相同的环境”。 origin 这个词有一个非常具体的技术含义；这意味着方案+主机+端口的组合。见tools.ietf.org/html/rfc6454#section-5。出于同源策略的目的，只有当它们的方案+主机+端口的组合完全匹配时，两个源才匹配。 en.wikipedia.org/wiki/Same-origin_policy 所以根据那些起源的规则，你正在尝试的是一个跨域请求 我并没有真正想到 file:// 是一个不同的来源，但这是有道理的。我只是没有注意我是如何运行网页的。感谢您的帮助！ 【参考方案1】：所以，我正在通过文件系统加载我的 index.html。 “file://.../index.html” 是我在 Chrome 中运行时的 url，这意味着来源不是本地主机。因此，它给了我错误。
替换
@CrossOrigin(origins = "http://localhost:8080")
与
@CrossOrigin(origins = "*")
工作。感谢 okaram 的建议。
【讨论】：
以上是关于Spring Boot 和 Html：请求的资源上不存在“Access-Control-Allow-Origin”标头的主要内容，如果未能解决你的问题，请参考以下文章
请求的资源上不存在“Access-Control-Allow-Origin”标头。离子、AngularJS、Spring Boot 1.3
带有 Webflux 的 Spring Boot：请求的资源上不存在“Access-Control-Allow-Origin”标头
CORS 策略：请求的资源 Spring Boot Rest API 和 VUE 上不存在“Access-Control-Allow-Origin”标头