I am working with braintree paypal checkout function, i found jquery code for that, i need to place Braintree Sandbox Auth Key in jquery variable, i created account in braintree, i tried all that code, but in jquery console log it says authrization failed, can anyone please help me where can i find that code ?
Here is my sameple code
<!DOCTYPE html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://www.paypalobjects.com/api/checkout.js"></script>
<script src="https://js.braintreegateway.com/web/3.11.0/js/client.min.js"></script>
<script src="https://js.braintreegateway.com/web/3.11.0/js/paypal-checkout.min.js"></script>
</head>
<body>
<div id="paypal-button-container"></div>
<script>
var BRAINTREE_SANDBOX_AUTH = '38mqtdwp4nth5tbk';
// Render the PayPal button
paypal.Button.render({
// Pass in the Braintree SDK
braintree: braintree,
// Pass in your Braintree authorization key
client: {
sandbox: BRAINTREE_SANDBOX_AUTH,
production: '<insert production auth key>'
},
// Set your environment
env: 'sandbox', // sandbox | production
// Wait for the PayPal button to be clicked
payment: function(data, actions) {
// Make a call to create the payment
return actions.payment.create({
payment: {
transactions: [
{
amount: { total: '1', currency: 'USD' }
}
]
}
});
},
// Wait for the payment to be authorized by the customer
onAuthorize: function(data, actions) {
// Call your server with data.nonce to finalize the payment
console.log('Braintree nonce:', data.nonce);
// Get the payment and buyer details
return actions.payment.get().then(function(payment) {
console.log('Payment details:', payment);
});
}
}, '#paypal-button-container');
</script>
</body>
I need to place code in this variable var BRAINTREE_SANDBOX_AUTH = '38mqtdwp4nth5tbk'; can anyone help me to resolve this issue ?
Full disclosure: I work at Braintree. If you have any further questions, feel free to contact support#braintreepayments.com.
It looks like you are setting your BRAINTREE_SANDBOX_AUTH variable to a Merchant ID, rather than a Client Token. In order to initiate the Braintree checkout, you will need to generate, then pass in a client_token.
You generate the client_token on your server, then pass it into your client-side call: braintree.client.create().
If successful, braintree.client.create() will return a client instance that you can use to create a PayPal checkout component with braintree.paypalCheckout.create().
Within the paypalCheckout component, you can configure your PayPal button using paypal.Button.render().
Related
While setting up, PayPal client code to test server integration, from https://developer.paypal.com/docs/archive/checkout/how-to/server-integration/
My code is as follows:
<html>
<head>
<title>TEST PAYMENT</title>
</head>
<body>
<div id="paypal-button"></div>
<script src="https://www.paypalobjects.com/api/checkout.js"></script>
<script>
paypal.Button.render({
env: 'sandbox', // Or 'production'
// Set up the payment:
// 1. Add a payment callback
payment: function(data, actions) {
// 2. Make a request to your server
return actions.request.post('/api/paypal/create-payment')
.then(function(res) {
console.log(res);
// 3. Return res.id from the response
return res.id;
});
},
// Execute the payment:
// 1. Add an onAuthorize callback
onAuthorize: function(data, actions) {
// 2. Make a request to your server
return actions.request.post('/api/paypal/execute-payment', {
paymentID: data.paymentID,
payerID: data.payerID
})
.then(function(res) {
// 3. Show the buyer a confirmation message.
});
}
}, '#paypal-button');
</script>
</body>
</html>
When I open the page.
When I click the button, a modal window shows up for a second and closed with the following errors.
The checkout.js integration you're attempting to use is deprecated.
Here is the current JS SDK to call your server with: https://developer.paypal.com/demo/checkout/#/pattern/server
I'm trying to set up PayPal Smart Payments on a webpage. I'm using the example they give on here: https://developer.paypal.com/docs/checkout/integrate/
If I have currency_code set to USD it works fine, but if I change it to anything else, such as CAD or GBP the window won't load. What am I doing wrong?
<script src="https://www.paypal.com/sdk/js?client-id=sb"></script>
<script>
paypal.Buttons({
createOrder: function(data, actions) {
return actions.order.create({
'purchase_units': [{
'amount': {
'currency_code': 'USD',
'value': '5',
},
}]
})
}
}).render('body')
</script>
For some reason this example won't run here on Stack Overflow, but it runs fine on JSFiddle, so I have made two examples with the currency_code set differently.
'currency_code': 'USD': https://jsfiddle.net/liquidmetalrob/8y3p52fh/
'currency_code': 'GBP': https://jsfiddle.net/liquidmetalrob/8y3p52fh/1
The first example will load the PayPal window, and you need a PayPal Sandbox account to log into it. So if you want to log in you can use the throwaway account that I just created. Username: sb-ilukn1050819#personal.example.com password: pRKCu9.> But the important question is why does the window not even load in the second example?
I found the answer here: https://developer.paypal.com/docs/checkout/reference/customize-sdk/
You have to add the currency code to the script URL instead, and remove it from the JS.
<script
src="https://www.paypal.com/sdk/js?client-id=sb¤cy=GBP">
</script>
<script>
paypal.Buttons({
createOrder: function(data, actions) {
return actions.order.create({
'purchase_units': [{
'amount': {
'value': '5',
},
}]
})
}
}).render('body')
</script>
Note: The client-id can be set to sb for testing, but in production you use your own one.
I'm trying to integrate Paypal Express Checkout into simple Shopping Cart. There are different ways to do that. Paypal recommends to choose between Basic or Advanced integration and version 4.0 of checkout.js (with REST API). So far so good.
I created Paypal App in my Paypal account to get credentials and start testing it.
The test was OK, but there are some misunderstandings here.
Checkout.js send the amount ( 1.00 ) and currency ( EUR ) to the Paypal servers via REST API (along with my credentials). And if the payment is finished OK - callback function onAuthorize is triggered and there are two parameters with response (data and actions). Well, here I call my own AJAX function to write transaction response data in my database. BUT... I get here only PaymentID and PayerID of the paid transaction?!! And if I want to search later into web interface of paypal.com - there is no such thing as PaymentID. There is only TransactionID ??? How to get other transaction details in the response in onAutorize callback function? How can I get TransactionID here to write down in my database? May be here I have to call Paypal API, or have to implement Paypal IPN (instant payment notification )? BUT how to call IPN API, if I don't have TransactionID :)
<div style="width: 906px; text-align: right; height: 100px;
margin-top: 50px;">
<div id="paypal-button"></div>
</div>
<script src="https://www.paypalobjects.com/api/checkout.js"></script>
<script>
paypal.Button.render({
env: 'production', // Optional: specify 'sandbox' environment
style: {
size: 'medium',
shape: 'rect'
},
client: {
sandbox: 'xxx-my-credentials-xxx',
production: 'xxx-my-credentials-xxx'
},
payment: function() {
var env = this.props.env;
var client = this.props.client;
return paypal.rest.payment.create(env, client, {
transactions: [
{
amount: { total: '1.00', currency: 'EUR' }
}
]
});
},
commit: true, // Optional: show a 'Pay Now' button in the checkout flow
onAuthorize: function(data, actions) {
// Optional: display a confirmation page here
var EXECUTE_PAYMENT_URL = 'payment-process.php';
paypal.request.post(EXECUTE_PAYMENT_URL, { paymentID: data.paymentID, payerID: data.payerID, transactionID: data.transactionID, data: data }) .then(function(data) { }) .catch(function(err) { });
return actions.payment.execute().then(function() {
// Show a success page to the buyer
});
}
}, '#paypal-button');
</script>
To read the information from the transaction you need to call and save data JSON in database
return actions.payment.execute().then(function() {
actions.payment.get().then(function(data) {
if(data.state === 'approved'){
console.log(data);
var transactionId = data.id;
alert("Transaction ID: "+ transactionId + " \n State: " +data.state);
}else{
console.log(data);
}
});
});
I have created the LinkedIn app and retrieved the client id and client_secret.
Now inside the integrated api of OAuth.io created an api and have added the keys and permission scope.
I want to run this project using Ionic Framework. What should be done to achieve it.
P.S: I am new to Ionic Framework and OAuth.io. So please don't mind my style of asking the question.
whole index.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="js/ng-cordova.min.js"></script>
<script src="js/ng-cordova-oauth.min.js"></script>
<script src="cordova.js"></script>
<script src="js/app.js"></script>
</head>
<body ng-controller="MainCtrl">
<button class="button" ng-click="linkedInLogin()">Login via LinkedIn</button>
</body>
</html>
whole app.js:
angular.module('starter', ['ionic', 'ngCordova', 'ngCordovaOauth'])
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
if(window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
cordova.plugins.Keyboard.disableScroll(true);
}
if(window.StatusBar) {
StatusBar.styleDefault();
}
});
})
.controller("MainCtrl", function($scope, $cordovaOauth) {
document.addEventListener( "deviceready", onDeviceReady );
function onDeviceReady( event ) {
// on button click code
$scope.linkedInLogin = function(){
OAuth.initialize('07IxSBnzVoGGQL2MpvXjSYakagE')
OAuth.popup('linkedin').done(function(result) {
// Here you will get access token
console.log(result)
result.me().done(function(data) {
// Here you will get basic profile details of user
console.log(data);
})
});
};
}
});
Please go through the steps and below code:
1) create a project from terminal as ionic start linkedinlogin blank
2)cd linkedinlogin project
3)Add the required platform in terminal as ionic add platform ****
4)Add the ng-cordova.min.js file above the cordova.ja file in our project
5)Install ng-cordova-oauth as bower install ng-cordova-oauth -S
6)Then include ng-cordova-oauth.min.js file in index.html
7)Inject 'ngCordova' and 'ngCordovaOauth' as dependency in app.js file
8)In index.html create a button as login via linkedin
9)In app.js create a Controller with below code
10)Please update your cordova platform if the above plugin doesn't work
$cordovaOauth.linkedin(clientId, clientSecret, ['r_basicprofile', 'r_emailaddress']).then(function(success){
//Here you will get the access_token
console.log(JSON.stringify(success));
$http({method:"GET", url:"https://api.linkedin.com/v1/people/~:(email-address,first-name,last-name,picture-url)?format=json&oauth2_access_token="+success.access_token}).success(function(response){
// In response we will get firstname, lastname, emailaddress and picture url
// Note: If image is not uploaded in linkedIn account, we can't get image url
console.log(response);
}, function(error){
console.log(error);
})
}, function(error){
console.log(error);
})
I thing you read the ngCordova plugins.
Using oauth.io i have implemented login via linkedin:
Please follow the steps:
1. Create a app in oauth.io and get public key.
2. Click on the Integrated APIs menu from the left side bar.
3. Now click on ADD APIs green button on the right top corner.
4. Now Search and select LinkedIn.
5. Now add the Client id and Client Secret in keys and permission scope.
6. use below command to add plugin to project:
cordova plugin add https://github.com/oauth-io/oauth-phonegap
7. For controller code check below code.
document.addEventListener( "deviceready", onDeviceReady );
function onDeviceReady( event ) {
// on button click code
$scope.linkedInLogin = function(){
OAuth.initialize('your public key')
OAuth.popup('linkedin').done(function(result) {
// Here you will get access token
console.log(result)
result.me().done(function(data) {
// Here you will get basic profile details of user
console.log(data);
})
});
};
}
Hope it may be help you..
What is "/checkout" in the below line ?. Actually it referring localpath.
Can you please suggest me the appropriate action URL ?
Also, Can you suggest me where do I give the IPN URL / Syntax ?
<form id="myContainer" method="post" action="/checkout"></form>
<script>
window.paypalCheckoutReady = function () {
paypal.checkout.setup('<Your-Merchant-ID>', {
environment: 'sandbox',
container: 'myContainer'
});
};
</script>
[paypal Integration] https://developer.paypal.com/docs/classic/express-checkout/in-context/integration/
Thanks,
Raja K
This describes it:
A basic Express Checkout integration assumes that you are sending the
API calls from your own server using a <form> or <a>.
Essentially, your existing call to SetExpressCheckout (that would obtain a Paypal token) that you use to redirect (in the "standard" Paypal Express Checkout flow).
The linked sample should hopefully clear things up - you'll see the form action (and a link) POST (GET for the a) to some server implementation (the ip address in the sample) of SetExpressCheckout.
Hth..
I can help you with single page PayPal pay now button actually I use this one of my projects
<script src="https://www.paypal.com/sdk/js?client-id=XXXXXXXXXXXXXXXXX">
</script>
<div id="paypal-button-container"> </div>
<script>
paypal.Buttons({
createOrder: function(data, actions) {
return actions.order.create({
purchase_units: [{
amount: {
value: '1230'
}
}]
});
},
onApprove: function(data, actions) {
return actions.order.capture().then(function(details) {
alert('Transaction completed');
// Call your server to save the transaction
return fetch('codes/paypalapi.php?invo=123', {
method: 'post',
headers: {
'content-type': 'application/json'
},
body: JSON.stringify({
orderID: data.orderID,
amount: data.amount
})
});
});
}
}).render('#paypal-button-container');
</script>
change codes/paypalapi.php?invo=123 with your callback url