reactjsapicallbackmercadopago

How make invisible callback on MercadoLivre request?


Im use the mercadolivres API and it`s need a request that return a callback with a token but... I need this process be invisible and only return a token.

I call the function with my backend and a callback is:

import React, { Component } from 'react';
import {getToken} from '../../../auth';
import axios from 'axios';
import Swal from 'sweetalert2';

class CallBack extends Component {

  constructor(props) {
    super(props);
    const token = window.location.href.split('?')[1].split('=')[1].split('&')[0];
    this.state = {
      token: token,
      message: '',
      status: '',
      executed: false,
      doIt: 0
    };
  }
  render(){
    const token = this.state.token;

    return (
        !this.state.executed ? (

            axios.post(process.env.REACT_APP_API_URL + `/accounts/from-mercado-livre`,
                {"code": token,},
                {headers: {"Authorization": 'Bearer ' + getToken()}},
            ).then(res => {

              this.setState(
                  {
                    executed: true,
                    doIt: 2
                  }
              )

              if (res.data.status === 'success') {
                Swal.fire({
                  html: '<p>' + res.data.message + '</p>', type: 'success', showConfirmButton: true,
                  onClose: () => {
                    this.props.history.push('/listacontas');
                    window.location.reload();
                  }
                });
              } else {
                Swal.fire({
                  html: '<p>' + res.data.message + '</p>', type: 'error', showConfirmButton: true,
                  onClose: () => {
                    this.props.history.push('/listacontas');
                    window.location.reload();
                  }
                });
              }
            }).catch(error => {
              console.log('rejected');
              console.log(error.response);


              if (error.response !== undefined) {
                Swal.fire({
                  html: '<p>' + error.response.data.message + '</p>',
                  type: 'error',
                  showConfirmButton: false,
                  showCancelButton: true,
                  cancelButtonText: 'Fechar',
                  onClose: () => {
                    this.props.history.push('/listacontas');
                    window.location.reload();
                  }
                });
              } else {
                this.props.history.push('/listacontas');
                window.location.reload();
              }
            })

        ) : (
            console.log('None')
        )
    ) 
  }
}

export default CallBack;

I send a user token for my backend and its return other token with information for callback.

I hope make all process invisible for user, only showing a success message.


Solution

  • It's not possible because the event started outside of the browser.

    I made an async method that receives a status using the back-end and that fixes the problem. However, I can't share it it here because it contains private information.