Предпросмотр запроса с помощью window.fetch api

Question

Позвольте мне изложить это, сказав, что он работает в POSTMAN, клиенте API дополнений Chrome. Но это не работает в моем реальном приложении, и мне интересно, есть ли что-то, что я забыл включить в запрос на выборку.

У меня есть следующий запрос.

(id, vzId)=>{ 
      var json = {id: id, vzId: vzId, }; 
      var request = { 
       method: 'POST', 
       body: json, 
       headers: new Headers({ 
        'Accept': 'application/json', 
        'Content-Type': 'application/json' 
       }) 
      } 
      fetch('http://localhost:8080/notification/markRead',request).then(function(response){ 
       return response.json(); 
      }).then(function(json){ 
       console.log(json); 
      }) 
     } 

Когда запрос запущен, он возвращает мне эту ошибку.

OPTIONS http://localhost:8080/notification/markRead 
Fetch API cannot load http://localhost:8080/notification/markRead. 
Response for preflight has invalid HTTP status code 403 

Я использовал тот же адрес и данные в моем хромированной отдыха клиента (Почтальон), и это работает, но по какой-то причине он не работает, когда я использую FETCH API. Любая помощь приветствуется.

Answer 1

В случае, если кто-то спотыкается об этом, и это может помочь людям в будущем, мы нашли ответ. В коде, который я разместил, нет ничего плохого. Причина, по которой он работал на Postman, а не на клиенте, заключается в том, что почтальон не выполняет предполетный запрос. Клиент (как и все веб-сайты) сделает запрос предполетной формы в виде метода OPTIONS. Сервер backend Spring не разрешал метод опций. Бэкэнд-разработчику пришлось разрешить метод OPTIONS для определенного маршрута на сервере, а не только POST.

Так что в случае, когда вы тестируете Postman, но не можете дублировать поведение, помните, что почтальон не отправляет запрос предварительной проверки.