Javascript fetch 调用后端两次 [重复]答案

【问题标题】：Javascript fetch is calling backend twice [duplicate]Javascript fetch 调用后端两次 [重复]
【发布时间】：2021-06-11 16:45:22
【问题描述】：

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

在我的单个帖子的日志下方，都是从同一个过滤器打印出来的。

 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|#]

【问题讨论】：

因为 CORS，fetch() 首先运行 HEAD /path 来获取 headers，然后 [GET/POST/PUT/DELETE] /path 来实际执行请求
有没有办法设置过滤器在 fetch 请求标头时不被调用？我的意思是第一次通话。
CORS 是必需的。

标签： javascript fetch jersey-2.0 java-ee-8

【解决方案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);

    }

【讨论】：