Express+mongoose搭建简易的web数据接口

搭建node.js服务和express框架

开始:

  • npm install express --save
  • express server
  • done

启动:

  • npm install
  • node bin/www或者npm start

更换jade模板引擎为html

  • 安装ejs npm install ejs --save
  • app.js引入ejs : var ejs = require('ejs')
  • 配置view engine :
    app.engine('.html',ejs.__express)
    app.set('view engine', 'html')

安装mongoose

  • npm install mongoose --save

构建模型models
在server目录下建立models目录,新建文件movie.js用来存放movie数据模型
注意模型在输出的时候的名称与数据库中集合名的对应问题
比如我们数据库的集合名称是users那么输出User这里不用加s,数据库中的集合名称一定要加s,否则拿不到数据

const mongoose = require('mongoose')

const movieSchema = mongoose.Schema({
  title: {type: String, required: true},
  poster: String,
  rating: String,
  introduction: String,
  created_at: { type: Date, default: Date.now},
  updated_at: { type: Date, default: Date.now}
})

//输出
module.exports = mongoose.model('Movie', movieSchema)

构建路由routes
在routes目录下新建movie.js

var express = require('express');
var router = express.Router();
var mongoose = require('mongoose');
// 引入数据模型
var Movie = require('./../models/movie');

// 连接数据库
mongoose.connect('mongodb://127.0.0.1:27017/movie');

router.get('/',function(req, res, next) {
  Movie.find({}, (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服务,这里推荐用pm2工具
安装:npm install pm2 -g
使用:pm2 start server/bin/www

当然也可以用node直接启动node server/bin/www

启动之后访问localhost:3000/movie,就能访问到数据库中movie集合的数据了

跨域问题

跨域问题使用webpack反向代理,webpack配置config/index.js

proxyTable: {
  '/users/*': {
    target: 'http://localhost:3500',
    changeOrigin: true
  },
  '/table/*': {
    target: 'http://localhost:3500',
    changeOrigin: true
  }
},

axios创建的时候配置

const BASE_API = '/'

// 创建axios实例
const service = axios.create({
  baseURL: BASE_API, // api的base_url
  timeout: 15000 // 请求超时时间
})

实践:创建一个用户管理实例

  • 配置客户端获取用户列表的api
  • 去服务端写数据接口,获取全部用户信息
  • 写页面,创建钩子函数,去调用用户列表的api
    ··· ···
  • 完善添加用户、编辑用户、删除用户功能

根据权限动态配置路由

登录&权限看这里,参考大神的项目教程配置

你可能感兴趣的:(web前端)