web-dev-qa-db-ja.com

GETを使用してAPIを呼び出すAxiosはオプションになります

APIの呼び出しにaxiosを使用しています（フロントエンドで）。私はメソッド「GET」を使用します：

import axios from 'axios';
import querystring from 'querystring';

var url   = "mydomain.local",
    token = "blablabla...blabla";  

var configs = {
    headers: {
        'Authorization': 'Bearer ' + token,
        'Agency': 'demo0'
    }
};

var testapi = axios.create({
        baseURL: 'http://api.' + url
    });

testapi.get( '/relativeUrl', configs
).then(function (response) {
    console.log(response);
}).catch(function (error) {
    console.log(error);
});

405メソッドが許可されていません。メソッドは「OPTIONS」ですが、私はメソッド「.get（）」を使用します。 405メソッドは許可されていません。メソッドオプション

私はpostmanでcallapiをテストし、200 OKを取得します：

postman 200 OKスクリーンショット

誰かアイデアがありますか？

javascriptsymfonycorsaxiospreflight
6
riwanab

@Shillyが言うように、OPTIONSメソッドは、 Preflightedリクエスト条件（MDN） ：

応答ヘッダーにAllow:"GET, HEAD, POST, PUT, DELETE"。そのため、OPTIONSメソッドは使用できず、サーバー（Apache）で構成する必要があります。

Apacheで変更を行います（/ etc/Apache2/sites-available/000-default.conf）：

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Headers "*"
Header set Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTIONS"

リクエストヘッダーには次のものがあります。

enter image description here

起源：「null」は問題です。原因は：

file：// URLは、エコーバックを介して認証できないnullオリジンを生成します。 file：// URLからCORSリクエストを実行しようとしないでください（ 詳細についてはこの投稿を参照してください ）

JavascriptファイルをApacheサーバーに置いた後、Originはnullではありませんでしたが、プリフライトを許可するためにSymfonyプロジェクトにNelmioCorsBundleを追加する必要があります

8
riwanab

したがって、これを解決する方法npm install qs。

次に：

import qs from 'qs'

function send(params) {
  return axios.post('/api/create/', qs.stringify(params))
}
1
Gal Bracha