一:准备工作
uniapp
1.创建uniapp文件
2.打开运行到谷歌浏览器 http://localhost:8080/
node.js
1.安装node相关依赖,然后根据提示操作4,5,6步骤
npm install express --save -g //express依赖
npm install express-generator --save -g //express应用生成器
express nodeDemo //node项目名字
cd nodeDemo //进入node项目
npm install //安装依赖
npm start //启动node项目
2.地址栏打开 localhost:3000 显示下图,则运行成功
3.写一个自定义的接口
打开uniNode/nodeDemo/routes/index.js文件 添加下面两段代码,记得重启!!!
var express = require('express');
var router = express.Router();
// 解决跨域问题
router.all("*", function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "X-Requested-With");
res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OP0TIONS");
res.header("X-Powered-By", "Express");
res.header("Content-Type", "text/html; charset=UTF-8");
next();
});
/* GET home page. */
router.get('/', function(req, res, next) {
res.render('index', { title: 'Express' });
});
// 自定义接口
router.get('/list', function(req, res, next) {
res.send({
"code":1,
data:[
{id:1,name:'html'},
{id:2,name:'css'},
{id:3,name:'javascript'},
]
})
});
module.exports = router;
重新运行node,地址栏输入 localhost:3000/list 可查看到写的数值
二:项目接入node接口
uniNode/pages/index/index.vue 文件夹下,请求接口,F12控制台,即可查看返回内容
uni.request({
//localhost也可以换成本地局域网ip地址,192.168.xxxx
url:'http://localhost:3000/list',
success: (res) => {
console.log(res.data);
}
})