ReferenceError: не удается найти переменную: документ при импорте loadStripe из '@ stripe.stripe- js'

Question

При разработке приложения на React Native вместе с Stripe я постоянно получаю предупреждение [ReferenceError: Can't find variable: document].

Я не могу понять причину ошибки.

Единственная возможность, о которой я могу думать, - это если модуль Stripe создан только для реакции js и ищет документ HTML для ссылки.

Я почти уверен, что именно эта строка вызывает предупреждение.

import {loadStripe} from '@stripe/stripe-js';

Когда она включена, появляется предупреждение. Я прочитал документацию , но ничего не нашел. 1013

Answer 1

Единственная возможность, которую я могу придумать, - это если модуль Stripe создан только для реакции js и ищет документ HTML для ссылки.

Это правильно. Модуль @stripe/stripe-js и Stripe. js предназначены только для использования в браузере. Единственный способ использовать Stripe. js в React Native - это использовать WebView:

• Пример: https://snack.expo.io/@ttmarek / response-native-stripe-elements-webview
• Документы WebView: https://reactnative.dev/docs/webview.html
• Загрузить статистику c HTML или URI: https://reactnative.dev/docs/webview.html#source

Преимущество этого подхода в том, что он использует vanilla Stripe. js и Elements, и он прост. Минусы в том, что взаимодействие с пользователем иногда может ухудшаться из-за производительности WebView, а кнопка запроса платежа (например, Apple Pay, Google Pay) не работает в WebViews из-за ограничений Android и iOS.

Возможно, лучший вариант - использовать библиотеку, которая связывается с собственными SDK Stripe iOS и Android. Наиболее широко используемая для этого библиотека называется tipsi-stripe: https://github.com/tipsi/tipsi-stripe.

Основным недостатком использования tipsi-stripe является то, что она не поддерживает SCA / PaymentIntents: https://github.com/tipsi/tipsi-stripe/issues/448, и поддерживается не так активно, как хотелось бы.