Wie kann ich einen Stripe Elements Input mit Bootstrap formatieren?

10

Ich baue eine einfache Website, die Zahlungen mit Stripe verarbeitet. Ich benutze Bootstrap für mein Styling. Wenn ich Stripe Elements zum Einfügen der Zahlungsfelder verwende, werden sie nicht mit Bootstrap formatiert. Wie kann ich den Bootstrap-Stil auf die Zahlungsfelder von Elements anwenden?

    
michael 04.09.2017, 14:35
quelle

2 Antworten

11

Alles klar, also musste ich das herausfinden, weil ich Stripe.js v2 benutzt habe, und die Sicherheitslücke wurde mir vom Stripe-Tech-Support erklärt, also fühlte ich mich verpflichtet, zu Stripe.js v3 "Elements" zu wechseln. Was sie sagten, war, dass jedes Javascript auf der gleichen Seite wie Ihre Kreditkartenformelemente die Werte der vertraulichen Kreditkartendaten erhalten könnte. Ich nehme an, das könnte passieren, wenn eine Person externe Skripte einzieht ... und ich nehme an, dass es passiert ist, oder sie würden sich nicht darum kümmern. Wie auch immer, so habe ich meine Stripe.js v3 Elemente mit Bootstrap 4 Eingabegruppen arbeiten lassen. Es ist ein funktionierendes Beispiel, Sie müssten nur den öffentlichen Schlüssel ändern.

Standardmäßiges jQuery-basiertes Beispiel

%Vor%

Ich habe nur in Firefox, Chrome und Chrome unter Android getestet. Scheint gut zu funktionieren. Lassen Sie mich wissen, wenn Sie Probleme haben.

Optionales Vue.js-basiertes Beispiel

%Vor%

Dieses Vue.js-Beispiel könnte von etwas Arbeit profitieren, aber vielleicht hilft es Ihnen beim Einstieg.

    
Brian Gottier 07.09.2017 03:56
quelle
6

Nachdem ich ein bisschen mehr in den Dokumenten geforscht habe, habe ich das gefunden Ссылка sagt "Du sollte den Container, in den Sie ein Element einbinden, so gestalten, als wäre es ein  auf deiner Seite. "

Wenn ich die form-control -Klasse von Bootstrap zu <div> hinzufüge, an der ich das Element anhefte, sieht das Feld fast wie jedes andere Bootstrap-Stil-Eingabefeld aus:

%Vor%

Aus irgendeinem Grund stimmt die Höhe des Feldes nicht ganz überein, aber durch Versuch und Irrtum habe ich es verstanden mit:

%Vor%     
michael 04.09.2017 14:35
quelle