Problem with CORS using Vue + Laravel (only GET method works)

Asked

Viewed 919 times

2

  • Vue: CLI 3
  • Laravel: 6

When trying to use different GET requests (e.g.: POST, DELETE), I get the following message:

Access to Xmlhttprequest at 'http://127.0.0.1:8000/api/test' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested Resource.

Configuration of Axios:

import axios from "axios"

export const http = axios.create({
    baseURL: 'http://127.0.0.1:8000/api',
    headers: {
        'Access-Control-Allow-Origin': '*',
        'Access-Control-Allow-Methods': 'GET, POST, PATCH, PUT, DELETE, OPTIONS',
        'Access-Control-Allow-Headers': '*',
    },

})

Example of the requisitions:

    get: () => {
        return http.get('teste')
    },
    store: (data) => {
        return http.post('teste', data)
    }

To configure CORS, I used the following package: https://github.com/fruitcake/laravel-cors

Configuration of the CORS:

<?php

return [

    'paths' => ['api/*'],
    'allowed_methods' => ['*'],
    'allowed_origins' => ['*'],
    'allowed_origins_patterns' => [],
    'allowed_headers' => ['*'],
    'exposed_headers' => false,
    'max_age' => false,
    'supports_credentials' => false,
];

I also tried to use the package https://github.com/spatie/laravel-cors, but I had the same result: only the GET method works.

Note: I can use other methods through Postman, for example.

Picture with headers + error:

Imagem com os headers + erro

php laravel vue.js axios cors

  • which servier you are ultilizando, I am with the same problem, in digital Ocean works there is Nginx, already in hostgator nothing.

1 answer

0

Browser other questions tagged php laravel vue.js axios cors

You are not signed in. Login or sign up in order to post.