乐趣区

node笔记json文件的写入

jiezi

做的是一个小 demo
大致内容如下：
1.Vue 框架写的前端
2.axios 调用接口
3. 通过接口对 json 进行写入
4. 能够在局域网内所有电脑进行访问

首先需要 install 一些东西
前端是

npm install axios

后端安装 express 框架

npm install express --save
npm install body-parser --save
npm install cookie-parser --save
npm install multer --save

前端页面:

    write() {
      this.axios
        .get(`http:// 自己的 ip 地址 :8081/?name=${this.name}&score=${this.score}`)
        .then(res => {console.log("res --->", res);
        })
        .catch(err => {console.log("err --->", err);
        });
    }

内容比较简单，就写一个 write 方法
通过 axios 调用接口并传参
填自己的 IP 地址是因为要在局域网内访问，相当于本机是一个服务器，局域网内其他人填写的 name 和 score 都会到访问到本机的 8081 端口并写入本机的 JSON 文件

Api.js

var fun = require('./fun')
var express = require('express');
var app = express();
var bodyParser = require('body-parser');

app.all("*", function (req, res, next) {
    // 设置允许跨域的域名，* 代表允许任意域名跨域
    res.header("Access-Control-Allow-Origin", "*");
    // 允许的 header 类型
    res.header("Access-Control-Allow-Headers", "content-type");
    // 跨域允许的请求方式 
    res.header("Access-Control-Allow-Methods", "DELETE,PUT,POST,GET,OPTIONS");
    if (req.method.toLowerCase() == 'options')
        res.send(200);  // 让 options 尝试请求快速结束
    else
        next();})
// 创建 application/x-www-form-urlencoded 编码解析
var urlencodedParser = bodyParser.urlencoded({extended: false})

app.use('/public', express.static('public'));

app.get('/', function (req, res) {fun.writeJson(req.query)
})

var server = app.listen(8081, function () {var host = server.address().address
    var port = server.address().port
    console.log("<----------  服务已启动  ---------->")
    console.log("<---------  服务端口:8081 --------->")
})

fun 是另一个提供 JSON 写入的函数，这个 Api 主要功能是设置跨域并调用接口，可以看到 app.get 调用了 fun.writeJson 方法

fun.js

var fs = require('fs');
// 在真实的开发中 id 肯定是随机生成的而且不会重复的，下一篇写如何生成随机切不会重复的随机数，现在就模拟一下假数据
// 写入 json 文件选项
function writeJson(params) {
    // 现将 json 文件读出来
    fs.readFile('../src/assets/score.json', function (err, data) {if (err) {return console.error(err);
        }
        var person = data.toString();// 将二进制的数据转换为字符串
        person = JSON.parse(person);// 将字符串转换为 json 对象
        person.data.push(params);// 将传来的对象 push 进数组对象中
        person.total = person.data.length;// 定义一下总条数，为以后的分页打基础
        var str = JSON.stringify(person);// 因为 nodejs 的写入文件只认识字符串或者二进制数，所以把 json 对象转换成字符串重新写入 json 文件中
        fs.writeFile('../src/assets/score.json', str, function (err) {if (err) {console.error(err);
            }
            console.log('---------- 新增成功 -------------');
        })
    })
}

module.exports = {writeJson}

这就是写入 JSON 文件的方法

想要在局域网内的电脑都可以访问的话
需要把 node 的服务起了, 我的是

node Api.js

在前段需要修改一下 Vue 项目的 config/index.js
将 host 的 localhost 改为自己的 IP 地址
然后 npm run dev
就可以通过访问 IP 地址在局域网内访问页面

退出移动版