2017-03-02 6 views
0

私はrequestを使用してapi呼び出しを行い、アプリケーションにデータを返します。 私は私が私のインデックスファイルを襲ったAPI呼び出しが、その後行われている私のコードノードapiデータをクライアント側jsに送信

var express = require('express'); 
var request = require('request'); 
var app = express(); 

app.get('/', function(req, res){ 
    res.sendFile(__dirname + "/index.html"); 
    request('https://api.darksky.net/forecast/apikey/37.8267,-122.4233', function (error, response, body) { 
     console.log('error:', error); 
     console.log('statusCode:', response && response.statusCode); 
     console.log('body:', body); 
    }); 
}).listen(3000); 

console.log('Server is up and running'); 

の身体応じてデータを送受信することができるよ/ - これまでのところ、とても良い

は、しかし、私はしたいです私のデータを使ってbodyレスポンスをreact jsファイルに送ります。そのため、データをクライアントに提供することができます。 データを別のjavascriptファイルに提供する方法に関するヘルプが見つかりません。

+0

あなたの反応jsファイルでGETリクエストをどのようにしているかを示すコードを投稿できますか? –

+0

問題は、私はそれをどうすればいいのか分かりませんが、私はaxios、またはjQueryを使って呼び出しを行うと思います。しかし、私はちょうど上記のファイルに要求をする必要がありますか? – frisk0

+2

api.darksky.netリクエストから受け取ったデータを返すための新しい 'app.get'ルートを作成し、それをindex.htmlを返すあなたのホームページルートから分離することにしました。それで、あなたは 'res.json(body)'を返すことができます –

答えて

1

私はあなたの索引を1つのパスに、darkskyの要求を別のパスに提供するべきだと思います。

var express = require('express'); 
var request = require('request'); 
var app = express(); 

app.get('/', function(req, res){ 
    res.sendFile(__dirname + "/index.html"); 
}); 

app.get('/api/forecast, function(req, res) { 
    request('https://api.darksky.net/forecast/apikey/37.8267,-122.4233', function (error, response, body) { 
     console.log('error:', error); 
     console.log('statusCode:', response && response.statusCode); 
     console.log('body:', body); 
     res.json(body); 
    }); 
}); 

app.listen(3000); 
console.log('Server is up and running'); 

と体を得るためにサーバーにAJAX要求を使用してクライアント側で、このような何か:

return $.getJSON('http://localhost:3000/api/forecast') 
     .then(function(data) { 
     this.setState({ forecast: data.results }); 
     }); 

はそれが役に立てば幸い!

+0

これは私が探しているもののようです。私はそれを試してみる:)ありがとう! – frisk0

+0

jQueryは幸せではないようです。http:// localhost:3000/api/forecast net :: ERR_CONNECTION_REFUSED jquery.min.js:4 – frisk0

+0

@ c-poulsenちょっとAxiosライブラリを試してみませんか?これは約束をサポートし、クライアント側とサーバー側の両方で使用できます。すべての私の '要求'ライブラリメソッドをAxios https://www.npmjs.com/package/axiosに置き換えました – Kunok

関連する問題