使用 Angular2 和 stripe.js 导入 Stripe

Question

我正在使用 Angular2、Ionic2 和 Stripe.js 进行支付处理。这个线程在这里 is using the plugin https://github.com/Telerik-Verified-Plugins/Stripe/blob/master/doc/index.md 但它不安全，因为您必须将密钥嵌入到应用程序中。甚至页面都告诉人们不要使用这个插件。

我在这里尝试使用 node.js 版本：

https://www.npmjs.com/package/stripe

但是，我不知道如何在 TypeScript 中执行 var stripe = require('stripe')(' your stripe API key ');，您必须使用 import。

最后，我确实将 <script type="text/javascript" src="https://js.stripe.com/v2/"></script> 放入 index.html 并且 stripe 变量在每个组件中全局显示。但是，我觉得这不是正确的方法，因为当我在每个组件或页面中使用它时 stripe 对象可能还没有准备好。

使用 Angular2 和 Stripe.js 的正确方法是什么？ Ionic2 特别好，但可选。

谢谢

更新 1

我尝试了 npm install stripe 然后使用了 import '../../node_modules/stripe/lib/stripe.js'; 但仍然出现错误：

TypeScript error: /Users/username/Documents/StripePayment/app/pages/home/home.ts(16,23): Error TS2304: Cannot find name 'Stripe'.
Error: Cannot find module '../../node_modules/stripe/lib/stripe.js' from '/Users/username/Documents/StripePayment/app/pages/home'

这是我的 VS Code 截图和目录结构：

Answer 1

在 index.html 中添加脚本标签，然后在 home.ts

中的导入之后放置一个声明

declare var Stripe: any; 我相信这是在 ng2

中导入外部库的正确方法

来源：Nic Raboy 那里有更多信息；安装外部库的更好方法是从 DefinitelyTyped 下载 typedef 并使用 $ typings install 安装然后你应该可以像往常一样导入

当然，前提是 DefinitelyTyped 存储库中有 typedef。不过，Stripe 库似乎不存在 typedef。

Answer 2

Stripe 现在似乎有了类型定义

npm install --save stripe

您还可以运行以下内容来获取 TypeScript 定义：

npm install --save @types/stripe

然后你应该可以这样：

import { Stripe } from 'stripe'

上面是伪代码，因为我没有测试过，但会是类似的东西。

更多信息在这里： https://www.npmjs.com/package/@types/stripe

Answer 3

stripe.js 库用于服务器，需要 child_process 模块，并创建自己的服务器。没有很好的方法直接将这个库导入浏览器环境。

使用 Angular2 和 stripe.js 导入 Stripe

Import Stripe using Angular2 and stripe.js

javascript

stripe-payments

ionic-framework

ionic2

angular