Place Javascript to PHP variable -- for Plaid

Question

I am trying to integrate Plaid via Stripe. Bear with me as I am not very familiar with javascript.

I want to know how I can place in to a PHP variable the public_token and account_ID so that I may include in the curl call.

JS

<button id='linkButton'>Open Plaid Link</button>
<script src="https://cdn.plaid.com/link/stable/link-initialize.js"></script>
<script>
var linkHandler = Plaid.create({
  env: 'tartan',
  clientName: 'Stripe / Plaid Test',
  key: '[Plaid key]',
  product: 'auth',
  selectAccount: true,
  onSuccess: function(public_token, metadata) {
    // Send the public_token and account ID to your app server.
    console.log('public_token: ' + public_token);  // HOW DO I PLACE THIS IN PHP/curl?**
    console.log('account ID: ' + metadata.account_id); // HOW DO I PLACE THIS IN PHP/curl?**
  },
});

PHP/CURL

$ch = curl_init();
curl_setopt_array($ch, array(
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_URL => 'https://tartan.plaid.com/exchange_token',
    CURLOPT_POST => true,
    CURLOPT_HTTPHEADER, array(
        'Content-Type: application/x-www-form-urlencoded',
    ),
    CURLOPT_POSTFIELDS => http_build_query(array(
        'client_id' => '[Plaid client ID]',
        'secret' => '[Plaid secret]',
        'public_token' => '[Plaid Link public_token]', // HOW DO I CREATE A VARIABLE FROM THE ABOVE JS ( console.log('public_token: ' + public_token);) to place here**
        'account_id' => '[Plaid Link account_id]', // HOW DO I CREATE A VARIABLE FROM THE ABOVE JS ( console.log('public_token: ' + public_token);) to place here
    )),
));

Answer 1

You will want to take a look at using XMLHTTP, also known as AJAX. This allows Javascript to make HTTP requests with post or get. If this looks too difficult, you can use the jQuery.ajax method (but you need to include jQuery in your HTML). You will then be able to point the request to your PHP page in which you make your cURL request and retrieve the values via _POST or _GET.

Examples as per below:

XMLHTTP REQUEST

var url = 'curl.php?token='+public_token+'&acctid='+metadata.account_id;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
       console.log(xmlhttp.responseText);
    }
};
xhttp.open("GET", url, true);
xhttp.send();

JQUERY.AJAX

Assuming jQuery is included and jQuery.noConflict() has not been called.

$.ajax({
    method: "GET",
    url: "curl.php",
    data: {
        token: public_token,
        acctid: metadata.account_id
    }
}).done(function( msg ) {
    console.log( msg );
});

Both examples above are only theoretical and untested, although I believe they should work. From here, you should be able to get the variables in your PHP like so:

'public_token' => $_GET['token'],
'account_id' => $_GET['acctid']