Histórico de mensagens sobre react js em cartões

EXIBINDO CONVERSAS RECENTES:

Texto: react js
Canal: cartões
Avatar discord do usuario secretisociais

secretisociais

Ver Respostas

Não, typescript é uma extensão que adiciona tipos estáticos pra Javascript. Eu utilizo ele em conjunto com o React "ReactJS" e o arquivo js-payment-token-efi precisaria de um arquivo @types pra funcionar corretamente. Geralmente quando vc faz o comando npm install nome_da_biblioteca algumas delas dá a opção de instalar também o arquivo tipado ex: npm install --save-dev @types/payment-token-efi

Avatar discord do usuario rubenskuhl

rubenskuhl

Ver Respostas

Mas Typescript é de back-end, não ? O seu caso seria usar ReactJS e a bibliotec JS...

Avatar discord do usuario marcosvinicius0759

marcosvinicius0759

reactjs ?

Avatar discord do usuario joaolucas_efi

joaolucas_efi

Bom dia @jamersonbernardo, tudo bem?

Você pode utilizar o seguinte exemplo para gerar o payment token com React.

Exemplo alternativo para gerar payment_token react:

js
"use client"
import { useEffect, useState } from 'react';

const App = () => {
const [message, setMessage] = useState('Hello React!');

useEffect(() => {
const script = document.createElement('script');
script.type = 'module';
script.src = 'https://cdn.jsdelivr.net/gh/efipay/js-payment-token-efi/dist/payment-token-efi.min.js';
script.onload = runEfiJsCode;
document.head.appendChild(script);
}, []);

const runEfiJsCode = async () => {
try {
EfiJs.CreditCard
.debugger(false)
.setAccount('')
.setEnvironment('') // 'production' or 'sandbox'
.setCreditCardData({
brand: '',
number: '',
cvv: '',
expirationMonth: '05',
expirationYear: '2029',
reuse: false
})
.getPaymentToken()
.then(data => {
const payment_token = data.payment_token;
const card_mask = data.card_mask;

setMessage(Payment_token: ${payment_token} | Card_mask: ${card_mask})
console.log('payment_token', payment_token);
console.log('card_mask', card_mask);
})
.catch(err => {
console.log('Código: ', err.code);
console.log('Nome: ', err.error);
console.log('Mensagem: ', err.error_description);
});
} catch (error) {
console.log('Código: ', error.code);
console.log('Nome: ', error.error);
console.log('Mensagem: ', error.error_description);
}
};

return (

{message}

);
};

export default function Home() {
return (



);
}

Avatar discord do usuario kelvynreis

kelvynreis

boa tarde, alguem ja integrou a api de pagamento do cartao utilizando reactjs?

Avatar discord do usuario rubenskuhl

rubenskuhl

Ver Respostas

Eu só uso API Pix, mas no SDK NodeJS da Efí tem exemplo com NodeJS. No front-end você vai precisar de ReactJS, não tem componente de cartão da Efí para React Native.

Avatar discord do usuario asc777.

asc777.

Como adaptar esse código para React Native - JSX?

Avatar discord do usuario _alexandrehenrique

_alexandrehenrique

Ver Respostas

ola bom dia eu estou tentendo fazer a requisção do payment_token,e não esta dando certo, meu sistema esta em reactjs

Avatar discord do usuario _alexandrehenrique

_alexandrehenrique

eu presiso obter o Obtendo um "payment_token" alguem ja consiguiu fazer isso, eu estou tentado fazer no reactjs mas não estou conseguindo, e o exemplo que ten na documentoção não esta dando certo

Avatar discord do usuario gabrielmaqes

gabrielmaqes

boa noite pessoal, alguem poderia me ajudar a conseguir o payment_token? Estou utilizando reactjs

Avatar discord do usuario gabrielmaqes

gabrielmaqes

Alguem consegue gerar o payment_token no reactjs?

Avatar discord do usuario joao_efi

joao_efi

Ver Respostas

Boa tarde @nicolaujr. tudo bem? 🙂
O exemplo na documentação é js. E pode não estar sendo executado por estar no react.
Acredito que será necessário adaptá-lo ao ambiente do react ou executá-lo paralelamente.
Algo nessa linha pode funcionar: https://valchan.com.br/script-externo-reactjs/

A Gerencianet está estudando outras formas de gerar o payment_token sem utilizar o script padrão, como no React, no entanto não temos como fornecer um prazo.

Avatar discord do usuario caiosoliver

caiosoliver

mais não uso React JS eu React Native nem uso servidor NodeJS

Avatar discord do usuario valmirefi

valmirefi

Com aquele código que te encaminhei é possível pegar os dados do seu frontend em React utilizar o NodeJs onde o React roda

Avatar discord do usuario felipeex.

felipeex.

Boa tarde, Como posso implementar o sistema de cartão em ReactJS, para gerar o payment_token @Consultoria Técnica
imagem enviada na mensagem pelo usuario felipeex.

Avatar discord do usuario Joao Paulo

Joao Paulo

Caros boa tarde,
Estou tentando implantar pagamento com cartão em Reactjs e nao consigo utilizar as funções getPaymentToken e getInstallments.
Pelo histórico vi que é algo recorrente e talvez seja necessario deixar isso na documentacao com exemplos. Alguem consegue dar exemplo ou um norte?

Avatar discord do usuario matheus_efi

matheus_efi

Ver Respostas

Boa tarde, <@!328637064083931140>. O React permite a integração com outras bibliotecas, você pode utilizar uma em conjunto para que a sua aplicação execute sem sair do ambiente do app. Segue o link da documentação: https://pt-br.reactjs.org/docs/integrating-with-other-libraries.html .
Você pode também utilizar uma webview caso ache necessário.

Avatar discord do usuario jamesDockal

jamesDockal

Ver Respostas

como que eu faria para gerar o payment_token com react js no front?

Avatar discord do usuario .filipelopes

.filipelopes

Ver Respostas

Olá, Boa noite. Quero integrar a api de pagamento via cartao. Meu front é em reactjs, qual a lib pra eu acessar a gn e poder obter o payment token?

Avatar discord do usuario matheus_efi

matheus_efi

Ver Respostas

Bom dia <@!389091738007896064>, o React permite a integração com outras bibliotecas, você pode utilizar uma em conjunto para que a sua aplicação execute sem sair do ambiente do app. Segue o link da documentação: https://pt-br.reactjs.org/docs/integrating-with-other-libraries.html .
Uma outra forma de gerar o payment_token, pelo front-end é a utilização de um webview, desta forma no momento da geração do payment_token, a sua aplicação vai "abrir" uma página externa e executar o script que fornecemos. Segue o link sobre webview https://reactnative.dev/docs/webview .