Dun*_*nes 4 javascript stripe-payments vue.js vue-component vuejs2
我正在尝试让 Stripe 与我的 Vue.js 2 应用程序一起工作。出于 PCI-DSS 原因，Stripe 要求其 Javascript始终从js.stripe.com. 我已按照以下说明进行操作：
但当我'Stripe' is not defined尝试使用该库时出现错误。这些解决方案似乎只是为了将<script>标签添加到输出 HTML 中（例如用于分析），而不是实际使用该脚本中的函数和对象。
我的 Javascript 组件如下所示：
<script>
export default {
name: "PaymentPage",
mounted() {
let stripeScript = document.createElement('script');
stripeScript.setAttribute('src', 'https://js.stripe.com/v3/');
document.head.appendChild(stripeScript);
let s = Stripe('pk_test_Fooo');
console.log(s);
}
}
</script>
我还尝试将脚本标签添加到我的public/index.html文件中，但得到了相同的结果。这可能是我的首选途径，因为 Stripe 鼓励开发人员在网站的所有页面上导入他们的脚本。
<!DOCTYPE html>
<html lang="en">
<head>
// ...
<script src="https://js.stripe.com/v3/"></script>
</head>
如何从外部 CDN 提取脚本并在组件的 Javascript 中使用它？
我知道一些库可以将 Vue.js 与 Stripe 集成（例如matfish2/vue-stripe和jofftiquez/vue-stripe-checkout），但前者不能正确导入（我遇到了问题 #24）后者是针对旧的 Stripe API 构建的，新版本仍处于测试阶段。
Stripe在检查是否存在之前，您没有给脚本时间加载。你需要的是这样的：
<script>
export default {
name: "PaymentPage",
mounted() {
let stripeScript = document.createElement('script');
stripeScript.setAttribute('src', 'https://js.stripe.com/v3/');
stripeScript.onload = () => {
let s = Stripe('pk_test_Fooo');
console.log(s);
};
document.head.appendChild(stripeScript);
}
}
</script>
| 归档时间： |
|
| 查看次数： |
4815 次 |
| 最近记录： |