火狐浏览器,vue前端调用springboot后端接口时,提示跨源怎么解决?代码如何写?
时间: 2024-03-29 19:38:05 浏览: 30
跨源问题是浏览器的一种安全限制,因为不同源的网站之间存在安全隐患。解决跨源问题的一种方式是使用CORS(跨域资源共享)。
在Spring Boot后端中,你可以通过添加CORS配置类来解决跨源问题。具体步骤如下:
1. 创建一个Java类,命名为CorsConfig,添加@Configuration注解。
2. 在CorsConfig类中添加一个名为corsConfigurationSource的方法,该方法返回一个CorsConfiguration对象。
3. 在corsConfigurationSource方法中,调用CorsConfiguration对象的addAllowedOrigin方法,设置允许的源,例如:
```java
configuration.addAllowedOrigin("http://localhost:8080");
```
这里的http://localhost:8080是指前端的访问地址。
4. 还可以设置其他的CORS配置,例如:
```java
configuration.addAllowedMethod("*");
configuration.addAllowedHeader("*");
```
5. 最后将CorsConfiguration对象添加到UrlBasedCorsConfigurationSource对象中,返回该对象。
```java
@Bean
public CorsFilter corsFilter() {
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
source.registerCorsConfiguration("/**", corsConfigurationSource());
return new CorsFilter(source);
}
```
在前端代码中,可以使用axios等工具发送请求时添加withCredentials: true,表示允许发送跨域请求的cookie信息。例如:
```javascript
axios.get('http://localhost:8081/api/user', {
withCredentials: true
}).then(response => {
console.log(response.data);
}).catch(error => {
console.log(error);
});
```
这样就可以解决跨源问题了。
相关推荐
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.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)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)