Access to XMLHttpRequest at 'http://localhost:8082/api/user/login' from origin 'http://localhost:9527' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource
时间: 2023-07-24 11:49:07 浏览: 69
这个错误提示是因为浏览器的同源策略(Same Origin Policy)限制了跨域请求。简单来说,浏览器不允许从一个源(域名、协议、端口)发送请求到另一个源。如果需要进行跨域请求,可以在服务端设置响应头部中的“Access-Control-Allow-Origin”字段,来允许特定的源进行访问。具体实现可以参考CORS(Cross-Origin Resource Sharing)协议。
相关问题
Access to XMLHttpRequest at 'http://localhost:8081/api/login' from origin 'http://localhost:8080'
根据提供的引用内容,你可以通过以下两种方式解决"Access to XMLHttpRequest at 'http://localhost:8081/api/login' from origin 'http://localhost:8080'?"的问题:
1. 在PHP中添加跨域配置:
```php
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: GET, POST, OPTIONS, DELETE");
header("Access-Control-Allow-Headers: DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Accept-Language,Origin,Accept-Encoding,token");
if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
exit();
}
```
2. 在Spring Boot中添加跨域配置:
```java
@Configuration
public class AccessControlAllowOriginFilter implements WebMvcConfigurer {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/*/**")
.allowedHeaders("*")
.allowedMethods("*")
.maxAge(1800)
.allowedOrigins("*");
}
}
```
这两种方式都是通过设置响应头来允许跨域请求。第一种方式是在PHP中添加相应的header头,第二种方式是在Spring Boot中添加一个过滤器类来配置跨域请求。
Access to XMLHttpRequest at 'http://localhost:8080/error/loginerror' from origin 'http://localhost:8
根据提供的引用内容,你遇到了CORS(跨域资源共享)的问题。CORS是一种浏览器安全机制,用于限制跨域请求。当你的前端应用(例如Vue.js)从一个域名(例如localhost:9090)向另一个域名(例如localhost:9091)发送请求时,浏览器会执行CORS检查,以确保服务器允许该请求。
在你的情况下,你的前端应用从localhost:9090向localhost:9091发送请求,但是由于CORS策略的限制,该请求被阻止了。错误信息中提到了一个重定向(redirect)的问题,这是因为在发送实际请求之前,浏览器会发送一个预检请求(preflight request)来检查服务器是否允许该请求。由于重定向不被允许的CORS策略,预检请求被阻止了。
要解决这个问题,你可以在后端服务器上进行配置,允许跨域请求。具体的配置方法取决于你使用的后端框架和服务器。以下是一些常见的解决方法:
1. 在后端服务器上设置CORS头部:在后端服务器的响应中添加CORS头部,允许来自前端应用的跨域请求。具体的设置方法取决于你使用的后端框架和服务器。以下是一个示例代码,使用Node.js和Express框架:
```javascript
const express = require('express');
const app = express();
app.use((req, res, next) => {
res.setHeader('Access-Control-Allow-Origin', 'http://localhost:9090');
res.setHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE');
res.setHeader('Access-Control-Allow-Headers', 'Content-Type');
next();
});
// 处理其他路由和请求
app.listen(9091, () => {
console.log('Server is running on port 9091');
});
```
2. 使用代理服务器:在开发环境中,你可以使用代理服务器来绕过CORS限制。例如,你可以使用webpack-dev-server的proxy配置来将请求代理到后端服务器。具体的配置方法取决于你使用的开发工具和服务器。
3. 使用CORS插件:如果你使用的是特定的后端框架,例如Spring Boot,你可以使用相应的CORS插件来简化配置。例如,对于Spring Boot,你可以使用spring-boot-starter-web包中的CorsFilter来处理CORS问题。
请注意,为了安全起见,你应该仅允许来自受信任的域名的跨域请求,并且只允许必要的HTTP方法和头部。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)