使用vue+axios+spring boot前后端分離項目時會出現跨域問題
解決方式:
一: 全局配置
1 /** 2 * 就是注冊的過程,注冊Cors協議的內容。 3 * 如: Cors協議支持哪些請求URL,支持哪些請求類型,請求時處理的超時時長是什么等。 4 */ 5 @Override 6 public void addCorsMappings(CorsRegistry registry) { 7 registry 8 .addMapping("/**")// 所有的當前站點的請求地址,都支持跨域訪問。 9 .allowedMethods("GET", "POST", "PUT", "DELETE") // 當前站點支持的跨域請求類型是什么。 10 .allowCredentials(true) // 是否支持跨域用戶憑證 11 .allowedOrigins("*") // 所有的外部域都可跨域訪問。 如果是localhost則很難配置,因為在跨域請求的時候,外部域的解析可能是localhost、127.0.0.1、主機名 12 .maxAge(60); // 超時時長設置為1小時。 時間單位是秒。 13 }
二: 針對單個接口,使用注解@CrossOrigin
1 /** 2 * @desc 3 * @author guozhongyao 4 * @date 2020/03/22 17:05 5 */ 6 @RestController 7 @RequestMapping("/user") 8 @RequiredArgsConstructor 9 @CrossOrigin(origins = "*",maxAge = 3600) 10 public class UserController { 11 12 final UserMapper userMapper; 13 14 @GetMapping("/getOne/{id}") 15 public User getOne(@PathVariable("id") Integer id) { 16 return userMapper.getById(id); 17 } 18 }
三: 自定義跨域過濾器
1,編寫過濾器
public class CrosFilter implements Filter { @Override public void init(FilterConfig filterConfig) throws ServletException { // TODO Auto-generated method stub } @Override public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException { // TODO Auto-generated method stub HttpServletResponse res = (HttpServletResponse) response; HttpServletRequest req = (HttpServletRequest) request; String origin = req.getHeader("Origin"); if (!org.springframework.util.StringUtils.isEmpty(origin)) { //帶cookie的時候,origin必須是全匹配,不能使用* res.addHeader("Access-Control-Allow-Origin", origin); } res.addHeader("Access-Control-Allow-Methods", "*"); String headers = req.getHeader("Access-Control-Request-Headers"); // 支持所有自定義頭 if (!org.springframework.util.StringUtils.isEmpty(headers)) { res.addHeader("Access-Control-Allow-Headers", headers); } res.addHeader("Access-Control-Max-Age", "3600"); // enable cookie res.addHeader("Access-Control-Allow-Credentials", "true"); chain.doFilter(request, response); } @Override public void destroy() { // TODO Auto-generated method stub } }
2, 注冊過濾器
1 /** 2 * @desc 注冊自定義跨域過濾器 3 * @author guozhongyao 4 * @date 2020/3/30 15:52 5 */ 6 @Bean 7 public FilterRegistrationBean registerFilter(){ 8 FilterRegistrationBean bean = new FilterRegistrationBean(); 9 bean.addUrlPatterns("/*"); 10 bean.setFilter(new CrosFilter()); 11 return bean; 12 }
四: 使用nginx反向代理服務器解決跨域問題
1, 在nginx的conf目錄下,創建vhosts文件夾
2, 在nginx.conf 文件中添加 include vhosts/*.conf;
3, vhost目錄下創建 abc.conf文件