Skip to content

Instantly share code, notes, and snippets.

@calderaro
Created September 6, 2021 00:27
Show Gist options
  • Save calderaro/8ca405fb3d7069888f2aca13ba084f97 to your computer and use it in GitHub Desktop.
Save calderaro/8ca405fb3d7069888f2aca13ba084f97 to your computer and use it in GitHub Desktop.
Conekta Card Tokenization React Native
import React from 'react';
import {Button, Text} from 'react-native';
import {StackNavigationProp} from '@react-navigation/stack';
import {WebView} from 'react-native-webview';
import {RootStackParamList} from '../../navigation/RootStack';
import {SafeAreaView} from 'react-native-safe-area-context';
type BootNavigationProps = StackNavigationProp<RootStackParamList, 'Boot'>;
interface Props {
navigation: BootNavigationProps;
}
interface State {
key: string;
uuid: string;
}
interface ConektaCard {
name: string;
number: string;
cvc: string;
exp_month: string;
exp_year: string;
device_fingerprint: string;
}
export default class HomeContainer extends React.Component<Props, State> {
constructor(props: Props) {
super(props);
this.state = {
key: 'YOURPUBLICKEYINBASE64',
uuid: '123123',// this is the device's UUID
};
}
componentDidMount() {}
tokenize = async () => {
const res = await fetch('https://api.conekta.io/tokens', {
method: 'POST',
headers: {
'Content-type': 'application/json',
Accept: 'application/vnd.conekta-v0.3.0+json',
'Conekta-Client-User-Agent': '{"agent":"Conekta Conekta iOS SDK"}',
Authorization: `Basic ${this.state.key}`,
},
body: JSON.stringify({
card: {
name: 'Angel Calderaro',
number: '4242424242424242',
cvc: '123',
exp_month: '10',
exp_year: '2025',
device_fingerprint: this.state.uuid,
},
}),
});
console.log(res.status);
const json = await res.json();
console.log(json);
};
render() {
return (
<SafeAreaView>
<Text>Conekta Tokenization React Native</Text>
<WebView
originWhitelist={['*']}
source={{
html: `<html style="background: blue;"><head></head><body><script type="text/javascript" src="https://conektaapi.s3.amazonaws.com/v0.5.0/js/conekta.js" data-conekta-public-key="${this.state.key}" data-conekta-session-id="${this.state.uuid}"></script></body></html>`,
}}
/>
<Button title="tokenize" onPress={this.tokenize} />
</SafeAreaView>
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment