2016-04-11 13 views
9

Używam Angular2, Ionic2 i Stripe.js do przetwarzania płatności. Ten wątek tutaj: ionic2 with stripe payment gateway używa wtyczki https://github.com/Telerik-Verified-Plugins/Stripe/blob/master/doc/index.md, ale nie jest to bezpieczne, ponieważ musisz osadzić tajny klucz w aplikacji. Nawet strona mówi ludziom, aby nie używali tej wtyczki.Importuj pasek przy użyciu Angular2 i stripe.js

Próbowałem użyć node.js wersję tutaj:

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

Jednak nie mogę dowiedzieć się, jak to zrobić var stripe = require('stripe')(' your stripe API key '); gdy w maszynopisie, trzeba użyć import.

Wreszcie umieściłem <script type="text/javascript" src="https://js.stripe.com/v2/"></script> w index.html, a zmienna stripe pokazuje globalnie wewnątrz każdego komponentu. Jednak nie uważam, że jest to właściwy sposób, ponieważ obiekt stripe może nie być gotowy do czasu użycia go wewnątrz każdego komponentu lub strony.

Jaki jest właściwy sposób używania Angular2 i Stripe.js? Ionic2 byłby szczególnie miły, ale opcjonalny.

Dzięki

UPDATE 1

próbowałem npm install stripe a następnie wykorzystywane import '../../node_modules/stripe/lib/stripe.js'; ale wciąż mam błąd:

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' 

Oto mój screenshot Kodeks VS ze struktury katalogów:

enter image description here

+0

'import 'path/to/stripe.js';' powinno rozwiązać importowanie. Ale nie dołączaj '.js'. – Chrillewoodz

+0

Zaktualizowałem pytanie, ponieważ sugestia nie zadziałała. –

+0

@MarcusAsplund Proszę zaksięgować jako odpowiedź poniżej, a ja przyjmuję. Dzięki. –

Odpowiedz

6

Dodaj scripttag w index.html, a następnie umieścić deklarację po importu w home.ts

declare var Stripe: any; Wierzę, że to jest właściwa droga do importowania zewnętrznych bibliotekami w NG2

Src: Nic Raboy Jest tam trochę więcej informacji; lepszym sposobem zainstalowania zewnętrznego lib jest pobranie typedefs z DefinitelyTyped i zainstalować z $ typings install Następnie powinieneś być w stanie importować jak zwykle

Jest to, oczywiście, jeśli istnieją typedefs w repo DefinitelyTyped. Wydaje się jednak, że nie istnieje typedefs dla biblioteki Stripe.

+1

Myślę, że znalazłem jeden: https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/stripe/stripe.d.ts – Maxim

+0

Jest też ten: https : //github.com/DefinitelyTyped/DefinitelyTyped/blob/master/stripe-node/stripe-node.d.ts – TomTom

3

Stripe wydaje się mieć definicje typów teraz tak obok

npm install --save stripe 

można również uruchomić następujące czynności, aby uzyskać definicje maszynopis:

npm install --save @types/stripe 

powinieneś być w stanie tak coś jak:

import { Stripe } from 'stripe' 

Powyższy kod to psudo, ponieważ go nie testowałem, ale będzie on czymś podobny.

Więcej informacji tutaj: https://www.npmjs.com/package/@types/stripe

+0

Ponieważ pakiet 'stripe' nie eksportuje nazwanej klasy' Stripe', musisz wykonać 'import * as Zamiast tego zamiast paska wpisz "stripe"; – brod

1

stripe.js biblioteka jest przeznaczony dla serwera, wymaga modułu child_process i tworzy serwer własnych. Nie ma dobrego sposobu na importowanie tej biblioteki bezpośrednio do środowiska przeglądarki.