Метод PUT не разрешен Access-Control-Allow-Methods в предварительном ответе vue-laravel App

Question

Я новичок в жизни.Для запроса ajax я использую axios, а для back-end я использую Laravel.Всякий раз, когда я отправляю запрос POST и GET, он работает нормально.Но при попытке отправить PUT запрос на его отображение метод PUT не разрешен Access-Control-Allow-Methods в предварительном ответе vue-laravel App.Я прочитал много ответов в Stackoverflow и github, но ни один из них не помог мне.

Вот код на стороне клиента:

axios.put('http://127.0.0.1:8000/api/photo/6', this.photo, { headers: getHeader() })
    .then(response => {
        console.log(response.data.message);
   }).catch(err => {
        this.errors = err.response.data.errors;
   });

Вот код промежуточного ПО CROSS:

//allowed client 
    //now only for localhost vue cli
    $domains = ['http://localhost:8080'];

    if(isset($request->server()['HTTP_ORIGIN'])){

        $origin = $request->server()['HTTP_ORIGIN'];

        if(in_array($origin, $domains)){
            header('Access-Control-Allow-Origin: '.$origin);
            header('Access-Control-Allow-Headers: Origin, Content-Type, Authorization');
        }
    }

    return $next($request);

Answer 1

Попробуйте это в бэкэнде: app / Http / Middleware / Cors.php

public function handle($request, Closure $next)
{
return $next($request)
    ->header('Access-Control-Allow-Origin', '*')
    ->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, 
OPTIONS');
}

app / Http / Kernel.php $ routedMiddleware array add

'cors' => \App\Http\Middleware\Cors::class,

Route / api.php Route :: group (['middleware' => 'cors'], function () {

Route::put('/v1/employees', 'Employees@store');

});

Answer 2

Определенные HTTP-запросы GET, HEAD и POST не запускают проверку предварительных проверок CORS.Они называются простыми запросами.Они отправляют только часть заголовков HTTP.Любой другой дополнительный заголовок, такой как заголовок авторизации (например, аутентификация JWT), вызовет предварительный запрос OPTIONS.Подробности об этом можно найти на https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

. Я думаю, что самый простой способ для вас работать с этим, это использовать пакет laravel-cors на бэкэнде (см. https://github.com/barryvdh/laravel-cors).

Выполняя разработку, вы можете просто быть очень терпеливым, установив для параметра allowOrigins, allowHeaders и allowMethods значение *. Позже, во время тестирования и последующего производства, вы должны настроить его на более строгий.гораздо лучше повесить концепции CORS, и тогда вы сможете полностью настроить его под свои нужды.