У меня есть два приложения, один из которых – реактивный интерфейс, а второй – приложение rails-api.
Я с удовольствием использовал isomorphic-fetch, пока мне не нужно было отправить метод PATCH на сервер.
Я осознаю:
Fetch API cannot load http://localhost:3000/api/v1/tasks. Method patch is not allowed by Access-Control-Allow-Methods in preflight response.
но ответ OPTIONS с сервера включает метод PATCH в списке Access-Control-Allow-Methods:
Так реализуется выборка:
const API_URL = 'http://localhost:3000/' const API_PATH = 'api/v1/' fetch(API_URL + API_PATH + 'tasks', { headers: { 'Accept': 'application/json', 'Content-Type': 'application/json' }, method: 'patch', body: JSON.stringify( { task: task } ) })
POST, GET, DELETE настроены почти одинаково, и они работают нормально.
Любая идея, что здесь происходит?
ОБНОВИТЬ:
Патч метода чувствителен к регистру:
https://github.com/github/fetch/blob/master/fetch.js#L200
Не уверен, что это предназначено или ошибка.
ОБНОВЛЕНИЕ 2
Это предназначено, и тип метода PATCH должен быть чувствительным к регистру. Обновление линии из метода выборки:
method: 'PATCH'
устраняет проблему.
https://github.com/github/fetch/issues/254
У меня была очень похожая проблема с API-интерфейсом legalJS и rails API, использующим Rack :: Cors, и добавление patch
в список разрешенных методов решило проблему для меня.
config.middleware.insert_before 0, Rack::Cors do allow do origins '*' resource '*', headers: :any, methods: [:get, :post, :patch, :options] end end
У меня была эта ошибка, в то время как PATCH
был все шапки. Я тоже получал эту ошибку с помощью DELETE
и PUT
. Я проверил заголовки своей fetch
и я увидел метод OPTIONS
. Я использовал isomorphic-fetch
lib здесь – https://www.npmjs.com/package/isomorphic-fetch
Исправить для меня было добавить к моей странице PHP:
<?php header('Access-Control-Allow-Methods: GET, POST, PUT, DELETE, PATCH');
Без этого, в Firefox 53 я бы продолжал получать ошибку javascript:
NetworkError при попытке получить ресурс.
Прибытие, которое я делал, было следующим:
try { await fetch('https://my.site.com/', { method: 'PATCH', headers: { 'Content-Type':'application/x-www-form-urlencoded' }, body: 'id=12&day=1' }); } catch(ex) { console.error('ex:', ex); }