Laravel CORS issue while using credentials: 'include'

Help for integrating the Laravel package
Forum rules
Always add your Laravel, Aimeos and PHP version as well as your environment (Linux/Mac/Win)
Spam and unrelated posts will be removed immediately!
User avatar
DamanMokha
Posts: 13
Joined: 29 Mar 2023, 03:00

Laravel CORS issue while using credentials: 'include'

Post by DamanMokha » 29 Mar 2023, 03:17

Hi, I am currently using Laravel 9 and was attempting to access the Basket API. As per the documentation, it is required to send cookies to retrieve cart data. I used the mode credentials: "include," but I am encountering a CORS error.

Code: Select all

Access to fetch at 'http://127.0.0.1:8000/jsonapi/basket?id=default' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'.
I have allowed already it in cors.php of Laravel.

Code: Select all

<?php
return [
    'paths' => ['*'],
    'allowed_methods' => ['*'],
    'allowed_origins' => ['http://localhost:3000/'],
    'allowed_origins_patterns' => ['*'],
    'allowed_headers' => ['*'],
    'exposed_headers' => [],
    'max_age' => 0,
    'supports_credentials' => true,
];
Here is my fetch request code

Code: Select all

fetch(API_GET_CART + '?id=default', {
      method: 'GET',
      credentials: 'include',
      headers: {
        'Access-Control-Allow-Origin': 'http://localhost:3000',
        'Access-Control-Allow-Credentials': true,
        'Content-Type': 'application/json',
      },
    })
      .then((response) => response.json())
      .then((data) => {
        console.log(data);
      })
      .catch((error) => {
        console.log(error);
      });
Can you help me figure out what's wrong? I have tried various solutions to enable this, and I have already specified the allowed origin in the CORS settings, yet it is still taking it as *. Any assistance would be greatly appreciated.

Thanks

User avatar
aimeos
Administrator
Posts: 7785
Joined: 01 Jan 1970, 00:00

Re: Laravel CORS issue while using credentials: 'include'

Post by aimeos » 29 Mar 2023, 07:30

Use the same domain for both, API and your app, either "localhost" or "127.0.0.1". The CORS problem occurs because they are different.
Professional support and custom implementation are available at Aimeos.com
If you like Aimeos, Image give us a star

User avatar
DamanMokha
Posts: 13
Joined: 29 Mar 2023, 03:00

Re: Laravel CORS issue while using credentials: 'include'

Post by DamanMokha » 29 Mar 2023, 08:26

Thanks for your reply. I have changed both to "localhost," but I am still having the same issue. Additionally, I plan to use a different front-end domain than the API endpoint.

Code: Select all

Access to fetch at 'http://localhost:8000/jsonapi/basket?id=default' from origin 'http://localhost:3000' has been blocked by CORS policy: 
Response to preflight request doesn't pass access control check: 
The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'.

User avatar
aimeos
Administrator
Posts: 7785
Joined: 01 Jan 1970, 00:00

Re: Laravel CORS issue while using credentials: 'include'

Post by aimeos » 30 Mar 2023, 07:53

Seems like the port must be the same too.

Using different domains for frontend and API causes a lot of problems as other projects have shown. For CORS, browsers create a pre-flight request for each API call which immediately doubles the number of requests your server has to cope with!

Thus, it's highly recommended to avoid CORS requests and use the same domain for frontend and API. If you are using e.g. a Kubernetes setup, you can still use different pods for frontend and API but the routing must map them to sub-directories of the same domain.
Professional support and custom implementation are available at Aimeos.com
If you like Aimeos, Image give us a star

Post Reply