Paypal issues

[Bruce Stuart]

With some investment of time - and some investment of patience - I got past ALL of the issues with the new builder - and can successfully take a payment via my App now (Still in test mode - but I thought I'd mention it here)....

I'm going to create (tomorrow) a .ppt - that I'll transform into a pdf - that shows the steps I took to 'change the tutorial' - into a mostly working model (my model is still a little rough - but - it's no rougher than the tutorial - and it has the advantage of working lol ).

Anyone interested? I've had enough for today !! so just let me know if you'd like the info.,...

best,

Bruce

[Richard7452343]

Hi Bruce,

I'd be very interested in the info!

Regards

Rich

[Bruce Stuart]

Ok. I'm going to post this in the order I learned it (rather than in a PPT) and folks can poke questions along the way.

First - thanks for Max Katz for putting together the tutorial. My posts here are only to update the tutorial - and perhaps make it a little easier for us to use - since the builder has changed since the tutorial.

Step 1 - I learned from my experiences with the Facebook API - that it's a good idea for ease of use - and for security - to set up a 'Settings' for each of your API's to hold the Secrets.

So - in the tutorlal Max tells you to set up a PayPal account, and then set up your application in PayPal in the developers Portal. Be sure to set up your PayPal account, and follow the API reference here:

https://developer.paypal.com/webapps/...

After you've set up your account as instructed in the tutorial. Add this step. In your project - Select 'Create New' *Green dropdown at left... and select 'Service' - in create new service - select "Settings" as show below, Change the Name of your service to "PayPalSettings" - and click 'Create Service" .

When you click create service - you'll have a blank 'seetings service' . On the line that says - enter new parameter name - enter the parameter names shown below. (All 4) . The descriptions at the right in the photo - if you've watched the tutorial - you know where to grab these items - please put them in the middle column for 'value'. When you are done - you'll have a UI that looks something like this:

You're now done with step 1.

[Bruce Stuart]

In the Tutorial - Max has you create services for getting a token, using the token to get a payment, and then using the approval to execute the payment. I've called these services (and in my other examples) PayPalGetToken, PayPalPayment and PayPalExecute. If you need to follow my code (you by no means have to) - name your services the same.

For the PayPalGetToken - I've basically used the services the way Max set them up - However - when I executed them in test (the test button in the service) they worked - but not when I clicked test for my app. I then remembered that the proxy service has changed the way it worked. So - here's the deal. Set up all your services to use Proxy (and I used a generic security context as well) - but go to proxy and change them to use the Old Proxy . This made all the difference for me - not sure if it does for you - but - it got me past my first hurdle.

Set your proxy this way:

Changes I made to the get Token service - all the relevant pages of the service are shown here:

[Bruce Stuart]

Step 2 - Set up the memory variables you will use - In the tutorial - the builder at the time supported adding localStorage vars 'on the fly' - when creating a service. That feature does not exist any longer - so go ahead and set up your memvars in advance of further coding. my memvars were sppkey (where I'm saving the token which is the end result of executing the service PayPayToken), sPayID - where I'm saving the Payment id (the result of the PayPalPayment service) and the URL to navigate the user to sApprovalURL (also from the PayPalPayment service) - and the sPayPalPayerID (which comes back after the user enters a successful payment at the sApprovalURL).

Call them what you will - that's what I called them - and they are all of type string - as shown below.

[Bruce Stuart]

Step 3 - Execute the PayPalGetToken service pretty much the way Max does in the tutorial. I suggest the following changes.

a. Log EVERYTHING ! It's a good best practice - every step of the way - log something to the console..... you'll know what's going on in your app - when it's happening.(I know this is restating the obvious but there are a lot of posts here where folks complain about not knowing when or how their app blew up.... ).

b. Create an Error-log handler - a generic one - and put it in every service. It will make your error handling so much better. Here's a generic error log function I use. It's not the best - but - it handles errors in services.

function flog_error(jqXHR, textStatus, errorThrown, cMessage ){
console.log('you ended up in the generic flog_error');
try {
console.log(JSON.parse(jqXHR.responseText).description + " " + textStatus);
alert(JSON.parse(jqXHR.responseText).description);
}
catch (e) {
alert( cMessage );
}

Call it - onError - in your services. Here are the screen shots of the code for the services. Note - there is no mapping in the before send so I've not shown it.

[Bruce Stuart]

Step 4 - Build your service to get the PayID and URL - Called PayPalPayment. This was the trickiest challenge to get around. Here's what my service ended up looking like - It's very much like Max's service - however - this is what it looks like in the new builder, and here are the 'hints' to using it - working it with the new builder:

a. I was not able to get this service to 'test' - because I could not get data into the total and currency fields shown in image 4 below. So - in order to get the response set up correctly - I borrowed a tip that Max shows later in his demo. I went to the PayPal API link (shown above) - found the sample response - copied it into the builder in image 4 below (just copy and paste) - and then clicked the 'Import as Response' button.

For convenience - when you set up your service - after you've finished with images 1 - 4 below - you will want to set up the response. I've saved the sample text on my web server here: (just copy and paste it into your builder - and click import as response button).

http://the-software-studio.com/javasc...

b. Be sure to pay attention to the 'Types' at right. They are important - I could not get the service to execute correctly - until I ended up with this structure in my request body (image 4).

Code: Select all

[url=https://d2r1vs3d9006ap.cloudfront.net/s3_images/1187749/Step4-1.png?1428876190][img]https://d2r1vs3d9006ap.cloudfront.net/s3_images/1187749/Step4-1_inline.png?1428876190[/img] [/url] 

and your response page should look like this - when collapsed most of the way (Remember you created the response by importing the sample response above...)

Once you're done setting up your service - like Max did in the tutorial - you're now ready to execute this service. I am assuming that no one will use these posts - without first listening to the tutorial Max has here:

https://www.youtube.com/watch?v=1w-_z...

Next step - Step 5 - Execute the service you just set up

[Bruce Stuart]

Step 5 - Execute the PayPalPayment service - Here's what's in my builder - to execute the Payment event -(which in the last UI - calls the PayPal Website from your app).

Remember - this 'service' is being called from the success event of the PayPalToken service - whatever you've called it on your page - here - that calling service was service_paypal_token (shown above under step 3).

[Bruce Stuart]

Step 6 - Build your PayPalExecute service. Note - like all other services - Create new - service . When you create your service - it should look like this....

Finally - again - you'll want to build your response from the sample response on the PayPal site - again - I've copied it and placed it on my web server here:

http://the-software-studio.com/javasc...

Copy it into the test response tab - and then click "Import as Response" - your response tab will now look like this:

[Bruce Stuart]

Step 7 - Finally - whew - you're ready to tie it all together - and get a payment finalized with PayPal. So - how does that happen?

The logic flow that PayPal draws you through is:

1. Get a Token

2. With the token get a payment ID and a URL to send the buyer to - and then send them there (we've done all that above). Also - above you created the URLS where the buyer goes after they've either bailed &-or failed on payment - and you've created the Page where they go - when they successfully pay for your item. We're going to go to that now. My Page - is called PayPalApproved(.html implied).

3. The buyer has now approved payment - payPal returns control to my App by calling my Approval_url - and I've built the events and this page as follows: (this is pretty much straight from the tutorial - I've expanded it only slightly....)

   UI - and page load event:

   

   The events and mappings in the service....:

   

   

   

   

   Questions ?? Post here - or you can email me at a href="mailto:Bruce.Stuart@the-software-studio.com" rel="nofollow"Bruce.Stuart@the-software-studio.com/a...