Guys I been spending 3 days on this, no matter how many times I call support or research online I can’t figure this out And I’m even a programmer my self.
I have a website already built, from scratch. No 3rd party at all there’s no shopify or godaddy etc etc I built it from scratch. All I’m trying to do, is to allow my customers to pay for what ever product they add to their cart on my website.
I have the API credentials. I’m just trying to build a HTML < form > that will send the info to Square and customer entering their customer info but don’t know even where to start.
I have ADHD so reading is soo hard. All I get are links that has soo many pages of content and I don’t even know which one applies to me.
am I supposed to build a form where customer enters credit card info on MY page and then send it via api to square? or am I supposed to have an iframe on my checkout page, load a square page in to that iframe where customer enters credit card info? I also want to offer to pay via apple pay etc etc…
If you’re wanting to build it all yourself, you would need to implement the Square Payment Form, which essentially is four divs that allows a customer to enter their card details, and it generates a secure token called a nonce. You would then use this nonce to pass to the CreatePayment endpoint to actually…create a payment .
The Square Payment Form does support digital wallets as well, so that should fit your needs. It is a Javascript library, and you will need a backend server to handle the API requests, though. Please let me know if you have additional questions or concerns!
You’re awesome!
I’m trying to build a multi-element (it looks a bit more user-friendly than single-element).
Question 1:
So I build some type of HTML + Javascript, and have the customer fill out their credit card information on my website and then send it to squareup, correct?
Question 2:
I was under the impression that I was not supposed to be the one handling any credit card information. And that when they enter their card info, it will actually be on their end and I wouldn’t have to send that info to them. Am I wrong?
Question 3:
So this code below is pretty much all I need on my checkout for now (I know there’s a processing section but right now I’m talking about the initial stage)
All of the nonce generation is handled in the Javascript library. When the customer fills out the form and submits it, you will call requestCardNonce which will attempt to create a nonce based on the information provided. The form has a callback that will give you either errors or a nonce when a customer submits it. Then, you need to actually do something with the nonce (like pass it to CreatePayment) to charge their card.
Not sure what you mean by “send that info to them”. No card data will be transmitted over the network or to your back-end; the library is solely client-side until you have the nonce (which you can’t get raw data from anyway). You do not handle card data directly, nor do you need to be PCI compliant; Square handles all of that.
Looks like it’s missing some information. The SqPaymentForm will also need to know who’s requesting it (which is the applicationId, which is a parameter). The rest looks correct; the elementId's will correspond to your front-end HTML divs (i.e give them the same ids so they match). The cardNonceResponseReceived will be the callback that lets you know if an error occurred or if you received a nonce.
The nonce generation is part of the Javascript library. It cannot be handled by PHP since it’s a client-side implementation. The rest, you’ll need a backend language (like PHP), to actually call CreatePayment. So essentially, you’ll need to utilize both Javascript and PHP to go all the way from receiving the card info, to creating the payment.
If you set up everything else correctly, it will convert the div into an iframe with an input field inside. If you’re not seeing that, then something is going wrong and you should check your browser console for more information about potential errors.
according to this, you can some how convert the nonce to a hidden form input element, and then on submission, that data can be used by php to be stored in your data base. However, I’ve had struggles getting this form to load. Its not as simple as the sqpaymentform, or maybe just dated. I dont know, but the nonce should be able to be converted to php according to this documentation.
The above payment example is the Square Payment Form. It uses it in the front end Javascript, and passes the nonce to the backend PHP to process the payment. Definitely a good place to start, though to get an idea of how it should work.
A. Yes, that’s fine. Application ids are not secrets, but access tokens are. You need the access token to make any API calls, and can’t do that with just the application id.
B. “autoload.php” is the file that is automatically created by Composer, if you install the PHP SDK from Composer. It’s a file that basically links all the SDK components for you so you don’t have to manually do it. If you use Composer, I believe it will be generate a vendor directory, and autoload.php will be in there.
It should take just few seconds to check the files. These 2 are all I need to process a payment right?
My second question, I was able to get the autoload stuff uploaded.
But when trying a test square credit card I get:
string(20) “AUTHENTICATION_ERROR”
[“code”]=>
string(12) “UNAUTHORIZED”
[“detail”]=>
string(352) “The Authorization http header of your request was incorrect or expired. The header value is expected to be of the format “Bearer TOKEN” (without quotation marks), where TOKEN is a valid access token (e.g. “Bearer ABC123def456GHI789jkl0”). For more information, see /developer.squareup.com/docs/build-basics/using-rest-api#set-the-headers .”
}
Any idea what I might be doing wrong?
Question 3: I don’t need to install any certificate and stuff right?
I’m sorry guys…I spent TEN DAYS hours each day trying to figure this out
I’m begging you guys…please help me
You’ll need an additional file to actually call CreatePayment. In the above example, there is another PHP page titled process-card.php that does this.
UNAUTHORIZED errors means you’re inputting an invalid Square access token. If you’re trying to use sandbox, be sure to use sandbox environment and sandbox access token and vice-versa for production. The PHP SDK lets you do this by:
Outside of localhost, you will need an SSL certificate to use the Square Payment Form, yes. Your hosting provider should be able to assist with that, though.
It is in fact “process-card.php” file I’m currently working on and having issues with.
I am 100% sure I am using the correct SANDBOX token.
<?php
$access_token = "I did put my sandbox token here";
require 'vendor/autoload.php';
use Square\Models\Money;
use Square\Models\CreatePaymentRequest;
use Square\Exceptions\ApiException;
use Square\SquareClient;
// Initialize the Square client.
$client = new SquareClient([
'accessToken' => $access_token,
'environment' => Environment::SANDBOX
]);
Question 1: Any idea why the “$client = new SquareClient([” above stops the entire php code?
Are you seeing anything in your console log? You should be getting some information about why it’s stopping. If it’s actually stopping on that line, it sounds like you may have broken the link again and it doesn’t know about SquareClient at all, but hard to know for sure without the errors. How were you getting the UNAUTHORIZED error earlier (that would be beyond the SquareClient line, so it seems like you were getting further earlier)?
As for the spam: I think due the numerous links; I restored your posts.
The error file says:
“Uncaught Error: Class ‘SquareConnect\Configuration’ not found”
But this is from: require ‘vendor/autoload.php’;
There’s no error refgarding the “$client = new SquareClient([” in the error file.
The word “Configuration” does not even exist in the “autoload.php” file.
The auth error I was getting before, was because I was using another “process-card.php” file.
But that one didn’t have “$client = new SquareClient([” and the word “createPayment” did not even exist in that version of process-card.php.
So I don’t know which one to use… seriously this is the most difficult project I ever worked on. Why in the world has square made it sooo difficult :S
It sounds like you are getting the two files confused. SquareConnect\Configuration’ not found is from the previous one you mentioned earlier in the thread (and from the old SDK). If you’re seeing that error, then I’m guessing you’re using the wrong PHP file that still is using SquareConnect\Configuration’ instead of the SquareClient, since the file you provided last has no mention of SquareConnect\Configuration’ it wouldn’t be able to throw that error.
And I’m even a programmer my self.
.