Axiosがクライアント側にデータをキャッチして送信しない

Question

Expressでバックエンドを構築してInstagramフィードイメージを取得し、ReactJsで構築されたフロントエンドにイメージURLを送信しました。 instagram-nodeを使ってイメージURLを取得し、それをフロントエンドに送っても問題ありませんが、Axiosを使って手動で行うと動作しません。

これは、InstagramのノードのNPMパケットと私のコードです：

ig.user_media_recent('user_id', function(err, medias, pagination, remaining, limit) { 
    if(err) console.log(err); 
    else{ 
     var inst = []; 
     medias.map(function(content){ inst.push(content.images.thumbnail.url)}); 
     res.send(inst); 
    } 
    }); 

私は上記の操作を行う場合、バックエンドはURLを取得し、私のフロントエンドに送信しますが、私は以下のように行うとしますaxios

axios.get('https://api.instagram.com/v1/users/self/media/recent/?access_token=token') 
     .then(function(res){ 
     console.log(res.data.data[0].images.standard_resolution.url); 
     res.send(res.data.data[0].images.standard_resolution.url); 
     }).catch(function (err){ 
     res.send(err.body); 
     }) 

これは何も送信しません。 console.logは正しいURLを表示しますが、res.sendは何もしません。バックエンドのlocalhostに行くと、URLが表示されません。どんな考え？

Answer 1

res.send(res.data.data[0].images.standard_resolution.url)さんはここに問題があるようです。これは、通常、私たちがどのように反応するかということです。応答ペイロードでアクションを発生させる必要があると約束した後、減速機は新しい状態を返します。最後に、UIは更新されたデータで再レンダリングされます。それが反応の仕組みです。

axios.get('https://api.instagram.com/v1/users/self/media/recent/?access_token=token') 
     .then(function(res){ 
     console.log(res.data.data[0].images.standard_resolution.url); 
     return { 
      type: GET_INSTA_FEEDS, 
      payload: response.data 
     } 
     }).catch(function (err){ 
     res.send(err.body); 
     }) 

このデータを取得して新しい状態を正しく返すためには、reducerを書きます。

接続HOC経由でコンポーネントにその状態をバインドします。それだけです