PENG YING: Hi, and welcome to Google Developers Live.
With me today is my colleague Maru.
MARU AHUES: Hi, Peng.
PENG YING: Hi, Maru.
Now, what we're talking about today
is the Google Wallet Objects API.
This is another video in our series
of videos about the Wallet Objects API.
And today, we're going to talk about the Wallet Objects
quick start for Ruby.
The goal of these quick starts is
to help you hit the ground running in your Wallet Objects
API integration.
In each of these quick starts, we cover a few things.
We cover, hey, how do you authorize OAuth 2.0 access
to the resources?
We cover how to insert a Wallet Objects class.
We cover save to Wallet and how to create a Wallet Object.
And lastly, we cover the Wallet web service API,
which is how do you enable a discoverable,
and how do you allow people to sign up
for specifically loyalty objects?
And to walk through getting the Ruby quick start up
and running, here's Maru.
MARU AHUES: Thank you, Peng.
Now, let's go into our documentation
to get the instructions on how to download, install,
and configure the Ruby quick start.
First thing is go to our developers.google.com/commerce/wallet,
and then from there, go to the Google Wallet Objects and click
on Quick Start Samples and then Ruby.
Once you're there, the first thing that I recommend you do
is watch the video that we have on how
to set up your account, your OAuth account,
and get your credentials.
Once you do that, then the first thing we're going to do
is download the sample code.
To do that, we're going to go into GitHub.
Our code is open source, and you can download it
or you can clone it from GitHub.
To do that, the URL is github.com/googlewallet/walletobjects-quickstart-ruby.
From here we can just copy the URL
and clone it, or download it to our local computer.
On my computer here, I have it already cloned.
So this is our directory.
And these are the files that we have for the quick start.
And take, now, a copy of your private key--
the one that you downloaded when you created your credentials--
and copy it into this directory.
In my case, my private key is called wolves-privatekey.p12.
So I already created it and copied it into this directory.
Now, let's go and configure and make sure
that we're using the credentials that we got into our project.
To do that, let's open the file called wavsconstants.rv.
So I'm going to open it here in my editor.
And I already have it here.
And from here, let's change some of these values.
The first one is the service account email address.
To get that, you'll need to go into the cloud,
onto your Cloud Console here, then click on APIs-- Registered
Apps, I'm sorry.
Service Account-project.
And from here, this is your email address
that you'll need to use as a service account email address.
So I'm just going to copy that and paste it here in my file.
And also, now, get your esure ID.
You can find that from the merchant dashboard.
So in here, just by going into Account Management,
we can copy paste the esure ID.
So we're copying that into here.
And now, go into the service account private key.
For the service account private key,
this is the name of my private key.
But if you have a different name,
you also need to modify that.
The application name-- this value
doesn't need to match any of the values
that you had when you created your account.
So in our case, we have by default Wallet Objects API
Demo, and you can leave that value there.
For the origins, this URL is the URL
where we're going to be running the quick start locally.
So we have local host and then port 8080.
If you're going to be changing the port,
then you need to modify this value.
Otherwise you can leave it as this.
Then we have four different IDs for the loyalty class object
ID, for the class object, and for the offers, as well.
In this case, you can leave them as this, or we can modify them.
If you've been running the quick start
and you want to create a new class,
then you'll need to change these.
So let's say demo one for each of these.
Once we have these, we should be able to run the quick starts.
But before we do that, let's make sure
that we have our prerequisites done here.
So first, let's check our Ruby version.
So to do that just run version-- and I'm running 2.0.
You need to be running at least 1.93.
So if that's good, and you don't need to upgrade your Ruby,
then now let's move into our gems.
For the gems, we need to have four gems installed
for the quick start.
We need to have JSON, the Google API client, the JWT,
and Sinatra.
So let's run-- maybe you already have
some of these installed, so first let's
run gem query-- local to see which ones we have.
And in my case, I have them all.
I have Sinatra, Google API Client, JSON, and JWT.
If you don't have one of these, then it's very easy.
Just do gem install and the name of the gem.
So I can do here, JSON.
So since I already installed them, we don't need to do that.
Now, once we have that, we have the correct version of Ruby.
We downloaded the code.
We also have all our gems installed.
And we modified all our parameters.
Now, all we need to do is just run it.
To do that is very easy.
We're using Sinatra to run the server.
And we'll call it by doing Ruby wobs_server, which
is the name of the Ruby script that we're running.
And then minus p to say that we want
to run it on a specific port.
In this case, I'm running it on port 8080.
So once we run it, now it's telling us
that it's running on port 8080.
Everything's good.
Sinatra is running.
So now, let's go into our browser and see how this looks.
So I have here-- we're going to go into local host port 8080.
Once we run this, you'll see that we have it successfully
running.
Now, what do we have in this page?
We have two steps.
The first step, it says, insert the class, so either
a loyalty class or an offer class.
And then we have two Save to Wallet buttons.
How does this work?
The first thing that you do is that you
need to have a class for whatever vertical
you're working with, so let's say
that we're doing the loyalty.
You'll need to start the class first,
and this is only done once in the system.
You can also, of course, update classes
after you've inserted them, but you only
need to insert it once.
So this button will not be on your site-- this is only here
for us to test, to show you how to create classes
every time you modify something on the call.
But then after, we then started the class,
then you will have a button, or you most probably
will have a button to save the card or a coupon
to the user's Wallet.
So this button, once we click it,
it will create an object on my Google Wallet
account, where I'm signed in, here.
And then we'll be able to see that on the phone,
on the Google Wallet app.
So first, let me create the class by just clicking on that.
Then, it says that it's inserted the class--
loyalty class demo one, which is how we named it --
and now I go into to Save Card to Wallet,
and it saved the card already.
So now, when we go into our Google Wallet App,
we'll see it saved.
And we'll do that during our demo.
PENG YING: And to get a better idea of what
classes and objects are, we also have another Google Developers
Live video covering the concept of what objects
they can take a look at.
MARU AHUES: Now, let's go and look
at the web service API integration.
We also provide a sample code for this in our quick start.
And how this works then, from the Google Wallet app, whenever
a user clicks on either a member or joining the program, what
Google does is Google will send the information
in a case on request to your web service.
Then you will process, on your end,
to either create a new object or send us an existing object.
Is this is a user that already has a loyalty card with you?
Send that information back to us in JSON.
And then we will display it on the phone.
So let's look at how we can configure
that in our discoverable.
From here, from the browser on the merchant dashboard,
if I go into discoverables, you see here
that I'm going to edit it.
And there's a section called merchant callback
configuration.
So in here, you need to add the URL to the host
where you're running your quick start sample,
and here we need it to be running somewhere outside, not
on your local site, so you can be reachable from our service.
And the port, and we recommend that this is running over SSL.
For testing, you can run it over regular HTTP.
But for when you launch the application,
needs to be running over SSL.
Then the path to the web service on our sample,
it's web service.
And of course, you can change that
later to whatever makes sense for you, your application.
Once we have this, we'll-- whenever there's a request,
then Google will send the JSON request to you,
and you'll respond back to it.
Peng is going to do a demo on how this works on the phone,
and then we'll go over the code and see where all of this
is happening in the sample.
PENG YING: All right, let's take a look at the phone.
This is the latest Wallet app.
And within this Wallet app, we can see a few things.
This is what we call the Here and Now page.
As you'll see, I have one loyalty program
that I've joined.
This occurred when Maru clicked Save This Wallet
during the demo.
So let's take a look at that wallet program
first, or let's take a look at loyalty object first.
It's Baconrista Rewards.
This is our demo merchant.
And within it, you can see that hey,
I have 500 points, that the tier I am
is gold, that it's Maru who joints,
and some additional details that a merchant could provide
for their loyalty objects.
Now let's take a look at what a discoverable is,
and the web service API.
So in order to join a new program,
let's say I'm in the store or something,
I want to join a loyalty program.
I hit + to find the loyalty programs that
are available to me.
This list will also be sorted and it'll
show programs that, in the future,
will be relevant to your location.
In this case, I'm going to join our test merchant, which
is CC Baconrista Rewards.
So let's take a look at this discoverable,
and some details about bacon plus coffee,
your best morning every day.
And yes, I'd love to join this one, so I'll click join.
So all of this information that you see now
is information that's populated from my Google Wallet slash
Google account.
And this information can be modified
by changing some conditions and then
discoverable of that bar we just chose.
I accept the terms of service, and I'll
take some promotional emails from this merchant.
Create the account.
So this will take a few seconds to call back to the web service
that Maru just showed, and then it'll
to return objects to the Google service, which will then
push the object display back down to my device.
In this case, I have a second card with a balance.
So in this case, maybe I could show this balance
and use it as my stored value, or something in the future.
So that's a quick demo.
Now here's Maru to talk about how everything works.
MARU AHUES: From the discoverable,
there's one thing that we need to make sure we have set up
once we're doing testing on our end,
is that the status of the discoverable needs to be draft.
If it's draft, that means that no one can see it publicly,
but we can see it on our testing mode.
Also, you will need to share-- If you
go to account management, you'll need to share with the account
that you're using.
In my case here, GWalletDemo is the email address
that Peng is using on the phone.
So as long as you get your discoverable,
you set it on draft and you share with the email addresses
of the accounts that you want to share your discoverable with.
Then you can use it on test mode.
So you won't be live to anyone except when you're testing.
Now, let's look at some of the code
and see how this all works out.
I'm going to open here the editor.
And for the Ruby sample, we have--
most of the code is included in the wobs server RB file.
And what we're doing here is we have-- first in this area,
we have the authentication, and we're
doing that using OAuth 2.0.
You have your credentials, you have your private key,
and your service account email address.
After doing that, we have-- let me open,
first, the index.html so we can look at it.
When we open the sample, the first thing you see
is the index.html page, right?
And there we have the two steps.
The first one has the buttons to insert the loyalty class,
and the second one has the save to wallet buttons.
So on the first one, where we have the insert loyalty class,
we can see that these buttons are rendered
and they're-- here, let me ope it here--
here on the JS file that we are including within the index.html
file, we are associating an action to these.
When we click on the loyalty, then we're
going to be calling insert/loyalty.
The same for the offer button here,
we're going to be calling insert/offer.
then
We also have, when you're calling the loyalty save,
or offer save-- when the page loads,
this when the page loads here, we're calling JWT/loyalty.
And then we're also calling the job/offer for the other button.
And what this is doing is that it's rendering the G save
to Wallet tag on the button, which will,
based on the JS file that we're including on the index.html,
will render the nice Save to Wallet button
that you see on the page.
So how does this work?
When you call the-- first let's look
at the job for the save to Wallet button.
How this works is that you'll go into the wobs server.
And we'll find here the path.
We're saying, if you're calling jobs/anything, then call this.
And what this is doing is that it's creating a job,
and it's including the information of the object
that we're creating-- either a loyalty object or an offer
object.
So this is what we're doing.
We're saying if it's-- the type is loyalty,
then we generate an object and then we add the object
to the payload.
And then we encode the JWT, and here we're
just outputting that.
So what it's doing is that if you
see the page when we load it, and you just
inspect the element, you'll see that it
has the JWT on the URL for that button.
Then, also we have the insert.
If you're going to insert a class,
then we also have-- if you post to insert with a type, what
we're doing in here is that we're generating a class, also
based on the idea that we created on the wobs constants.
And then we're calling the API here.
We're calling our REST API to insert the object-- the class,
in this case.
And that is returning back an answer, and that
is displayed on the page, on the index.html.
Then the last path that we need to look at here
is the web service.
And this is the one that was configured
from the discoverable.
And when you call web service, what it's doing
is that it's checking.
It's getting-- in our case, we are
assuming that we have success-- a successful response-- all
the time.
But you can change this value to return a different message.
So we're saying, if it's successful here,
we're going to create a JWT.
And we're going to send back on the payload
that the result is approved.
And we're going to send the loyalty object back to Google.
So how this works here is that we're
generating an object here.
And we always generate the same one for the sample.
But on your case, you would say, oh it's a new member,
so we generate a new object, and you
generate this object on your end,
and then you send back the information to us.
And then, of course, you put them on the payload,
and you encode it and send it back.
Same way that we do with the other path, with the job path.
If their response is not successful,
then you don't have to send an object.
The only thing you send back is an error message.
And the result is rejected.
In that case, then, Google will display an error
on the Google Wallet app.
We also provide on this sample other paths
to be able to list classes and list objects
and get specific objects.
And those are just examples on how
to call the RESTful APIs using Ruby.
This concludes the Google Wallet Objects Ruby quick start video.
We hope you found this video helpful.
For more videos, please visit us at
developers.google.com/livewallet.
You can also find us in Google+ and/or Twitter.
PENG YING: Yeah, thanks for joining us
for another week of Google Developers Live.
BOTH: See you next time.