使用vue-cli結合express獲取mongodb裏面的數據

最近一直在看node有關的內容，空閒時間作了一個小小的爬蟲，用於爬取電影天堂的數據而後寫到mongodb裏面，代碼地址：https://github.com/fangming666/dianyingtiantang/blob/master/nodeServer/index.js

而後獲取的mongodb數據以下：

咱們只須要獲得data裏面的數據就能夠了。那麼，咱們怎麼去獲得呢，個人想法是，在vue-cli裏面使用node的express,而後再執行查詢數據庫的操做便可，通過個人探索，這條路是能夠的；

首先，咱們須要安裝mongodb和express:

cnpm install mongodb express --save-dev

　而後我須要在webpack.dev.confis.js裏面進行設置，文件路徑以下：

好嘞，開始咱們的代碼征程：

1、配置express：

//配置express服務器
let express = require("express");
let apiServer = express();
let bodyParser = require("body-parser");
apiServer.use(bodyParser.urlencoded({extended: true}));
apiServer.use(bodyParser.json());
let apiRouter = express.Router(); //配置路由
apiServer.use("/api", apiRouter);

2、查詢mongodb裏面的數據：

let MongoClient = require('mongodb').MongoClient;
let DB_CONN_STR = 'mongodb://localhost:27017/test';
let dataS = {};
let movie = () => {
  let selectData = function (db, callback) {
    //鏈接數據庫
    let dbS = db.db("test");
    //鏈接到表
    let collection = dbS.collection('dytt');
    collection.find({}).toArray(function (err, result) {
      if (err) {
        console.log('Error:' + err);
        return;
      }
      callback(result);
    });
  };
  MongoClient.connect(DB_CONN_STR, function (err, db) {
    console.log("鏈接成功！");
    selectData(db, function (result) {
      db.close();
      console.log(result[0]);
      dataS = result[0];
    });
  });
  return dataS;
};

　　這裏不懂語法的能夠去看一下菜鳥教程的node這一塊mongodb 的語法，不贅述，自行百度便可；

3、找到devServer,在裏面添加：

  before(app){
      app.get("/api/giveData", (req, res) => {
        res.json({
          errno: 0,
          data: movie().data
        })
      });
    }

　這是寫在devServer裏面的，這是寫在devServer裏面的，這是寫在devServer裏面的，重要的事情說三遍。

4、從新執行cnpm run dev，在瀏覽器中輸入:http://localhost:8080/api/giveData/便可：

咱們使用的時候只需吧接口地址寫成「http://localhost:8080/api/giveData/」就能夠去訪問數據了