Configuring PayPal
Learn how to configure PayPal for DigitalRiver.js with Elements.
PayPal offers the following payment methods: PayPal Express Checkout, PayPal Billing Agreement, PayPal Pay in 3, PayPal Pay in 4, PayPal RatenZahlung, and PayPal Credit.
PayPal is a payment service that facilitates payments between parties through online funds transfers. PayPal allows customers to establish an account on its website, which is connected to a user's credit card or checking account.
Use the PayPay Billing Agreement for subscriptions. That includes any instance where the cart contains both subscription and non-subscription products.
If you're using DigitalRiver.js with Elements, you can create a PayPal payment method for your app or website in four easy steps:
Build the PayPal objects.
A PayPal source request object requires the following fields.
Field | Value |
---|---|
type | payPal |
sessionId | The payment session identifier. |
payPal |
{
"returnUrl": "http://mypage.com",
"cancelUrl": "https://mypage.com/cancel",
}
Field | Required/Optional | Description |
---|---|---|
returnUrl | Required | If you choose to utilize the full redirect flow, this is where you will redirect your customer to after authorizing within the PayPal experience. |
cancelUrl | Required | If you choose to utilize the full redirect flow, this is where you will redirect your customer to after canceling within the PayPal experience. |
Use the DigitalRiver.js library to create and mount elements to the HTML container.
JavaScript
var data = {
"type": "payPal",
"sessionId": "ea03bf6f-84ef-4993-b1e7-b7d5ecf71d1f",
"payPal": {
"returnUrl": "http://mypage.com",
"cancelUrl": "https://mypage.com/cancel"
}
}
digitalriver.createSource(data).then(function(result) {
if (result.error) {
//handle errors
} else {
var source = result.source;
//send source to back end
sendToBackend(source);
}
});
The
address
object must contain postal code and state/province data that adheres to a standardized format.Source response
{
"clientId": "gc",
"channelId": "drdod15",
"liveMode": false,
"id": "d6a44e5d-1373-4013-847d-10deb4ded4df",
"sessionId": "ea03bf6f-84ef-4993-b1e7-b7d5ecf71d1f",
"clientSecret": "d6a44e5d-1373-4013-847d-10deb4ded4df_ddd44e5d-1373-4013-847d-10deb4ded4df",
"type": "payPal",
"reusable": false,
"amount": "10.00",
"currency": "USD",
"state": "pending_redirect",
"creationIp": "209.87.178.4",
"createdTime": "2019-05-22T00:00:46.975Z",
"updatedTime": "2019-05-22T00:00:46.975Z",
"flow": "redirect",
"redirect": {
"redirectUrl": "https://api.digitalriver.com:443/payments/redirects/b8f2207b-8236-4608-b5a2-812790d42ed8?apiKey=pk_test_6cb0fe9ce3124093a9ad906f6c589e2ds",
"returnUrl": "https://example.com?action=paymentSuccess",
"cancelUrl": "https://example.com?action=paymentFailure"
},
"payPal": {
"shipping": {
"recipient": "John Doe",
"phoneNumber": "555-555-1212",
"address": {
"line1": "54321 Fake St.",
"line2": "Apt. 3C",
"city": "Minnetonka",
"state": "MN",
"country": "US",
"postalCode": "55341"
}
},
"token": "EC-1HD67063RG318840B"
}
} "clientSecret": "d6a44e5d-1373-4013-847d-10deb4ded4df_ddd44e5d-1373-4013-847d-10deb4ded4df",
"type": "payPal",
"reusable": false,
"amount": "10.00",
"currency": "USD",
"state": "pending",
"creationIp": "209.87.178.4",
"createdTime": "2019-05-22T00:00:46.975Z",
"updatedTime": "2019-05-22T00:00:46.975Z",
"flow": "redirect",
"redirect": {
"redirectUrl": "https://api.digitalriver.com:443/payments/redirects/b8f2207b-8236-4608-b5a2-812790d42ed8?apiKey=pk_test_6cb0fe9ce3124093a9ad906f6c589e2ds",
"returnUrl": "https://example.com?action=paymentSuccess",
"cancelUrl": "https://example.com?action=paymentFailure"
},
"payPal": {
"shipping": {
"recipient": "John Doe",
"phoneNumber": "555-555-1212",
"address": {
"line1": "10380 Bren Road W",
"line2": "",
"city": "Minnetonka",
"state": "MN",
"country": "US",
"postalCode": "55343"
}
},
"token": "EC-1HD67063RG318840B"
}
}
When you create a PayPal source, the customer is required to authorize the charge at PayPal. You can accomplish this by either redirecting the customer to PayPal or using the PayPal SDK to authorize the charge as part of your experience.
To redirect your customer to PayPal for authorization, use the
redirectUrl
parameter in your createSource response.window.location.href = sourceResponse.redirect.redirectUrl;
At PayPal, the customer can authorize or cancel the transaction when presented with the transaction details. If the authorization is successful, the customer will be redirected to the PayPal Return URL parameter you specified when you created the source. If the customer cancels, they will be returned to the PayPal Cancel URL parameter you specified.
Use the PayPal Checkout SDK to streamline the authorizing PayPal transactions. This will allow you to control things like the appearance of the PayPal button and embed the entire experience into your workflow.
- More details on how you can customize the PayPal button are located here: https://developer.paypal.com/docs/archive/checkout/how-to/customize-button/#
Example:
- 1.Include the PayPal Checkout SDK on your page and specify a location where the button will appear.
- 2.Use the PayPal SDK to customize and place the PayPal button on your page. The PayPal SDK returns two functions,
onAuthorize
andonCancel
. If the payment was authorized, use the source you created earlier by attaching it to checkout.
HTML
<script src="https://www.paypalobjects.com/api/checkout.js"></script>
<div id="paypal-button"></div>
JavaScript
var paypalSourceData = {
"type": "payPal",
"sessionId": "ea03bf6f-84ef-4993-b1e7-b7d5ecf71d1f",
"payPal": {
"returnUrl": redirectUrl,
"cancelUrl": cancelUrl,
}
};
paypal.Button.render({
// Configure environment
env: 'sandbox',
// Customize button (optional)
locale: 'en_US',
style: {
label: 'checkout',
size: 'responsive',
color: 'gold',
shape: 'rect',
layout: 'horizontal',
fundingicons: 'false',
tagline: 'false'
},
// Set up a payment
payment: function(data, actions) {
return digitalriver.createSource(paypalSourceData).then(function(result) {
if (result.error) {
//handle the errors that were returned
handleErrors(result.error)
} else {
return result.source.payPal.token;
}
});
},
// Execute the payment
onAuthorize: function(data, actions) {
//the payment has been authorized, use the source and attach it to your customer's account.
doSomething();
},
onCancel: function(data) {
//the payment has been cancelled, do something to try and get the shopper back on track
doSomethingElse();
}
}, '#paypal-button');

PayPal login
Attach the source to a checkout
POST /checkouts/{id}
{
"customerId": "5774321008",
"sourceId": "src_a78cfeae-f7ae-4719-8e1c-d05ec04e4d37"
}
The PayPal billing agreement allows consumers to use their PayPal account to make recurring payments when they purchase a subscription product by clicking the PayPal button. Consumers have the option to choose to auto-renew or manually renew.
Currency supported: All currencies available in supported countries.
Create a PayPal billing agreement payment method for your app or website in four easy steps: