MOCK DATA -- node路由
前后端分离,有时候后端接口给的不是很及时,这就需要前端自己mock data,
本文讲的简单的node模拟数据 api路由跳转
首先有个data.js(json)文件,
路由:
配置在dev-server.js
require('./check-versions')()
var config = require('../config')
if (!process.env.NODE_ENV) process.env.NODE_ENV = JSON.parse(config.dev.env.NODE_ENV)
var path = require('path')
var express = require('express')
var webpack = require('webpack')
var opn = require('opn')
var proxyMiddleware = require('http-proxy-middleware')
var webpackConfig = require('./webpack.dev.conf')
// default port where dev server listens for incoming traffic
var port = process.env.PORT || config.dev.port
// Define HTTP proxies to your custom API backend
// https://github.com/chimurai/http-proxy-middleware
var proxyTable = config.dev.proxyTable
var app = express()
//router Start
var appData = require('../data.json');//获取data数据
var seller = appData.seller; //获取详细数据
var goods = appData.goods; //获取详细数据
var ratings = appData.ratings; //获取详细数据
var apiRouter = express.Router(); //定义一个路由
apiRouter.get('/seller',function(req,res){//.get方法第一个参数 地址,第二个是个函数,传入requrice responce,responce返回json对象
res.json({
errno: 0, //错误代码
data: seller //数据
});
});
apiRouter.get('/goods',function(req,res){
res.json({
errno: 0,
data: goods
});
});
apiRouter.get('/ratings',function(req,res){
res.json({
errno: 0,
data: ratings
});
});
app.use('/api',apiRouter);//加载路由 访问路径:根目录/api/seller 根目录/api/goods 根目录/api/ratings
//router End
var compiler = webpack(webpackConfig)
var devMiddleware = require('webpack-dev-middleware')(compiler, {
publicPath: webpackConfig.output.publicPath,
stats: {
colors: true,
chunks: false
}
})
var hotMiddleware = require('webpack-hot-middleware')(compiler)
// force page reload when html-webpack-plugin template changes
compiler.plugin('compilation', function (compilation) {
compilation.plugin('html-webpack-plugin-after-emit', function (data, cb) {
hotMiddleware.publish({ action: 'reload' })
cb()
})
})
// proxy api requests
Object.keys(proxyTable).forEach(function (context) {
var options = proxyTable[context]
if (typeof options === 'string') {
options = { target: options }
}
app.use(proxyMiddleware(context, options))
})
// handle fallback for HTML5 history API
app.use(require('connect-history-api-fallback')())
// serve webpack bundle output
app.use(devMiddleware)
// enable hot-reload and state-preserving
// compilation error display
app.use(hotMiddleware)
// serve pure static assets
var staticPath = path.posix.join(config.dev.assetsPublicPath, config.dev.assetsSubDirectory)
app.use(staticPath, express.static('./static'))
module.exports = app.listen(port, function (err) {
if (err) {
console.log(err)
return
}
var uri = 'http://localhost:' + port
console.log('Listening at ' + uri + '\n')
// when env is testing, don't need open it
if (process.env.NODE_ENV !== 'testing') {
opn(uri)
}
})
//获取详细数据
MOCK DATA -- node路由的更多相关文章
- SPA中,Node路由优先级高于React路由
一.问题描述 在一场面试中,面试官问到了React和Node路由之间的关系. 现在SPA(单页面应用)的使用越来越广. Node(后台)和React(前端)都有自己的路由,当我页面访问一个URL的时候 ...
- Hadoop ->> Name node/Data node和Job tracker/Task tracker的区别
刚好看到关于Name node/Data node和Job tracker/Task tracker的解释,一开始有点混淆,以为说Job tracker必须运行在Name node上,他们俩有依赖或者 ...
- node路由访问,中间件返回数据
node路由访问,中间件返回数据 定义一个变量存放json数据,中间件接受数据 var responseData; router.use(function(req, res, next) { resp ...
- 一统江湖的大前端(2)—— Mock.js + Node.js 如何与后端潇洒分手
<一统江湖的大前端>系列是自己的前端学习笔记,旨在介绍javascript在非网页开发领域的应用案例和发现各类好玩的js库,不定期更新.如果你对前端的理解还是写写页面绑绑事件,那你真的是有 ...
- express for node 路由route几种实现方式的思考
1.路由实现方式和顺序 express框架创建的模板app,js中默认代码 var express = require('express'); var routes = require('./rout ...
- 原生node路由操作以及注意事项
var http = require("http"); var url = require("url"); var ejs = require("ej ...
- Node路由简单的处理
看过node很多例子,都是将路由直接放到入口文件中处理,使得文件显得很大很乱,特别是当一个项目变大,有上百甚至上千的路由,那该怎么办? 最近在想如何将一个个的路由放到一个单独的模块中处理,比如'/us ...
- [Unit Testing] Mock a Node module's dependencies using Proxyquire
Sometimes when writing a unit test, you know that the module you're testing imports a module that yo ...
- Hadoop集群出现no data node to stop的解决方案
问题描述: 今天stop hadoop集群的时候出现no datanode to stop ,寻找解决方案,并不是网上资料所说的什么DFS Used .Non DFS Used等于0 .所有的节点都是 ...
随机推荐
- python学习道路(day3note)(元组,字典 ,集合,字符编码,文件操作)
1.元组()元组跟列表一样,但是不能增删改,能查.元组又叫只读列表2个方法 一个 count 一个 index2.字典{}字典是通过key来寻找value因为这里功能比较多,所以写入了一个Code里面 ...
- Arduino.h
#ifndef Arduino_h #define Arduino_h #include <stdlib.h> #include <stdbool.h> #include &l ...
- 在asp.net WebForms中使用路由Route
1.新建WebForms应用程序 2.打开Global.asax文件代码如下: public class Global : System.Web.HttpApplication { protected ...
- js数组方法扩展
/** * Created by Administrator on 2016/9/1. */ //数组去重 Array.prototype.unique = function(){ this.sort ...
- ElasticSearch 入门笔记1
1. 起步 1. 建demo工程,看文档,做典型demo 2. 资源列表: http://es.xiaoleilu.com/010_Intro/10_Installing_ES.html 3. 启动: ...
- APP开发:对于IOS APP应用的推广渠道有哪些?
亿合科技了解到,随着移动互联网时代的到来,苹果从2007年进入中国市场,一直备受大众喜爱,手机应用也层出不穷.那么对于那么多的IOS APP应用怎么能获得用户的喜爱呢?于是推广APP应用是需要做的,亿 ...
- linux--------------今天又遇到一个奇葩的问题,就是linux文件的权限已经是777了但是还是没有写入权限,按照下面的命令就解决了
查看SELinux状态: 1./usr/sbin/sestatus -v ##如果SELinux status参数为enabled即为开启状态 SELinux status: ...
- html5,单击显示详细信息
<details open=""> <summary>点击率</summary> <p>详细信息</p&g ...
- C/C++二维数组的用法
二维数组在存储时按行优先连续存储,数组名是一个二维指针,如 int a[3][2] 中,a 是一个二维指针,而a[0],a[1],a[2]都相当于普通的一位数组的数组名,是一个固定值的指针. 二维数组 ...
- 在Visual Studio 中开发自定义脚手架 Scaffolder
1.官方简单教程 http://blogs.msdn.com/b/webdev/archive/2014/04/03/creating-a-custom-scaffolder-for-visual-s ...