vue+vux 仿飛豬app火車票部分（五）---城市列表儲存到MongoDB資料庫並且啟用node.js服務

標籤：host   --   建立   index   pre   user   hello   forward   pat   

把車站列表儲存到資料庫，並且從本地建立服務

node.js建立httpserver

1.搭建基於express的運行環境

全域安裝express-gengerator

cnpm install -g express-gengerator

2.建立express項目,建立了本地服務

express server

產生server目錄，目錄下的bin是可執行檔，運行bin下的www檔案啟動服務

node server/bin/www

啟動成功開啟瀏覽器localhost:3000

server下的app.js是入口檔案

app.js的配置

var createError = require(‘http-errors‘);var express = require(‘express‘);var path = require(‘path‘);var cookieParser = require(‘cookie-parser‘);var logger = require(‘morgan‘);var ejs = require(‘ejs‘);var index = require(‘./routes/index‘);var users = require(‘./routes/users‘);var stations = require(‘./routes/stations‘);var app = express();// view engine setupapp.set(‘views‘, path.join(__dirname, ‘views‘));app.engine(‘.html‘,ejs.__express);app.set(‘view engine‘, ‘html‘);app.use(logger(‘dev‘));app.use(express.json());app.use(express.urlencoded({ extended: false }));app.use(cookieParser());app.use(express.static(path.join(__dirname, ‘public‘)));app.use(‘/‘, index);app.use(‘/users‘, users);app.use(‘/stations‘, stations);// catch 404 and forward to error handlerapp.use(function(req, res, next) {  next(createError(404));});// error handlerapp.use(function(err, req, res, next) {  // set locals, only providing error in development  res.locals.message = err.message;  res.locals.error = req.app.get(‘env‘) === ‘development‘ ? err : {};  // render the error page  res.status(err.status || 500);  res.render(‘error‘);});module.exports = app;

安裝mongoose

cnpm install mongoose --save

在路由route檔案夾下添加stations.js檔案

var express = require(‘express‘);var router = express.Router();var mongoose = require(‘mongoose‘);var Stations = require(‘../models/stations‘);//連結mongodb資料庫mongoose.connect(‘mongodb://127.0.0.1:27017/train‘);mongoose.connection.on("connected", function(){    console.log("MongoDB connected success.");});mongoose.connection.on("error", function(){    console.log("MongoDB connected fail.");});mongoose.connection.on("disconnected", function(){    console.log("MongoDB connected disconnected.");});router.get("/", function(req,res,next){    //res.send(‘hello,goods list .‘)    Stations.find({}, function(err,doc){        if(err){            res.json({                status:‘1‘,                msg:err.message            });        }else{            res.json({                status:‘0‘,                msg:‘‘,                result:{                    count:doc.length,                    list:doc                }            })        }    })});module.exports = router;

server檔案夾下建立models檔案夾，models下建立stations.js檔案

var mongoose = require(‘mongoose‘);var Schema = mongoose.Schema;var stationSchema = new Schema({    "sta_name":String,    "sta_ename":String,    "sta_code":String});module.exports = mongoose.model(‘Station‘,stationSchema);

最後開啟localhost:3000/stations 就可以訪問到車站資料了

可以通過介面訪問載入了，vue裡用axios, 但是這裡會存在跨域問題，在vue項目下的config檔案下的index.js更改配置

 proxyTable: {        ‘/stations‘:{            target:‘http://localhost:3000‘        }},

一系列配置之後就能通過axios愉快的提供者啦~

 

vue+vux 仿飛豬app火車票部分（五）---城市列表儲存到MongoDB資料庫並且啟用node.js服務