前端访问后端出现CORS 但是我已经配置了 麻烦老哥们帮我看看

报错信息:


后端代码:
Nginx配置:
前端请求方法:image

这CORS跨域,蛮简单的东西。你们为啥老是翻车?我给你一个Filter。你copy到项目里面。使用Filter处理,不要用@CrossOrigin 注解。

import java.io.IOException;

import javax.servlet.FilterChain;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebFilter;
import javax.servlet.http.HttpFilter;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.core.annotation.Order;
import org.springframework.http.HttpHeaders;
import org.springframework.lang.Nullable;
import org.springframework.stereotype.Component;
import org.springframework.util.ObjectUtils;
import org.springframework.web.util.UriComponents;
import org.springframework.web.util.UriComponentsBuilder;

@Component
@Order(-999)
@WebFilter(filterName = "corsFilter" , urlPatterns = { "/*" })
public class CorsFilter extends HttpFilter {

	/**
	 * 
	 */
	private static final long serialVersionUID = -8387103310559517243L;

	@Override
	protected void doFilter(HttpServletRequest req, HttpServletResponse res, FilterChain chain) throws IOException, ServletException {

		String origin = req.getHeader(HttpHeaders.ORIGIN);
		
		
		if (!isSameOrigin(req)) {
			/**
			 * TODO 通过后台读取,配置
			 */
			res.addHeader(HttpHeaders.ACCESS_CONTROL_ALLOW_ORIGIN, origin);;
			res.addHeader(HttpHeaders.ACCESS_CONTROL_ALLOW_HEADERS, "Origin, x-requested-with, Content-Type, Accept, Authorization");
			res.addHeader(HttpHeaders.ACCESS_CONTROL_ALLOW_CREDENTIALS, "true");
			res.addHeader(HttpHeaders.ACCESS_CONTROL_ALLOW_METHODS, "GET, POST, PUT, OPTIONS, DELETE");
			
			res.addHeader(HttpHeaders.ACCESS_CONTROL_EXPOSE_HEADERS, "Cache-Control, Content-Language, Content-Type, Expires, Last-Modified, Pragma");
			res.addHeader(HttpHeaders.ACCESS_CONTROL_MAX_AGE, "60");
		}

		super.doFilter(req, res, chain);
	}
	
	private static boolean isSameOrigin(HttpServletRequest req) {
		
		String origin = req.getHeader(HttpHeaders.ORIGIN);
		
		if (origin == null) {
			return true;
		}
		
		String scheme = req.getScheme();
		String host = req.getServerName();
		int port = req.getServerPort();
		
		UriComponents originUrl = UriComponentsBuilder.fromOriginHeader(origin).build();
		
		return (ObjectUtils.nullSafeEquals(scheme, originUrl.getScheme()) &&
				ObjectUtils.nullSafeEquals(host, originUrl.getHost()) &&
				getPort(scheme, port) == getPort(originUrl.getScheme(), originUrl.getPort()));
	}
	
	private static int getPort(@Nullable String scheme, int port) {
		if (port == -1) {
			if ("http".equals(scheme) || "ws".equals(scheme)) {
				port = 80;
			}
			else if ("https".equals(scheme) || "wss".equals(scheme)) {
				port = 443;
			}
		}
		return port;
	}
}

最后,建议你好好看看这个帖子:

跨域选项不用配置在Nginx上。

谢谢老哥

你先试试吧。不行再说。

这个文件是每个模块中都要放吗?

web项目在哪里,就放在哪里。


加了之后就404了

但是用swagger-ui可以使用

怎么会,这个Filter,不会修改你的任何东西。只是在跨域请求的情况下添加跨域header。这应该是你自己程序的某个地方有问题。

是不是这个Filter和我的@Cross注解冲突了?我试试把@cross删了

@Cross主键删除了。不需要。

还是不行 加了这个Filter后 我当前controller所有方法都报404

那我没辙。你用 @Cros注解也行,。那你好好看上面我给你的那个帖子。你先了解cors跨域需要干啥。


这个里面的值需不需要改改,因为我nginx里的是9001 不是80

那你直接把这个判断语句修改一下试试看。


String origin = req.getHeader(HttpHeaders.ORIGIN);
		
if (!StringUtils.isEmpty(origin)) {
.....
}

我再试试