Node.js擷取并傳回資料給Nuxt.js

Nuxt.js

<template>
  <h1>{{ title }}</h1>
</template>

<script>
import axios from 'axios'
let tp = {
  1: 'test',
  2: 'lalala'
};
export default {
  asyncData ({ params }) {
    return axios.get(`http://127.0.0.1:8888/`, { params: tp }).then(res => {
      return { title: res.data.title }
    })
  }
}
</script>
           

另一種寫法

async asyncData ({ params }) {
    const { data } = await axios.get(`http://127.0.0.1:8888/`, { params: tp })
    return { title: data.title }
  }
           

Node.js

let http = require('http');
let url = require('url');
let fs = require('fs');
let querystring = require('querystring');

let TestTitle = {
  title: "asyncData Test OK!"
};

function onRequest(request, response) {
  let urlStr = url.parse(request.url);
  let param = querystring.parse(urlStr.query);
  console.log("請求成功!");
  response.writeHead(200, {
    "Content-Type": 'text/plain',
    'charset': 'utf-8',
    'Access-Control-Allow-Origin': '*',
    'Access-Control-Allow-Methods': 'PUT,POST,GET,DELETE,OPTIONS'
  });
  console.log(param);
  response.write(JSON.stringify(TestTitle));
  response.end();
}
http.createServer(onRequest).listen(8888);
           

效果