HI everyone, I'm trying to get Kratos working with a Vue3 application. I'm struggling with CORS. I'm making a

fetch

request to my Kratos instance at

<http://127.0.0.1:4433/self-service/login/browser>

and that request fails with

Access to fetch at '<http://127.0.0.1:4433/self-service/login/browser>' from origin '<http://127.0.0.1:1234>' has been blocked by CORS policy: 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'.

If I adjust the Kratos config to be like

serve:
  public:
    base_url: <http://127.0.0.1:4433/>
    cors:
      enabled: true
      allowed_origins:
        - <https://127.0.0.1>

The request is then failing with:

Access to fetch at '<http://127.0.0.1:4433/self-service/login/browser>' from origin '<http://127.0.0.1:1234>' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

my Vue application is running at

127.0.0.1:1234

Here's how I'm making the request

await fetch(`<http://127.0.0.1:4433/self-service/login/browser>`, {
    headers: { Accept: "application/json" },
    credentials: "include",
});

I get similar results if I'm using

sdk.toSession()

or other SDK methods. My setup for those trials is:

const apiBaseUrl = "<http://127.0.0.1:4433>";

const sdk = new V0alpha2Api(
    new Configuration({
        basePath: apiBaseUrl,
        baseOptions: {
            // Ensures we send cookies in the CORS requests.
            withCredentials: true,
        },
    })
);

I'm not great with all these security features and that's why I turned to Kratos. I'm not sure what I'm doing wrong here, I think it might be a an issue with the configuration but I'm not sure. I'd appreciate any hints!

Hi @acoustic-insurance-23566 The origin needs to match including the port. Add to kratos config the origin of your application URL in full: e.g. https://127.0.0.1:4000 https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Origin

i think

:1234

specifically is missing

Thanks! It looks like that solves it!