如何使用CORS,解决跨域访问异常?

CORS(Cross-origin resource sharing,跨域源资源共享)

1.出现跨域问题。
跨域,是指浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的,是浏览器对JavaScript实施的安全限制。
报错信息如下:
在这里插入图片描述
2.CORS解决跨域的思路:
请求头参数:
Access-Control-Allow-Origin:* 表示不再限制跨域。
在这里插入图片描述

3.实现方式:配置局部配置或者配置全局配置;
3-1.局部配置:@CrossOrigin 注解
Controller类中代码:

@RestController
public class CrossAController {
@CrossOrigin
@RequestMapping("/user")
public User findUser(){
	//模拟数据
	User user = new User();
	user.setUsername("admin");
	user.setPassword("123456");
	return user;
}
	}

@CrossOrigin的使用:

  • 在方法上,表示该方法可以实现跨域请求。
  • 在类上,表示该类中所有方法都可实现跨域请求。

@CrossOrigin的两个参数:

  • origins:允许可访问的域列表
  • maxAge:准备响应前的缓存持续的最大时间(以秒为单位)。
示例:@CrossOrigin(origins = "http://localhost:8082", maxAge = 3600)

3-2.全局配置:创建配置类,实现WebMvcConfigurer接口,重写addCorsMappings方法。
示例:

@Configuration
public class WebMvcConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")  //允许所有请求映射
                .allowedOrigins("http://localhost:8082")    //允许8082跨域请求
                .allowedHeaders("*")    //设置请求头
                .allowedMethods("*")    //允许所有请求方式
                .maxAge(3600);  //设置有效时间
    }
}

注:在Controller注解上方添加@CrossOrigin注解后,仍然出现跨域问题,解决方案之一就是:在@RequestMapping注解中没有指定Get、Post方式,具体指定后,问题解决。
如:@RequestMapping(value = “/user”, method = RequestMethod.POST)

  • 2
    点赞
  • 12
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值