在 angular 中使用外部 "live" javascript

Question

我正在尝试在我的 angular 前端应用程序中集成 stripe。

来自条带文档：“始终直接从 https://js.stripe.com 加载 Stripe.js。您不能将其包含在捆绑包中或自行托管。”

我已将脚本添加到我的索引的 head 标记中，我看到它已正确加载。 <script src="https://js.stripe.com/v3/"></script>

但是当尝试在 ts 代码中使用它时：

declare var stripe: any;

和：

  stripe
    .redirectToCheckout({
      sessionId: this.sessionId
    })
    .then(x => {
      console.log(x);
    });

这导致“未定义条纹”。

这里有解决办法吗？

最好我不想在需要之前加载 javascript 文件，但这可能是另一个问题，或者可能是两者的解决方案。

Answer 1

您所做的将不起作用 - 您自己声明 stripe 变量，这将不起作用。

好消息是 - 您误解了文档。如果你看一下他们的 docs（粗体由我添加）：

We also provide an npm package that makes it easier to load and use Stripe.js as a module. For more information, check out the project on GitHub.

这意味着他们有一个 npm 包，可以从他们的页面（即 https://js.stripe.com/v3/）加载脚本，并在一个漂亮的 TypeScript 包装器中为您提供。因此，通过使用他们的 npm 模块，您绝对符合 PCI。

按照 package git page 上的指南进行操作应该会很好。

Using external "live" javascript in angular