Paypal Payment Integration | Client Side Integration with Javascript #3

[Music] welcome to bid films and we are on PayPal payment integration and in this episode we are going to use the checkout and client integration so again you need to go to developer.apple.com click on checkout then you will land on this page so we know about how the process goes on the paypal payment integration so we are not going to talk about again so next step is the client integration so the checkout is containing two steps one is client integration and varnish server integration and let's click on the client integration on the client integration you have lots of steps but the most important part is the code it's given here so why not copy it so let's copy all the codes and then I will explain you each and everything so I will open my vs code and in this vs code I have fresh installation of level but it doesn't matter because we are not going to use much off level for client integration it just JavaScript here so nothing to worry about level is a PHP framework if you are from other language or other resources so let's open our welcome dot plate if you are not familiar with our level so it's just a default page comes with it level so if you open the server the first landing page is this one and this landing page is actually blade file of welcome so what I will do I will delete everything from here and paste the code we get from this website so remember this we need to copy all of these things so how it's going to work so firstly you can see we have a div and we have a paper button okay so if I go here now we have changed this page refresh we have a PayPal button simple very easy but how this is going to execute because we are using people checkout dot J s and by using this you can see this paper button has an ID of people - button using this ID we can now do something so whenever user clicks on this button so we will execute the render part then we are setting up the environment so whether it is for testing mode that means the sandbox or we are on live that means on the production mode we will talk about this client ID in a moment but let's continue next so locale exactly the language which you are going to use and some of the styling for this button so what if I say here blue refresh hennya it's blue now simple enough then move on to the most important part of it which is execution of the payment if you have followed me on the last episode I have told you that when the user clicks on this button execution of payment starts this means we are going to send the payment information to PayPal API and on the API these information are gets saved and given you a payment ID that payment ID refers to do all information you have send to the paper API so here we are using this so first time the user clicks these information these two informations are going to the server of PayPal API and then it will return with the payment ID so here we are just giving the transaction detail there are other details we will talk about these things later so next is when the payment ID is created from the PayPal API then we are going to authorize the user and after the authorization we execute this code which is just an alert saying third thank you for the purchase so let's see this thing in action and yeah here we have just for refresh and click so you can see we have opened a Moodle but it's saying login well but why if you are going to login with our original PayPal ID we are just testing so we need a testing ID for that let's just close it so you can see if we have a sandbox dot people so it's not real it's the just for testing so let's close it and how we can get a sandbox or testing IDs now you need to log in on the paper development or developer.apple.com so let's login and because we are going to login we need to use the actual DL ID just for login so let's login here and after login you will land on this kind of page again maybe later these layouts can change but layouts just going to change not the content so you need to go on the rest api app and here you can create the app so you can see it says sandbox demo sandbox client ID we need to the client ID and by creating the app we can get the client ID we have already created that but for you I will going to create now so it says create app so I will going to give the name of app as tutorial then we need to get the sandbox developer account again how we can get the account we have not created any account so if you go on the left you can see sandbox accounts so let's click here then after we will create the right app for REST API so on this sandbox account if you have logging first time you will get to account by default one is affiliate something and other is a buyer something so it can be like these two if you are not getting any account you can simply create the account to create the account you just need to select the country so then after you need to setup the personal or business account again you need to account for the testing one is who is going to sell the merchant account another is who is going to buy the buyer account so two types of account you need to setup so after giving email password these things are optional and you can simply create the account so I have already created that so I'm not going to create it and I can tell you here is that the type of account these two or one I can set three accounts are we can say business account that means from this account we are going to sell something there are two account which I call it personal account from these two account we are going to purchase things so that's why it's a personal personal and this is personal but but it is business I think this is wrong we are not going to use this one okay no problem so you can get the idea so with this business account we can create our app so my app and credential let's once again go there create app click on create app and now give the tutorial and I am going to use let's say seller at bit films.com create app and by using that you can see the app is created so now we have a client ID and a client secret we will use this secret when we are going to use the server integration but for now we just need this client ID so let's copy that and paste it here we are not going on the production and you know to go on the production on people is super super super easy extremely easy what you need to do click on life get this client ID and boom you our lives no changes in code nothing never that's very nice so let's get back to the sandbox and you can see we have given the sandbox point ID okay so let's now try this so because I have already logged in here so what I'm going to am evelope in the Firefox and let me do one thing once again I will go to sandbox dot paypal.com it's again going to mimic the original website original login system so I'm going to log in here with seller just like if you know we have a sandbox account so seller add bit films IP it has to be between Starcom then one two three four five six seven eight this is the password I have set up when I have created this account so now we are logged in so it's just the mimic of original account original PayPal account when you log in you will get this kind of things so the amount is USD zero we have some kind of purchases which is very less on the amount so it's not reflecting here and on the Firefox I will go to our server is started yeah so let's go on localhost localhost colon 8080 is going to open and now we can use some of the personal account so if I go here on the accounts you can see we have lots of account so let's use personal one so let's go here and personal one and again password is the same for every account one two three four five six seven eight for me and click on the log in so we are clicking on the lock in let's see what's going to happen so yeah one thing or more I can tell you people is unpredicted well you can get errors every time so I have done it many times but still I have a fear of having some kind of error so it's not giving error that's cool so we are getting the continue part so we have authorized and now it is saying that okay pay now or simply continue so let's click on the continue and after this you can see we are having an alert of thank you fault purchase why we are getting this alert because you can see on this on authorize we have given window dot alert of this thing so this means our execution is done our payment is done and we have done successfully the client integration that's super super easy so let's click OK here and go and yeah this is the page for our sandbox account so let's see whether we are getting any payment or not so once again and yeah you can see we have the payment from personnel's hostel - and 31 a.m. which is the current time and we are getting the $20 off payment but we are getting 18.9 - because pimp paypal get some percent and behind-the-scene i have actually changed the amounts so that it will reflect here because point zero one is not going to reflect so one thing what I'm going to do or what I'm going to explain is that this all payment system is on JavaScript and the creating of the payment and execution of the payments and here on authorize we are executing the payment you can see it says payment execute but what if I remove this part and if I remove this part go with the Firefox and try to once again give a payment or process the payment just like we have done before what will be the result so we are doing here and let's see continue and it's done here no alert because we have removed the alert but do we get any payment here let's see refresh here and after some time you can see we are not getting any payment because we have not executed the payment and this execution part we will do on the server end so that we can have the more power like refunding the system and if something bad happens we can tackle that try-catch error you know these things and obviously on the on the JavaScript and it is not more secure than on the server end so we will do these things in the next episode and you know this course took lots of effort to create so I just want your support so support bid films just by following on Facebook Twitter Instagram act bit fumes subscribe to this channel and especially share with your friends we will meet in the next so till then good bye

Channel: Bitfumes

Views: 43,667

Keywords: paypal, paypal integration, paypal integration in php step by step, paypal php integration, paypal php tutorial, paypal php api, paypal laravel 5.6, paypal laravel 5.5, paypal laravel integration, paypal client id, paypal client secret, paypal client id and secret, paypal course, paypal tutorial, paypal tutorial 2018, paypal payment integration in php, paypal payment integration in php/mysqli, paypal payment integration, laravel paypal integration

Id: pR6bolypI1U

Length: 14min 19sec (859 seconds)

Published: Tue Nov 13 2018