question

putline1 avatar image
putline1 asked cherry commented

How I can send an post order using Ajax

I am trying to post orders from my website to pos system. But I am getting error 401 Unauthorized.

$.ajax ({    
	url: "https://sandbox.dev.clover.com/v3/merchants/{MID}/orders/{ORDER-ID}",
	type: "POST",
	data: JSON.stringify({"state":"open"}),
	dataType: "json",
	contentType: "application/json; charset=utf-8",
	success: function(){
	        alert("Order state updated to Open!");
	}
});

This error from Chrome browser


Its first time for me creating an app so I am wondering if there is a step I have to do in order to authorize requests coming from my website domain.
OrdersREST APIAPI TokenAuth
svsvsvsvsvsvsv.png (13.5 KiB)
1 comment
10 |2000

Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

cherry avatar image cherry commented ·

The 401 Unauthorized error means your request lacks proper authentication. To fix this, include an Authorization: Bearer YOUR_ACCESS_TOKEN header in your AJAX request. Ensure your API token is valid and has the correct permissions. Also, check if your website domain is authorized to interact with the Clover API. Patrick Mekari


0 Likes 0 ·

1 Answer

Jonathan Ryan Grice avatar image
Jonathan Ryan Grice answered Jonathan Ryan Grice edited
You can not create a true JavaScript client since Clover doesn't allow JSONP. You must use a server side fetch script PHP, ASP, etc. I found this out from trial and error since there isn't much documentation about it on the Developers site. However there is a way you can set this up to work.

The easiest setup for a "true" JavaScript client would be the following steps.
  1. Have a server with Apache and PHP
  2. Get the Single-File PHP-based proxy from over on github and follow the setup instructions including adding the clover domain name and your domain name to the array in the setup file.
  3. Create a .htaccess file with the following two lines and save it to the same folder as your proxy script.
RewriteCond %{HTTP:Authorization} ^(.+)$
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
Instead of pointing to the Clover URL in jquery, point it to the proxy script, i.e. " https://www.example.com/proxy.php?csurl=https://[cloverapi]/[Endpoint]"

Your jquery seems right.
Make sure you pass the header key in your $.ajax array with {"Authorization": "Bearer xxxxxxyourapitokenxxxxx"} as the value as Apache will now pass the Authorization header to the script with the custom .htaccess file.

Make sure you take appropriate security measures so someone else can't access your proxy script.

Cheers.
10 |2000

Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

Welcome to the
Clover Developer Community