Recurring payments through Paypal's Express Checkout REST API

Question

My goal is to set up recurring 6 and 12 month subscriptions using "paypal" as the payment method for our SaaS. I'm using the rest API, and the one thing I can't find is a working implementation for how to take a one time sale and re-work my code into a recurring payment using PayPal's rest API (which I've read is now possible). Here's where we are at:

I have a working advanced server integration for making payments with Paypal's Express Checkout REST API.

I created the one time sale by following the code examples as explained at the above link as well as what's shown in this example from paypal. I've tried to switch out the two step process to instead include the billing-agreement creation and execution calls, but light window that opens up to have users sign in to paypal is stopping short with the error message "Things don't appear to be working at the moment. Please try again later". Here's my javascript code, which is almost exactly the same as the working example, but with different routes.

paypal.Button.render({

    // Set your environment

    env: 'sandbox', // sandbox | production

    // Wait for the PayPal button to be clicked
    payment: function(resolve, reject) {

    // Make a call to the merchant server to set up the payment
        console.log("button clicked")
        return paypal.request.post('/payment/paypal/subscription', {amount: '0.02'})
            .then(function(res) {
                resolve(res.payToken); #--WHERE I'M GOING WRONG
            })
            .catch(function(err) { reject(err); });
    },

    // Wait for the payment to be authorized by the customer
    onAuthorize: function(data) {

        // Make a call to the merchant server to execute the payment
        return paypal.request.post('/payment/paypal/execute', {
            data: data,
            paymentID: data.paymentID,
            payerID: data.payerID
        }).then(function (res) {
            if (res.state == "active") {
                document.querySelector('#paypal-button-container-server').innerText = 'Payment Complete!';
            } else {
                console.log(res);
                alert("Payment could not be approved, please try again.")
            }
        });
    }

}, '#paypal-button-container-server');

I can tell that I'm going wrong in the payment function, namely on the line with resolve(res.payToken) . I don't know what piece of data from the v1/payments/billing-agreements response I should be passing to this function, but have tried both the profile_id and the approval_url (the actual href - "href": " https://www.sandbox.paypal.com/cgi-bin/webscr?cmd=_express-checkout&token=EC-XXXXXXXXXXXXX ").

Where am I going wrong? If this is possible, I feel like I'm one working example away from making this work, but I'd like to know if it's not capable the way I'm doing it (in which case it might need to be done via Payflow?).

Note: I fully understand billing agreements and billing profiles, and my problems are not with the REST API. In addition to the working one-time sale implementation, I can make all necessary billing profile/agreements (verified through Postman).

Below is the response from a v1/payments/billing-agreements sandbox call in the event anyone can point out the right piece of data inside of it.

{
  "name": "Magazine Subscription",
  "description": "Monthly subscription with a regular monthly payment definition and two-month trial payment definition.",
  "plan": {
    "id": "P-XXXXXXXXXXXXXXXXXXX",
    "state": "ACTIVE",
    "name": "1 Month Recurring",
    "description": "A recurring payment plan for customers who sign a 1-month contract",
"type": "FIXED",
"payment_definitions": [
  {
    "id": "PD-924GIUJ3MWQ32E22348G0018",
    "name": "Regular Payment Definition",
    "type": "REGULAR",
    "frequency": "Month",
    "amount": {
      "currency": "USD",
      "value": "150"
    },
    "cycles": "1",
    "charge_models": [
      {
        "id": "CHM-940183BIUJ3MWQ5VK14226VH",
        "type": "TAX",
        "amount": {
          "currency": "USD",
          "value": "10"
        }
      }
    ],
    "frequency_interval": "1"
  },
  {
    "id": "PD-5604RIUJ3MWQ4Y4221782C61",
    "name": "Trial Payment Definition",
    "type": "TRIAL",
    "frequency": "Month",
    "amount": {
      "currency": "USD",
      "value": "120"
    },
    "cycles": "1",
    "charge_models": [
      {
        "id": "CHM-640401IUJ3MWQ64W07759LB2",
        "type": "TAX",
        "amount": {
          "currency": "USD",
          "value": "10"
        }
      }
    ],
    "frequency_interval": "1"
  }
],
"merchant_preferences": {
  "setup_fee": {
    "currency": "USD",
    "value": "0"
  },
  "max_fail_attempts": "3",
  "return_url": "http://localhost:8000/payment/success",
  "cancel_url": "http://localhost:8000/payment/new",
  "auto_bill_amount": "NO",
  "initial_fail_amount_action": "CONTINUE"
}
  },
  "links": [
{
  "href": "https://www.sandbox.paypal.com/cgi-bin/webscr?cmd=_express-checkout&token=EC-XXXXXXXXXXXXXX",
  "rel": "approval_url",
  "method": "REDIRECT"
},
{
  "href": "https://api.sandbox.paypal.com/v1/payments/billing-agreements/EC-XXXXXXXXXXXXX/agreement-execute",
  "rel": "execute",
  "method": "POST"
}
  ],
  "start_date": "2017-12-22T09:13:49Z"
}

Answer 1

The REST API's still pass back the express checkout URL's but in order to use it with the checkout.js front end integration you need to pass back the token found within the approval URL. You can either parse this URL and get the token section on the server and return it back or pass it before you call resolve method.

ie

approval_url = { 
    "href": "https://www.sandbox.paypal.com/cgi-bin/webscr?cmd=_express-checkout&token=EC-XXXXXXXXXXXXX" 
}

var token = "EC-XXXXXXXXXXXXX";
resolve(token);