패치 가져오기 요청이 허용되지 않습니다.

패치 가져오기 요청이 허용되지 않습니다.

저는 두 개의 앱을 가지고 있는데 하나는 반응 프론트 엔드이고 두 번째는 레일즈-api 앱입니다.

저는 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 방법이 포함되어 있습니다.

다음은 fetch 구현 방법입니다.

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

저도 비슷한 문제가 있었어요랙을 사용한 JS 프론트 엔드 및 레일 API::코어스,추가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-fetchlib here - https://www.npmjs.com/package/isomorphic-fetch

제가 수정한 것은 제 PHP 페이지에 추가하는 것이었습니다.

<?php
    header('Access-Control-Allow-Methods: GET, POST, PUT, DELETE, PATCH');

이것이 없으면 Firefox 53에서 Javascript 오류가 계속 발생합니다.

리소스를 가져오는 동안 네트워크 오류가 발생했습니다.

제가 했던 일은 다음과 같습니다.

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);
}

이 코드 사용 _method: '패치'

return (
        fetch(API_ROOT + route, {
            _method: 'PATCH',
            crossDomain: true,
            xhrFields: {
                withCredentials: true
            },
            headers: {
                Accept: 'application/json',
                'Content-Type': 'application/json',
                'Authorization': ''
            },
            data: JSON.stringify(data),
            credentials: 'include'
        })
        .then(res => res.json())
        .then(res => {
            return res
        })
        .catch(err => console.error(err))
    );

또 다른 방법은 헤더에 메서드 삽입

headers: {
            Accept: 'application/json',
            'Content-Type': 'application/json',
            '_method': 'PATCH',
            'Authorization': ''
        }

도움이 됩니다

return (
        fetch(API_ROOT + route, {
            method: 'POST',
            crossDomain: true,
            xhrFields: {
                withCredentials: true
            },
            headers: {
                Accept: 'application/json',
                'Content-Type': 'application/json',
                '_method': 'PATCH',
                'Authorization': ''
            },
            data: JSON.stringify(data)
        })
        .then(res => res.json())
        .then(res => {
            console.log(res);
            return res
        })
        .catch(err => console.error(err))
    );

언급URL : https://stackoverflow.com/questions/34666680/fetch-patch-request-is-not-allowed