Hey, I’m having an issues retrieving data from glue in the newest version. All other requests im usi

ULW0Z4150

Hey,
I’m having an issues retrieving data from glue in the newest version. All other requests im using are working fine. But when I try to get the checkout-data, I get the following error:

Access to XMLHttpRequest at '<http://glue.de.spryker.local/checkout-data>' from origin '<http://localhost:8080>' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

I already tried changing the config to allow cross site requests, but that didn’t help.

$config[GlueApplicationConstants::GLUE_APPLICATION_CORS_ALLOW_ORIGIN] = '<http://localhost:8080>';

Furthermore I noticed, that the response I’m getting contains the access-control-allow-origin header, but doesn’t contain the access-control-allow-methods.
The response itself is:

{"errors":[{"detail":"Missing access token.","status":403,"code":"002"}]}

I’m using fetch to make the requests.
I would be grateful for any help.

Eugenia Poidenko

Hi!

So you are requesting /checkout-data from localhost:8080 and the config has

$config[GlueApplicationConstants::GLUE_APPLICATION_CORS_ALLOW_ORIGIN] = '<http://localhost:8080>';

And get the cors error or missing token error?

Eugenia Poidenko

access-control-allow-methods will be returned on OPTIONS request to the endpoint

ULW0Z4150

I’m requesting the data from http://glue.de.spryker.local with code similar to this:

fetch('<http://glue.de.spryker.local/checkout-data>')

The request is coming from localhost:8080 that’s why I put it in the config.
Do I need to send an additional request for the access-control-allow-methods ?

Eugenia Poidenko

are you sure you sent POST request? checkout-data will only allow POSTs regadless of the CORS settings.

ULW0Z4150

Yes I am.
Here is the code im using:

var body = {
                        "data": {
                            "type": "checkout-data",
                            "attributes": {
                                "idCart": "dc69d182-21cb-5916-935b-4cba70ff47ab"
                            }
                        }
                    }

await fetch(process.env.VUE_APP_ROOT_API + '/checkout-data', {
                        method: 'POST',
                        headers: this.getAuthenticationHeader(),
                        body: JSON.stringify(body),
                    })
                    .then((response) => response.json())
                    .then((response) => {
                        console.log('Response:', response);
                    })
                    .catch((error) => {
                        console.error('Error:', error);
                    });

And here is the request header, chrome shows:

OPTIONS /checkout-data HTTP/1.1
Host: [glue.de](http://glue.de).spryker.local
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
Access-Control-Request-Method: POST
Origin: <http://localhost:8080>
Access-Control-Request-Headers: authorization,content-type
Accept: */*
Referer: <http://localhost:8080/>
Accept-Encoding: gzip, deflate
Accept-Language: de-DE,de;q=0.9,en-US;q=0.8,en;q=0.7

Eugenia Poidenko

does it fail with access token or cors error?

I also checked default OPTIONS response headers and the method are there for me 🤔

ULW0Z4150

I’m not quite sure. In the console I get the following messages:

ULW0Z4150

But when I look at the request itself, the response is:
{"errors":[{"detail":"Missing access token.","status":403,"code":"002"}]}

Eugenia Poidenko

are you running spryker in docker?

ULW0Z4150

Yes I am

Eugenia Poidenko

I’d check the $config[GlueApplicationConstants::GLUE_APPLICATION_CORS_ALLOW_ORIGIN] is really configured correctly for docker.
Still I wonder how it would give 403 for the OPTIONS.

ULW0Z4150

I added the config value to the config_default-docker and confirmed that the value is used. That’s whats confusing me too. It’s possible that the error isn’t in my Spryker configuration but in the way I’m sending the request. But I don’t really have an idea what the cause could be

Valerii Trots

Do you have true or false for ssl in the deploy file?

    ssl:
        enabled: false

I had such an error as missing access token trying to access http when ssl was true in docker.

ULW0Z4150

In my deploy file ssl is disabled for docker

Andriy Netseplyayev

@ULW0Z4150 The fact that other endpoints works just fine but this one - is weird. I would go debugging

\Spryker\Glue\GlueApplication\Controller\OptionsController::resourceOptionsAction()

But I suspect that break-point won’t even hit there. This method is supposed to handle OPTIONS request.

Andriy Netseplyayev

Also, have a look at \Spryker\Glue\GlueApplication\GlueApplicationConfig::getCorsAllowedHeaders() and make sure that you’re not sending any headers that are not allowed by CORS policy config

Andriy Netseplyayev

☝ that really looks like the case you described:

Andriy Netseplyayev

…so debug this guy:
\Spryker\Glue\GlueApplication\Rest\Request\HttpRequestValidator::validateAccessControlRequestHeader()

ULW0Z4150

Thanks for your advice. I’ll see what I can find out