当前位置: 首页 > Web前端 > HTML5

节点笔记-写json文件

时间:2023-04-05 15:04:08 HTML5

我做的是一个小demo。大致内容如下:1.Vue框架写的前端2.axios调用接口3.通过接口写json4.要能访问局域网内的所有电脑,首先需要安装一些东西。前端是npminstallaxiosbackendinstallexpressframeworknpminstallexpress--savenpminstallbody-parser--savenpminstallcookie-parser--savenpminstallmulter--savefront-endpage:write(){this.axios.get(`http://你自己的ip地址:8081/?name=${this.name}&score=${this.score}`).then(res=>{console.log("res--->",水库);})。catch(err=>{console.log("err--->",err);});}内容比较简单,写一个write方法通过axios调用接口,传参填写自己的IP地址,因为需要在局域网访问就相当于本机是服务器。局域网内其他人填写的名字和分数,会访问本机的8081端口,写入本机的JSON文件。Api.jsvarfun=require('./fun')varexpress=require('express');varapp=express();varbodyParser=require('body-parser');app.all("*",function(req,res,next){//设置允许跨域域名,*表示允许任意域名跨域res.header("Access-Control-Allow-Origin","*");//允许的header类型","content-type");//允许跨域的请求方式res.header("Access-Control-Allow-Methods","DELETE,PUT,POST,GET,OPTIONS");如果(req.method.toLowerCase()=='选项')res.send(200);//让options尝试请求快速结束elsenext();})//创建application/x-www-form-urlencoded编码解析varurlencodedParser=bodyParser.urlencoded({extended:false})app.use('/public',express.static('public'));app.get('/',function(req,res){fun.writeJson(req.query)})varserver=app.listen(8081,function(){varhost=server.address().addressvarport=server.address().portconsole.log("<--------服务启动---------->")console.log("<--------服务端口:8081-------->")})fun是另外一个提供JSON写入的功能,这个Api的主要功能就是设置跨域并调用接口,可以看到app.get调用了fun.writeJson方法fun.jsvarfs=require('fs');//在实际开发中,id必须是随机生成的,会不再赘述。Next一篇关于如何生成随机和不重复随机数的文章,现在模拟假数据//writejsonfileoptionfunctionwriteJson(params){//现在读取json文件fs.readFile('../src/assets/score.json',function(err,data){if(err){返回控制台错误(错误);}varperson=data.toString();//将二进制数据转换为字符串person=JSON.parse(person);//将字符串转换为json对象person.data.push(params);//将传入的对象推入arrayobjectperson.total=person.data.length;//定义项目总数,为以后分页打下基础varstr=JSON.stringify(person);//因为nodejs的写入文件只识别字符串或者二进制numbers,将json对象转成字符串重写到json文件中);}console.log('------------添加成功------------');})})}module.exports={writeJson}这是JSON文件的写入方法。如果要局域网内的电脑都可以访问,需要启动节点服务。我的节点Api.js需要在上一节中进行修改。看一下vue项目的config/index.js,把宿主机的localhost改成自己的IP地址,然后npmrundev访问IP地址就可以访问局域网中的页面了