Метод POST не поддерживается для этого маршрута. Поддерживаемые методы: GET, HEAD, Как решить эту ошибку? Я использую vue js и laravel 7

Question

Это мой мой vue компонент

export default {
    data(){
        return{
            form:new Form({
                district: '',
                province: '',
                name: '',
            })
        }
    },
    methods: {
        createHousehold(){
            this.form.post('api/household');

        }
    },
    mounted() {
        console.log('Component mounted.')
    }
}

Это маршрут API.

Route::apiResource('household','APIController/HouseholdController');

Когда я проверяю список маршрутов, «api / домашнее хозяйство» получает для индекса и сообщение для хранения, но я получаю эту ошибку и не могу понять, где мне указать метод сообщения, отличный от метода vue. Также я попытался добавить csrf в главном разделе моего мастер-клинка

Answer 1

Объяснение Вам потребуется установить заголовок Access-Control-Allow-Methods, который определяет метод или методы, разрешенные при доступе к ресурсу в ответ на запрос предварительной проверки.

Ссылка URL - https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Methods

вы можете добавить пакет cors на стороне сервера, используя следующий пакет (в laravel или PHP)

URL - https://packagist.org/packages/barryvdh/laravel-cors

composer требуют barryvdh / laravel -cors

Добавить в группу промежуточного программного обеспечения в приложении / Http / Ядро. php file.

protected $middlewareGroups = [
    ...
    'api' => [
        'throttle:60,1',
        'bindings',
        \Barryvdh\Cors\HandleCors::class,
    ],
    ...
]

и выполните следующую команду.

php artisan vendor:publish --tag="cors"

обновите конфигурацию со следующим содержимым ( config / cors. php)

return [
    'supportsCredentials' => false,
    'allowedOrigins' => ['*'],
    'allowedOriginsPatterns' => [],
    'allowedHeaders' => ['*'],
    'allowedMethods' => ['*'], // this is the solution of your problem
    'exposedHeaders' => [],
    'maxAge' => 0,
]