web-dev-qa-db-fra.com

Renvoi de données depuis l'API Axios

J'essaie d'utiliser une application Node.JS pour effectuer et recevoir des demandes d'API. Il envoie une requête get à un autre serveur utilisant Axios avec les données reçues d'un appel d'API reçu. Le deuxième extrait correspond au moment où le script renvoie les données de l'appel. Il les prendra et les écrira sur la console, mais ne les renverra pas dans la deuxième API.

function axiosTest () {
axios.get(url)
.then(function (response) {
        console.log(response.data);
// I need this data here ^^
return response.data;
})
.catch(function (error) {
    console.log(error);
});
}

...

axiosTestResult = axiosTest(); 
response.json({message: "Request received!", data: axiosTestResult});

Je suis conscient que c'est faux, j'essaie simplement de trouver un moyen de le faire fonctionner. La seule façon dont je peux obtenir des données est via console.log, ce qui n’est pas utile dans mon cas.

javascriptnode.jsrestaxios
9
Bunkerguy

Renvoie la promesse de l'appel axios dans la fonction axiosTest, puis récupère la valeur de la promesse lorsque vous l'appelez à l'aide d'un autre .then.

function axiosTest() {
  return axios.get(url).then(response => {
    // returning the data here allows the caller to get it through another .then(...)
    return response.data
  })
}

axiosTest().then(data => {
  response.json({ message: 'Request received!', data })
})

Je recommande également de lire davantage sur le fonctionnement des promesses: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises

19
kingdaro

En règle générale, le code js de l’OMI est extrêmement important; pour vous, le code js consiste à garder séparées la logique de traitement des données et de construction de l’interface utilisateur, ce qui est également valable pour la récupération de données axios. plus simple et plus facile à gérer, comme on peut le voir à partir de ceci ok fetch

et ceci NOK chercher

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script>

       function getUrlParams (){
          var url_params = new URLSearchParams();
          if( window.location.toString().indexOf("?") != -1) {
             var href_part = window.location.search.split('?')[1]
             href_part.replace(/([^=&]+)=([^&]*)/g,
                function(m, key, value) {
                   var attr = decodeURIComponent(key)
                   var val = decodeURIComponent(value)
                   url_params.append(attr,val);
             });
          }
          // for(var pair of url_params.entries()) { consolas.log(pair[0]+ '->'+ pair[1]); }
          return url_params ;
       }


      function getServerData (url, urlParams ){
          if ( typeof url_params == "undefined" ) { urlParams = getUrlParams()  }
          return axios.get(url , { params: urlParams } )
          .then(response => {
             return response ;
          })
          .catch(function(error) {
             console.error ( error )
             return error.response;
          })
       }

    // Action !!!
    getServerData(url , url_params)
        .then( response => {
           if ( response.status === 204 ) {
              var warningMsg = response.statusText
              console.warn ( warningMsg )
              return
           } else if ( response.status === 404 || response.status === 400) {
              var errorMsg = response.statusText // + ": "  + response.data.msg // this is my api
              console.error( errorMsg )
              return ;
           } else {
              var data = response.data
              var dataType = (typeof data)
              if ( dataType === 'undefined' ) {
                 var msg = 'unexpected error occurred while fetching data !!!'
                 // pass here to the ui change method the msg aka
                 // showMyMsg ( msg , "error")
              } else {
                 var items = data.dat // obs this is my api aka "dat" attribute - that is whatever happens to be your json key to get the data from
                 // call here the ui building method
                 // BuildList ( items )
              }
              return
           }

        })




    </script>
1
Yordan Georgiev

axiosTest() déclenche asynchronously et n'est pas attendu. 

Un then()function doit ensuite être connecté pour capturer la responsevariable (axiosTestData).

Voir Promise pour plus d’informations.

Voir Async pour monter de niveau.

// Dummy Url.
const url = 'https://jsonplaceholder.typicode.com/posts/1'

// Axios Test.
const axiosTest = axios.get

// Axios Test Data.
axiosTest(url).then(function(axiosTestResult) {
  console.log('response.JSON:', {
    message: 'Request received',
    data: axiosTestResult.data
  })
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.18.0/axios.js"></script>

0
Arman Charan