Javascript fetch 调用后端两次

Question

我有用 java ee 和 jersey 编写的后端应用程序。当我使用 JavaScript Fetch API post 将数据发送到我的其余端点时，我看到过滤器被触发了两次。一旦它没有授权 header，第二次它有。当我尝试从 Web 浏览器打开我的网站时，此过滤器仅被调用一次。为什么会这样。也许是因为 CORS？

在我的单个 post 日志下方，两者都是从同一个过滤器打印的。

 http://localhost:8080/BlogRest/controller/endpoint/|#]
  Key=host, value=localhost:8080|#]
  Key=origin, value=http://localhost:3000|#]
  Key=access-control-request-method, value=POST|#]
  Key=content-length, value=0|#]
  Key=access-control-request-headers, value=authorization,content-type|#]
  Key=connection, value=keep-alive|#]
  Key=accept, value=*/*|#]
  Key=user-agent, value=user agent data|#]
  Key=referer, value=http://localhost:3000/|#]
  Key=accept-language, value=pl-pl|#]
  Key=accept-encoding, value=gzip, deflate|#]

第二次通话

  http://localhost:8080/BlogRest/controller/endpoint/|#]
  Key=host, value=localhost:8080|#]
  Key=origin, value=http://localhost:3000|#]
  Key=content-type, value=application/json|#]
  Key=accept-language, value=pl-pl|#]
  Key=accept-encoding, value=gzip, deflate|#]
  Key=connection, value=keep-alive|#]
  Key=accept, value=*/*|#]
  Key=user-agent, value=user agent data|#]
  Key=authorization, value=Bearer token|#]
  Key=referer, value=http://localhost:3000/origin|#]
  Key=content-length, value=15|#]

Answer 1

有两个请求因为 CORS。一种请求方法是 OPTIONS，当它被执行时，然后启动预期的 POST 请求。 OPTIONS 请求不调用端点，它只是获取服务器配置。因此，我使用 HttpServletRequest getMethod().

按方法过滤了我的 Java 过滤器请求

    @Override
    public void doFilter(ServletRequest request, ServletResponse response,
            FilterChain chain)
            throws IOException, ServletException {

        HttpServletRequest requ = (HttpServletRequest) request;

        if (requ.getMethod().toLowerCase().equals(HttpMethod.OPTIONS)) {
            chain.doFilter(request, response);
            return;
        }

        //do something on not options method.            

        chain.doFilter(request, response);

    }

Javascript fetch 调用后端两次

Javascript fetch is calling backend twice

javascript

fetch

jersey-2.0

java-ee-8