Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add 'Add to Wallet' button to website to add coupons to Apple Wallet and Google Pay accounts

First off, I don't even know where to begin with this. I've tried reading through the documentation from Apple and Google, but still don't have the right answers.

My client already displays coupons on their site, which their customers either print or take a screenshot on their phone, to bring into the store to scan for the discount to be applied. They would now like to add the 'Add to Wallet' button to their coupon page so that the user can just add the coupon to their Apple Wallet or Google Pay account.

What steps are involved to do this? I understand that we will have to connect to the Apple/Google APIs to integrate with our site. I'm more confused about how these coupons or 'passes' are generated? It looks like there are plenty of third party services that help you create these passes, but can we do it ourselves? What's involved here?

If anyone has any experience doing exactly this and can give me a helping hand, or point me in the right direction of some good documentation, that would be greatly appreciated!

like image 813
yanant Avatar asked Aug 31 '18 16:08

yanant


People also ask

Can you add to Apple Wallet from website?

Users can add their pass to Apple Wallet directly from a web page opened on iPhone, iPod touch, or Mac. Because users might open the web page on another device, include instructions for opening the page on their iPhone, iPod touch, or Mac.

How do I add coupons to Apple Wallet?

Step 1: Open the email or other communication where you received the card or coupon. Step 2: Scroll through the message or certificate, and look for an option that says Add to Apple Wallet, with a distinctive logo that's the same across brands.


Video Answer


1 Answers

There's two different processes for both pass types:

Apple Wallet

Creating an Apple Wallet pass is described here: Apple Docs. You edit the pass.json describing your pass, then you can sign it using Apple's signpass tool after you have registered a pass type identifier and found your Team ID.

If you want to update the pass to display the information to customers, you would need a server that implements the web service API.

The "Add to Apple Wallet" button would be a image with a link to the .pkpass file you've generated for your customer. There are a few open source tools to create passes on the fly with your language of choice (e.g here).

Google Pay

Here is the docs for creating Google Pay passes. There's an initial bit of signing up to do, then you need to register credentials but after that initial pain, you can create passes and there are a few quick start applications to do so.

Once your pass (in Google terms it's Objects and Classes) is created, how you link the pass is different than Apple and requires embedding a snippet with a signed JWT for the "Save to Google Pay" button to appear, described better here.

If you want to update the pass to display the information to customers, you can interact with a REST API. Here are it's reference docs.

It looks like there are plenty of third party services

As you can see, it's quite the pain to do all this so it makes sense for companies to try to improve the developer experience. At PassNinja we're focusing on making a unified API to make this a lot easier, especially for NFC enabled passes.

like image 183
Scott Condron Avatar answered Oct 24 '22 14:10

Scott Condron