Developer forum

Forum » Development » Dynamicweb API - Product endpoint - CORS restriction

Dynamicweb API - Product endpoint - CORS restriction

E-mail notifications
Snaevar Petursson
Snaevar Petursson
Reply
Posted on 11/03/2021 19:09:05

Good afternoon!

I ran into a small inconvenience with CORS while developing against the new awesome DW API. 

When sendinga POST request against the "/dwapi/ecommerce/products" endpoint I started getting the following error.



So i figured i'd set up a local version of the API, which I then could add the <add name="Access-Control-Allow-Origin" value="*" />  custom header to solve this issue.
However I got this error instead: 


It seems like the OPTION preflight request is not getting a HTTP ok status, which I'm not finding a good solution to fix (other than using a proxy) 

Kind regards,
Snævar


Replies

 
Martin Vang
Martin Vang
Posted on 12/03/2021 09:01:16
Reply
This post has been marked as an answer

Hi Snævar,

Honestly this kind of thing is a security issue, so hacking a bit to get it to work seems to only real viable option. The whole point is, that the requesting site is not allowed to cross domains to target another site so, localhost != named site

I did a workarround with a proxy as you mentioned, and found no real issues with it. Now, I don't know what/how you're developing, so I'm just going to explain what I needed to do to get my React SPA up and running:

1.  Go to package.json

2. Add   "proxy": "http://my.local.dynamicwebite-name.dk/"

3. Done

Since this was so easy for me, I stopped looking for other solutions, beacuse at that point I had already been arguing with my screen for the better part of a day (because sometimes the CORS rules seem strangely strict and anti-developer). It's also very important to note that it's the browerser that inforces this, so there is very little we can do to fix it (you could submit a feature request @Firefox+Chrome, but ... youknow. ;) )

Hope this helps you get things up and running.

BR

Martin

ps. Her is a link to the PoC SPA that was part of the release of the endpoints: https://doc.dynamicweb.com/extensibility/guides/how-to-build-a-dw-spa

Votes for this answer: 1
 
Nicolai Pedersen
Posted on 12/03/2021 09:14:39
Reply

What happens if you do not use * in Access-Control-Allow-Origin but the actual host?

 
Snaevar Petursson
Snaevar Petursson
Posted on 12/03/2021 12:15:43
Reply

I get the same error message if I include the host instead of * in the custom header.

Just to clarify, the POST endpoints are the only ones I´m having trouble with, all the others work perfectly fine

Kinds regards,

Snævar

 
Snaevar Petursson
Snaevar Petursson
Posted on 12/03/2021 12:18:36
Reply

Thanks for the answer Martin! 

Good to know someone else had to deal with this too.

I´ll stick to using the proxy then!

Kind regards,
Snævar

 
Nicolai Pedersen
Posted on 12/03/2021 15:02:19
Reply

Can you show us the entire JS that makes the post?

 
Snaevar Petursson
Snaevar Petursson
Posted on 12/03/2021 15:22:59
Reply

I absolutely can!
 

It's a fairly simple axios post request, works with a proxy set up but no without.

 

 
Nicolai Pedersen
Posted on 12/03/2021 15:27:36
Reply

ok, cannot see what that request send as headers.

My reasoning for asking is that you might have something in the request headers that triggers the cors for this specific post. Take a look at "Simple requests" section at MDN: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

BR Nicolai

 
Snaevar Petursson
Snaevar Petursson
Posted on 12/03/2021 15:40:28
Reply

These are the request headers
 

  1. Accept:
    application/json, text/plain, */*
  2. Access-Control-Allow-Origin:
    *
  3. Cache-Control:
    no-cache
  4. Content-Type:
    application/json;charset=UTF-8
  5. Referer:
    http://localhost:8080/
  6.  
    User-Agent:
    Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.190 Safari/537.3

 

 
Nicolai Pedersen
Posted on 12/03/2021 15:55:06
Reply

Thanks. I think it is because of the Content-Type header. When you set that to application/json the request will no longer be considered a 'simple' request by the browser, causing the CORS from the browser to kick in.

So you can probably also solve the CORS problem changing the content-type header to the value "application/x-www-form-urlencoded" instead. See https://github.com/axios/axios#using-applicationx-www-form-urlencoded-format

BR Nicolai

 
Snaevar Petursson
Snaevar Petursson
Posted on 12/03/2021 16:13:20
Reply

I did originally try that but since the request content-type was no longer json I kept getting a 500 error and not having the source code it was fairly hard to debug from my end.

 
Mikkel Ulstrup
Posted on 16/06/2021 10:59:13
Reply

Hi,

A followup on the thread - let me know if I should post a new one :)

The GET and the POST methods works fine as long as we keep them as simple requests (using "application/x-www-form-urlencoded"). However when working with the cart - using PATCH and DELETE (for /dwapi/ecommerce/carts/{secret}) a simple request is not an option.

All modern browsers sends and "OPTIONS" request (the so-called preflight), but this method is not supported.

Any chance that we could get support for OPTIONS? I think this would make the API usable from browser :)

 

/ Mikkel Ulstrup

 
Anders Ebdrup
Anders Ebdrup
Posted on 25/02/2022 10:25:00
Reply

Dear Dynamicweb,

 

Do we have any update here?

 

Best regards, Anders

 

You must be logged in to post in the forum