Payment gateways can be considered as perhaps the most fundamental factor with regards to building an online store. These days, there are different payment gateways from outsiders that you can incorporate into your checkout page. However, with the Shopify platform, a payment passage can be handily assembled just by utilizing Shopify Hosted payment SDK.
On the off chance that you are totally new to this subject or you are searching for more data on Shopify Hosted Payment SDK, at that point, this composition on How to build a payment gateway using Shopify Hosted payment SDK is for you.
However, kindly mercifully note that admittance to the Hosted Payment SDK is limited, so you should be allowed first to build a payment door!
What's Shopify Hosted Payment SDK?
Shopify Hosted Payment SDK is a payment entryway designed and supported by the Shopify group to help associate your hosted payment page with all checkouts actualized on Shopify. All Hosted Payment SDK reconciliations are grounded in a full-page divert on the last checkout step of the checkout stream. This offers a normalized interface for a ton of outsider payment gateways. By utilizing predefined values, Shopify checkout will divert visitors and customers to the payment page that you give. In the wake of completing the payment, they will be redirected back to the Shopify page where the request status is shown.
How Shopify Hosted payment SDK works?
Working as a transaction - hosted payment page integrator, Hosted Payment SDK is employed in almost all steps of the checkout process, including 6 stages. Not all of them can be visually seen by customers.+
Stage 1: In this stage, your customer places an order with Shopify Checkout. Their email, shipping address, and delivery method will be filled in. Then they have to select your gateway as a payment option.
Stage 2: After step 1, the customer will be redirected to the URL of your gateway using a post request. Your gateway’s job is to verify the -x_signature_ value and presents its own hosted payment page to your customer.
Stage 3: On the hosted payment page provided, the customer needs to pay for the order.
Stage 4: Customers who have got the payment flow done will be redirected back to x_url_complete with required Response Values as query parameters, including x_signature. Those who exit the payment flow before finishing it will be redirected back to x_url_cancel.
Stage 5: It would be the best working method for your payment gateway to be in use to post a callback to x_url_callback with the same Response Values. This is to make certain that all orders can be successfully completed even if the Shopify - customer connection is prematurely terminated. Please kindly note that all callbacks need to be in POST HTTP x-www-form-urlencoded format.
Stage 6: Customers will be redirected to a thank-you page for completing an order. However, please note that:
HTTP 200 does indicate successful receipt of a Shopify callback. Otherwise, we recommend up to 5 retries together with an interval of 1 minute (at least)
Shopify will ignore duplicate requests.
Using the Hosted Payment Simulator to develop your hosted payment gateway integration
Step 1: Add a payment gateway
Change your gateway’s Redirect URL to https:// offsite-gateway-sim.shopifycloud.com/ or add a payment gateway.
Step 2: Activate your payment gateway
Now you can see your gateway available in your development store, located under the drop-down list named Credit Cards or Alternative Gateways. Find and activate it with these credentials:
- Username - any non-empty value
- Password / HMAC Key - iU44RWxeik
This gateway will redirect your customers to https:// offsite-gateway-sim.shopifycloud.com/.
Step 3: Complete-a-test-purchase
Try placing an order on your website. In case there is no product in your store, then it’s a must for you to add one before completing a purchase.
Adding a gateway to your Shopify Partner’s account
After completing your payment gateway’s development, now you can add it to your development store. Let’s take a look at those steps below:
Step 1: Login
Sign in to your Shopify Dashboard.
Step 2: Open Gateways
In the Shopify Dashboard, choose Gateways which is under the Apps section.
Step 3: Create a Gateway
Next, choose Create Gateway
Step 4: Fill in required fields
Fill in these fields with your gateway’s information:
Gateway Name: It will be displayed in the merchant payment settings and on checkout pages as a payment option.
Gateway Website: This URL will be provided within the payment settings. Customers can also use it to review your service.
Gateway Logo: The logo will be displayed in the size of 24 x 220 pixels.
Gateway Category: Your gateway will be displayed under this category, within payment settings.
Login Label: Describes the sign-in credential types for the gateway like Account Number or Username.
Password Label: Describes passwords for the gateway like Secret Key or Password.
Redirect URL: Customers will be redirected to this address at checkout. All request values that will be sent must be handled by this URL.
Sandbox URL: You are allowed to send test transactions to this URL. This is optional.
Payment Types: Appears next to your logo at checkout.
Countries Served: Countries where merchant accounts are available and are supported.
Adding order management to your gateway
.............
To see more information, come to the guide article source at: https://avada.io/shopify/docs/shopify-hosted-payment-sdk.html