JavaScript 和 PayPal 结帐按钮问题

Question

I am currently testing out the sandbox for the PayPal checkout integration using Javascript.

I see how to use the "Sandbox" mode versus using the "Live" mode when testing our buttons out in Javascript.

What I'm asking is how do I set the product's title so that the buyer can see exactly what they're about to purchase prior to clicking the "Pay Now" button to finalize the transaction?

Here is the code that I'm currently working with as shown below:

//HTML GOES HERE TO CONTAIN THE PAYPAL BUTTON
<div id="paypal-button-container"></div>
<script src="https://www.paypal.com/sdk/js?&client-id=[MY-CLIENT-ID-GOES-HERE]&merchant-id=[MY-MERCHANT-EMAIL-ADDRESS-GOES-HERE]&currency=USD"></script>


paypal.Buttons({
    style: {
        layout:  'vertical',
        color:   'gold',
        shape:   'pill',
        label:   'buynow'
    },

    // Sets up the transaction when a payment button is clicked
    createOrder: function(data, actions) {
      return actions.order.create({

        purchase_units: [{
          amount: {
            value: 50, // Can reference variables or functions. Example: `value: document.getElementById('...').value`
            currency: 'USD'
          },

        }]
        
      });
      
    },
    
    // Finalize the transaction after payer approval
    onApprove: function(data, actions) {
      return actions.order.capture().then(function(orderData) {
        // Successful capture! For dev/demo purposes:
            console.log('Capture result', orderData, JSON.stringify(orderData, null, 2));
            var transaction = orderData.purchase_units[0].payments.captures[0];
            alert('Transaction '+ transaction.status + ': ' + transaction.id + '\n\nSee console for all available details');

        // When ready to go live, remove the alert and show a success message within this page. For example:
        // var element = document.getElementById('paypal-button-container');
        // element.innerHTML = '';
        // element.innerHTML = '<h3>Thank you for your payment!</h3>';
        
        actions.redirect('https://SomeWebsiteURLiWillForwardThemTo.com');
      });
    }
  }).render('#paypal-button-container');

Answer 1

In paypals docs you can see the purchase unit object. https://developer.paypal.com/docs/api/orders/v2/#definition-purchase_unit inside that object you can see that you can pass an items array. This is an array of objects that you can view here https://developer.paypal.com/docs/api/orders/v2/#definition-item . You can define the parameters of each product including the name. So in your case I think you can try something like the following:

purchase_units: [{
  amount: {
    value: 50, 
    currency: 'USD'
  },
  items: [
    { 
      name: 'Product Name'
    },
  ]
}]

NOTE: you may need to set the price, tax and other things but I think you can just state the product name. I'm not sure you will have to test it out and see what you need. Paypals documentation is kind of like following the breadcrumbs so just look through the docs for what you need.