I have a simple web app defined. I am not using the sandbox. When I start the app via my clover dashboard it directs to my php page that I defined in my app settings. I have also specified my domain in the CORS field of the app settings.
When my php page loads, I can see that it is receiving the merchantid, employeeid, client_id and code query parameters correctly. The error occurs in my $(document).ready() function. Here is a copy of the function:
$( document ).ready(function() {
merchant_id = getParameterByName('merchant_id');
employee_id = getParameterByName('employee_id');
client_id = getParameterByName('client_id'); // aka the application ID
code = getParameterByName('code');
$data = "<p>merchant_id = " + merchant_id + "<br/>" +
"employee_id = " + employee_id + "<br/>" +
"client_id = " + "<br/>" +
"code = " + code + "</p>";
$("#clover").html($data);
// Get the autorization code from clover:
var cloverAuthcodeURL = "https://www.clover.com/oauth/token?client_id=" + client_id + "&client_secret=" + appSecret + "&code=" + code;
alert("Clover Authcode URL = " + cloverAuthcodeURL);
$("#xact").text(cloverAuthcodeURL);
$.ajax({
method: "GET",
url: cloverAuthcodeURL,
dataType: "json",
beforeSend: function( xhr ) {
xhr.setRequestHeader('Access-Control-Allow-Origin', '*');
}
}).done(function( data ) {
alert(JSON.stringify(data));
access_token = data.access_token;
// Now get the latest order
getLatestOrder(access_token);
}).fail(function( jqxhr, textStatus, error ) {
var err = textStatus + ", " + error;
alert("request failed: " + err);
console.log( "Request Failed: " + err );
});
});
Looking at the Developer console in Chrome (latest version on a Mac) I see 2 errors:
Error 1:
Failed to load resource: https://www.clover.com/oauth/token?client_id=REDACTED&client_secret=REDACTED&code=7efcf4cd-ea12-349a-ae5b-a8140f2b4684
the server responded with a status of 401 (Unauthorized)
Error 2:
XMLHttpRequest cannot load https://www.clover.com/oauth/token?client_id=REDACTED&client_secret=REDACTED&code=7efcf4cd-ea12-349a-ae5b-a8140f2b4684. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://www.bleucafecarson.com' is therefore not allowed access. The response had HTTP status code 401.
Usually, I would address this cross domain problem by defining jsonp in the ajax call, but according to the CORS page, jsonp is not supported. https://docs.clover.com/build/cors/
As I said, I do have my domain defined in the CORS field of the application. Any idea what I am doing wrong? Thanks in advance!
- Jeff
