Javascript Stripe.createTokenWithCardAsync(参数)doenst';工作不好
我正在使用expo支付条带制作一个应用程序。我创建了一个对象,以便将参数传递给函数Stripe.createTokenWithCardAsync(params)。然而,console.log(params)显示了我想要发送给函数的所有参数,但是从函数返回的令牌并没有包含我传递的所有参数 这是我的密码:Javascript Stripe.createTokenWithCardAsync(参数)doenst';工作不好,javascript,react-native,expo,stripe-payments,payment,Javascript,React Native,Expo,Stripe Payments,Payment,我正在使用expo支付条带制作一个应用程序。我创建了一个对象,以便将参数传递给函数Stripe.createTokenWithCardAsync(params)。然而,console.log(params)显示了我想要发送给函数的所有参数,但是从函数返回的令牌并没有包含我传递的所有参数 这是我的密码: import React from 'react'; import {StyleSheet, Text, TouchableOpacity, View, TouchableHighlight }
import React from 'react';
import {StyleSheet, Text, TouchableOpacity, View, TouchableHighlight } from 'react-native';
import { CreditCardInput } from 'react-native-credit-card-input';
import {PaymentsStripe as Stripe} from 'expo-payments-stripe';
export default class TarjetaScreen extends React.Component {
constructor(props){
super(props)
this.state = {
data: {}, //JSON vacío
bolTarjeta: false
}
}
// Metodo que se va a ejecutar cada vez que el usuario rellene un campo del formulario y pasa en formData los valores en un JSON.
onChange = (formData) => {
this.setState({data: formData.values, //Metemos en data el JSON de los valores insertados.
bolTarjeta: formData.valid}) //Sera true cuando el usuario retorne todos los campos y sean válidos.
}
onFocus = (field) => console.log("focus", field) //Se va a ejecutar cada vez que el usuario pinche en un textinput.
async componentDidMount () {
Stripe.setOptionsAsync({
publishableKey: 'pk_test_51IkSMjAwYEmxhVRRPOaKFC3ORP9KNS1PymGMGdoer0InVFq0HbDaa2VLAas9UdjJvM1LIsKKsrLFhicEtfq5wrtm00oaDwyGJ8'
})
}
pagar = async () => {
const params = {
number: this.state.data.number,
expMonth: parseInt(this.state.data.expiry.substring(0,2)),
expYear: parseInt(this.state.data.expiry.substring(3,5)),
cvc: this.state.data.cvc
}
console.log(params.number)
const token = await Stripe.createTokenWithCardAsync(params)
console.log(token)
const source = await Stripe.createSourceWithParamsAsync({ type: 'card', amount: this.props.money, currency: 'EUR'})
console.log(source)
}
render() {
return (
<View style={{ flex:1, alignItems: 'center'}}>
<View style={{ width: '100%', height: '30%', marginTop: 60}}>
<CreditCardInput
autofocus
requiresName
requiresCVC
cardScale={0.9}
validColor={'black'}
invalidColor={'red'}
placeholderColor={'darkgray'}
placeholders={{number: "1234 5678 1234 5678", name: "NOMBRE COMPLETO", expiry: "MM/YY", cvc:"CVC"}}
labels={{number: "NÚMERO TARJETA", expiry: "EXPIRA", name: "NOMBRE COMPLETO", cvc: "CVC/CCV"}} //Lo pongo en español, por defecto vienen en inglés
onFocus={this.onFocus}
onChange={this.onChange}
/>
</View>
<View style={{
width: 280,
marginTop: 150,
marginBottom: 20,
backgroundColor: '#B71C1C',
borderRadius: 60,
}}>
<TouchableOpacity onPress={()=>this.pagar()}>
<Text style={{
textAlign: 'center',
fontSize: 17,
color: 'white',
paddingVertical: 15
}}>Pagar</Text>
</TouchableOpacity>
</View>
</View>
)
}
}
从“React”导入React;
从“react native”导入{样式表、文本、TouchableOpacity、视图、TouchableHighlight};
从“react native credit card input”导入{CreditCardInput};
从“expo payments Stripe”导入{PaymentsStripe as Stripe};
导出默认类TarjetaScreen扩展React.Component{
建造师(道具){
超级(道具)
此.state={
数据:{},//JSON vacío
博尔塔耶塔:错
}
}
//我想我可以用我的名字写一本关于公式化和公式化的书。
onChange=(formData)=>{
this.setState({data:formData.values,//Metemos en data el JSON de los valores insertados。
bolTarjeta:formData.valid}///Sera true cuando el-usuario反驳了campos和sean válidos的观点。
}
onFocus=(field)=>console.log(“focus”,field)//Se va a ejecutar cada vez que el usuario pinche en un textinput。
异步组件didmount(){
Stripe.setoptions异步({
可发布密钥:“pk_test51iksmjawyemxhvrrpoakfc3orp9kns1pymgdoer0invfq0hbdaa2vlaas9udjvm1liskksrlfq5wrtm00oadwygj8”
})
}
pagar=async()=>{
常量参数={
编号:this.state.data.number,
expMonth:parseInt(this.state.data.expiry.substring(0,2)),
expYear:parseInt(this.state.data.expiry.substring(3,5)),
cvc:this.state.data.cvc
}
console.log(参数编号)
const token=wait Stripe.createTokenWithCardAsync(参数)
console.log(令牌)
const source=wait Stripe.createSourceWithParamsAsync({type:'card',amount:this.props.money,currency:'EUR'})
console.log(源代码)
}
render(){
返回(
this.pagar()}>
帕加尔
)
}
}
log(params)打印:对象{
“cvc”:“424”,
“月”:10,
“一年”:24,
“编号”:“4242 4242”,
}
日志(令牌)打印:对象{
“卡”:对象{
“地址城市”:空,
“addressCountry”:空,
“addressLine1”:空,
“addressLine2”:空,
“addressState”:空,
“addressZip”:空,
“品牌”:“Visa”,
“Cardd”:“card_1ilpklawyemxhvrrjwexu5g”,
“国家”:“美国”,
“货币”:空,
“cvc”:空,
“月”:10,
“扩展年”:2024年,
“指纹”:空,
“资金”:“信贷”,
“last4”:“4242”,
“名称”:空,
“数字”:空,
},
“已创建”:1619662205000,
“livemode”:错误,
“tokenId”:“tok_1IlPKLAwYEmxhVRRFmbUbymd”,
“已用”:假,
}您将永远无法从Stripe获得完整的卡号或CVC,因为这些都是敏感数据
更一般地说,您应该在这里使用元素,这样您就不会将应用程序暴露于原始卡详细信息中:我已经使用stripe client解决了这个问题。非常感谢。我来看看