I am trying to implement the iframe integration and receiving this error when I call clover.createToken().
Access to fetch at 'https://token-sandbox.dev.clover.com/v1/tokens' from origin 'https://checkout.sandbox.dev.clover.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
Why are you calling the tokens endpoint? The point of using the iframe is that tokenization happens on the Clover side to reduce your PCI exposure.
It is the script loaded from https://checkout.sandbox.dev.clover.com/sdk.js which is doing the calling, when clover.createToken() is invoked.
You are going down the wrong path and not making much sense. The token call is made from within the iframe on a page Clover controls, so you worrying about or trying to do something with CORs headers makes no sense. I am guessing you are using the wrong token when you are initializing the SDK. You should be using the PAKMS or public key. Here is a working example which basically proves there is no CORs issue on Clover's end. However, I am not sure if the token comes from a developer app making a call to retrieve the PAKMS or an e-commerce merchant token.
https://codepen.io/davidmarginian/pen/JjXLRwM
Note, you cannot make the charge request from the front-end or you will get a CORs error. That call MUST be made from the server.
FYI, I just logged into my developer account, create a merchant ecommerce token, plugged the public key into the working example I posted above (https://codepen.io/davidmarginian/pen/JjXLRwM) and it worked. So, everything is working fine, not sure what you are doing wrong.
7 People are following this question.
