Mapas e Rotas com React Native - #10 Mercado Pago Mobile

No tutorial de hoje começaremos a trabalhar com a plataforma do Mercado Paga para recebimento das corridas efetuadas no nosso app.

Mercado Pago com React Native

O primeiro passo é acessarmos a url de desenvolvimento do Mercado Pago e criarmos a nossa conta na plataforma.
Posteriormente ao clicar no canto superior no seu nome de usuário você pode acessar o link de credenciais.

config/index.json

As credenciais serão inseridas no arquivo index.json, nosso arquivo de configuração:

{
  "googleApi": "SUA_GOOGLE_API",
  "publicKey": "SUA_PUBLIC_KEY_DO_MERCADO_PAGO",
  "token": "SEU_TOKEN_DO_MERCADO_PAGO",
  "urlRoot":"SEU_IP_DO_COMPUTADOR_LOCAL"
}

views/Checkout.js

Como inserimos a urlRoot no arquivo de configuração acima, agora podemos alterar a api fetch do componente Checkout.js

useEffect(()=>{
    async function sendServer(){
        let response=await fetch(config.urlRoot,{
           method: 'POST',
           headers:{
               Accept: 'application/json',
               'Content-Type':'application/json'
           },
            body: JSON.stringify({
              price: props.route.params.price,
              address: props.route.params.address
            })
        });
        let json=await response.json();
        console.log(json);
    }
    sendServer();
},[]);

Controller.js

Bora agora começar a trabalhar com a plataforma do Mercado Pago pra integrar ao nosso app.

const config=require('./config');
mercadopago.configure({access_token: config.token});

//Routes
app.post('/',(req,res)=>{
    let preference = {
        items:[{
            title: 'Gorgeous Steel Table',
            quantity: 1,
            currency_id: 'BRL',
            unit_price: 68.58
        }],
        payer:{
            email: "demo@mail.com"
        },
        payment_methods: {
            installments:3
        }
    };
    mercadopago.preferences.create(preference).then(function (data) {
        res.send(JSON.stringify(data.response.sandbox_init_point));
    }).catch(function (error) {
        console.log(error);
    });
});

Por hoje é só turma. Sucesso nos códigos e na vida!

Precisando de assessoria? webdesignemfoco@gmail.com