Heim  >  Artikel  >  Web-Frontend  >  Einführung in die Methode zum Abrufen von Mongodb-Daten mit vue-cli+express

Einführung in die Methode zum Abrufen von Mongodb-Daten mit vue-cli+express

青灯夜游
青灯夜游nach vorne
2020-11-06 17:41:131870Durchsuche

In der folgenden Spalte „Vue.js-Tutorial“ erfahren Sie, wie Sie vue-cli in Kombination mit Express verwenden, um Daten in Mongodb abzurufen. Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird für alle hilfreich sein.

Einführung in die Methode zum Abrufen von Mongodb-Daten mit vue-cli+expressVor kurzem habe ich in meiner Freizeit einen kleinen Crawler erstellt, um die Daten von Movie Paradise zu crawlen und in die Mongodb-Codeadresse zu schreiben. fangming666 /dianyingtiantang/blob/master/nodeServer/index.js

Dann lauten die erhaltenen Mongodb-Daten wie folgt:

Wir müssen nur die Daten in Daten abrufen. Wie bekommen wir es? Meine Idee ist, Node's Express in Vue-Cli zu verwenden und dann die Datenbankabfrage durchzuführen.

Zunächst müssen wir mongodb installieren und express:

cnpm install mongodb express --save-dev

Dann muss ich es in webpack.dev.confis.js einrichten. Der Dateipfad lautet wie folgt:

Okay, beginnen wir unsere Code-Reise:

1. Express konfigurieren:

//配置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);

Zweitens fragen Sie die Daten in Mongodb ab:

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;
};

Wenn Sie die Grammatik hier nicht verstehen, können Sie sich die Mongodb-Syntax von Node im Tutorial für Anfänger ansehen, ohne auf Details einzugehen.

Drei,

  before(app){
      app.get("/api/giveData", (req, res) => {
        res.json({
          errno: 0,
          data: movie().data
        })
      });
    }
找到devServer,在里面添加:Das ist, was in devServer geschrieben ist, das ist in devServer geschrieben, das ist in devServer geschrieben, wichtige Dinge sollten dreimal gesagt werden.

4. Führen Sie cnpm run dev erneut aus und geben Sie im Browser http://localhost:8080/api/giveData/ ein:

Wenn wir es verwenden, müssen wir nur die Schnittstellenadresse als „http“ schreiben :/ /localhost:8080/api/giveData/" Sie können auf die Daten zugreifen Eine Auswahl an vue.js-Video-Tutorials

Weitere Kenntnisse zum Thema Programmierung finden Sie unter:

Programmierkurse
! !

Das obige ist der detaillierte Inhalt vonEinführung in die Methode zum Abrufen von Mongodb-Daten mit vue-cli+express. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:cnblogs.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen