Web flow CMS API : CORS error

Design help Custom code
1

Hello Folks,

I am trying to fill in collection properties using Web flow CMS API.
I have JavaScript code and sending post request to CMS api to add an item into CMS collection.
I am getting CORS issue.

On the other hand if I invoke same URL along with identical body items are getting created into the collection.

Does webflow cms api support javascript post requests?

cors error
cors error1108×399 95.6 KB

Here is the code

var data ={“_archived”: false,
“_draft”: false,
“name”:“test eb request”,
“price”: 200,
“description”:“test”,
“offerings”: “5f7c9b303c8dba2400432fb8”,
“slug”:“test web 1”
};
$.ajax({
type:“POST”,
url:“https://api.webflow.com/collections/5f9048f656d14c0f6369cf99/items”,
beforeSend: function(xhr) {
xhr.setRequestHeader(“Authorization”, "Bearer " + window.btoa(“api key”));
},
data: JSON.stringify(data),
contentType: ‘application/json’,
acceptVersion:‘1.0.0’,
success: function(res) {
console.log(res);
console.log(“Added”);
}.bind(this),
error: function(xhr, status, err) {
console.error(xhr, status, err.toString());
}.bind(this)
});

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

Hey,

are you using Javascript on the client side, or Node.js? I’m pretty sure you need to use Node on the server side to make post requests.

Also, have you set your own private API-key as a header for the post request?

3

Hi @robingranqvist,

Thank you for the reply.

Yes I am using JavaScript on client side. And have own private-key.

Do I need to send any specific parameter to avoid CORS error?

Regards,
Datta Pawar

4

Hey,

as I said, I’m pretty sure you need to make your post/put/delete requests in Node.js (server side Javascript) since doing it through client side Javascript would expose quite a few security issues.

5

Yes I am ware about risks, Since the website that is being built is intended for internal use. So for time being we are good with client side programming.

6

@robingranqvist is right, it can’t be done in the browser because of the server’s CORS settings. You have to do it from nodejs, curl, or any other non-browser HTTP client that doesn’t enforce CORS.