How do I return specific array data from php?-CodePudding

I am using async/await to fetch a file (createCharge.php) that contains arrays with data inside when <button> is clicked on checkout.html

If I use print_r I can see all the results in the console such as the name, description, amount and even a new generated 'hosted_url' that the customer will use to continue to their payment.

The problem is that I can't figure out how to fetch the hosted_url result into the checkout page and into the <a href="">Pay now!</a>.

This is what I have on my checkout.html...

<button id="btn">Pay with Crypto?</button>

<p id="pay"></p>

<script>
  btn.addEventListener('click', async (e) => {e.preventDefault();
  const response = await fetch('coinbasePHPtest/createCharge.php/');
  if (!response.ok) {
  const errorMessage = await response.text();
  console.error(response.status, response.statusText, errorMessage);
  alert('There was an error creating the charge.');
  return;
  }            
  const newurl = await response.text();
  console.log(newurl);
      
  pay.innerHTML = `<a href="${newurl}">Pay Now! - Coinbase</a>`;
  });
</script>

You can see I'm trying to bring the hosted_url into the <a> tag within the <script>.

And here is my createCharge.php that actually creates the hosted_url... (Example: https://commerce.coinbase.com/charges/xxxxx)

$ch = curl_init();

curl_setopt($ch, CURLOPT_URL, 'https://api.commerce.coinbase.com/charges');
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode(
array (
'name' => 'My-Company',
'description' => 'Selected Product',
'local_price' => 
array (
'amount' => '147.00',
'currency' => 'GBP',
),
'pricing_type' => 'fixed_price',
'metadata' => 
array (
'customer_id' => 'id_1',
'customer_name' => 'Satoshi Nakamoto',
),
'redirect_url' => 'https://www.my-site.co.uk/Checkout/payment_successful.php',
'cancel_url' => 'https://www.my-site.co.uk/Checkout/payment_cancelled.php',
)
));

$headers = array();
$headers[] = 'Content-Type: application/json';
$headers[] = 'X-Cc-Api-Key: MY-API-KEY';
$headers[] = 'X-Cc-Version: 2018-03-22';
curl_setopt($ch, CURLOPT_HTTPHEADER, $headers);

$result = curl_exec($ch);

curl_close($ch);


$response = json_decode($result, true);

return $response->data->hosted_url;

?>

I also tried..

pay.innerHTML = `<a href="${hosted_url}">Pay Now!</a>`

pay.innerHTML = `<a href="{hosted_url}">Pay Now!</a>`

pay.innerHTML = `<a href="${newurl->hosted_url}">Pay Now!</a>`

pay.innerHTML = `<a href="{.hosted_url}">Pay Now!</a>`

with no luck.

and...

btn.onclick = async() => {
const response = await fetch('coinbasePHPtest/charge.php/hosted_url');
const data = await response.json();

&

btn.onclick = async() => {
const resp = await fetch(`coinbasePHPtest/createCharge.php/${hosted_url}`);
const data = await resp.json();

Solution:

$result = curl_exec($ch);

curl_close($ch);

$response = json_decode($result, true);

echo $response['data']['hosted_url'];

This code within the createCharge.php worked for me! :)

CodePudding user response：

I think you want to just output the data instead of using return. replace

return $response->data->hosted_url;

with

echo $response['data']['hosted_url'];