场景:真实模拟前后端分离,使用express配置接口
准备工作:
1.安装node(官网下载)
2.安装express
- npm install -g express
3.安装express-generator
- npm install -g express-generator
命令行操作:
//在想要存放服务的文件目录,打开命令行(怎么打开命令行不需要赘述喽)
express --version //检查一下express是不是装好了
express 项目名 //eg: express tiyaDemo (千万不要加引号,会变成项目名)
cd tiyaDemo
npm install //安装依赖包
npm start //启动项目 你会在浏览器上看到welcome express
到这里,express服务就搭建好了,我暂时还不知道怎么直接在里面配接口,所以直接把app.js重写了,代码如下:
var createError = require('http-errors');
var express = require('express');
var app = express();
//跨域
app.all('*', function (req, res, next) {
res.header('Access-Control-Allow-Origin', '*');
//Access-Control-Allow-Headers ,可根据浏览器的F12查看,把对应的粘贴在这里就行
res.header('Access-Control-Allow-Headers', 'Content-Type');
res.header('Access-Control-Allow-Methods', '*');
res.header('Content-Type', 'application/json;charset=utf-8');
next();
});
//接口
app.get("/subject/:id?",function(req,res){
console.log(req.params);
if(req.params.id == "math"){
res.json({
data:["集合","几何"]
})
}else if(req.params.id == "yuwen"){
res.json({
data:["语文","英文"]
})
}else{
res.json({
data:["全部","都有"]
})
}
})
var server = app.listen(3001, function () {
var port = server.address().port;
console.info('复制打开浏览器', 'localhost:'+port)
});
最后一步,找到tiyaDemo路径,运行app.js:
E:...\tiyaDemo > node app.js
浏览器上看效果:
http://localhost:3001/subject/
{"data":["全部","都有"]}
结束。