如何将值从我的 Laravel 应用程序的 Sqlite 数据库传递到 .js 文件以允许 Paypal Checkout 按钮起作用？

Posted 2023-02-22

【中文标题】如何将值从我的 Laravel 应用程序的 Sqlite 数据库传递到 .js 文件以允许 Paypal Checkout 按钮起作用？

【英文标题】：How can I pass values from my Laravel App's Sqlite database to a .js file to allow Paypal Checkout buttons to function?

【发布时间】：2021-01-02 02:58:05

【问题描述】：

我会提前说，我相信可能有更简单或更好的方法来做到这一点，所以如果你知道，请随时评论和解释你的方法。

但对于我的应用程序，有些事情无法改变：

解决方案必须与 Laravel 一起使用 解决方案必须与 Paypal Checkout 配合使用 如果解决方案无法轻松规避，则最好（例如，不希望人们能够轻松更改所处理产品的价格。所以我希望信息来自服务器端数据库，或控制器等）

现在我的设置如下：

在 Laravel 视图中：

@push('scripts')
<script src="https://www.paypal.com/sdk/js?client-id=CLIENT_ID_HERE"></script>
<script src=" asset('js/paypalbutton.js') " type="text/javascript"></script>
@endpush

//LOTS OF STUFF HERE
//|Further Down|
//|            |
//v            v

<div class="show-price">
      '$' . $offering['price']  //This will display the price for current item from mysql
</div>

<div class="click-to-purchase">
     <div id="paypal-button-container" load="paypalbutton(this)">
     </div>
</div>

在 laravel 项目目录中名为 paypalbutton.js 的 .js 文件中：

$(document).ready(function paypalbutton()

paypal.Buttons(
createOrder: function(data, actions) 
return actions.order.create(
    purchase_units: [
        amount: 
            value: '0.01'
                
            ]
        );
    ,
onApprove: function(data, actions) 
return actions.order.capture().then(function(details) 
    alert('Transaction completed by ' + details.payer.name.given_name);
        );
    
).render('#paypal-button-container'); // Display payment options on your web page


);

这可以很好地在页面上显示贝宝按钮，并且可以处理付款，问题是，我需要将信息从 sqlite 数据库传递到 javascript 文件，其中包含诸如交易金额之类的信息。

理想情况下，我只需将每条信息的变量保存在 .js 文件的顶部，并让它们在运行时使用正确的值进行初始化。

【问题讨论】：

从JavaScript发送价格不是个好主意，您应该发送产品ID，在服务器中您应该从JavaScript获取该产品的价格，然后可以编辑价格

【参考方案1】：

你可以通过全局 js 变量来做到这一点：

@push('scripts')
<script>
let amount ='$amount'
</script>
<script src="https://www.paypal.com/sdk/js?client-id=CLIENT_ID_HERE"></script>
<script src=" asset('js/paypalbutton.js') " type="text/javascript"></script>
@endpush

在你的 js 文件中：

    $(document).ready(function paypalbutton()

paypal.Buttons(
createOrder: function(data, actions) 
return actions.order.create(
    purchase_units: [
        amount: 
            value: amount 
                
            ]
        );
    ,
onApprove: function(data, actions) 
return actions.order.capture().then(function(details) 
    alert('Transaction completed by ' + details.payer.name.given_name);
        );
    
).render('#paypal-button-container'); // Display payment options on your web page


);

【讨论】：

漂亮，我还没有测试过，但老实说我认为它会完美运行！