ノード上のAPIからJSONを取得してHTMLに送信

Question

「cryptocompare」というJavascript APIを使用して、その関数を使用してindex.htmlに印刷する特定のデータを呼び出す必要があります。

server.jsのスニペット

const express = require('express'); 
const app = express(); 
global.fetch = require('node-fetch'); 
const cc = require('cryptocompare'); 

app.listen(3000, function() { 
    console.log('listening on 3000'); 
}); 

app.get('/', (req, res) => { 
    res.sendFile(__dirname + '/index.html'); 
    // cc 
    // .coinList() 
    // .then(coinList => { 
    //  console.log(coinList[0]); 
    // }) 
    // .catch(console.error); 

    cc.price('BTC', ['USD']).then(prices => { 
    //console.log(prices); 
    // -> { USD: 1100.24, EUR: 1039.63 } 
    var BTCprice = prices; 
    console.log(BTCprice.USD); 
    }); 


}); 

これまでのところ、私はBTCprice.USD

のJSONデータを取得するための機能を得ることができた私は、送信の次の道を見つけようとしていますこのデータは、私のbash端末のconsole.logをindex.htmlファイルの要素に渡すことができます。

:)

Answer 1

このためにテンプレートエンジンを使用する必要があります。たとえば、pugをインストールすることができます。

npm install pug --save 

次に、express jsにpugを使用してレンダリングを依頼します。

html 
    head 
    title= title 
    body 
    h1= message 

をそして次

app.get('/', function (req, res) { 

cc.price('BTC', ['USD']).then(prices => { 
    //console.log(prices); 
    // -> { USD: 1100.24, EUR: 1039.63 } 
    var BTCprice = prices; 
    res.render('index', { title: 'USD', message: 'Price is '+BTCprice.USD }); 

    }); 
}); 

すべてのようなものにコードを変更：

app.set('view engine', 'pug') 

次の内容で、ビューディレクトリ内index.pugという名前のパグテンプレートファイルを作成します。この情報はhttp://expressjs.com/en/guide/using-template-engines.html