node.js 实现接口-操作文件进行用户增删改查

首先安装npm,使用npm安装express

npm install express -S

/*

 * @Author: yinxin

 * @Date: 2020-03-27 10:18:41

 * @LastEditTime: 2020-03-30 20:17:26

 * @LastEditors: Please set LastEditors

 * @Description: In User Settings Edit

 * @FilePath: /vue-sdu/login.js

 */

var express = require('express');

var app = express();

var fs = require("fs");

var bodyParser = require("body-parser")

app.use(bodyParser.json());

app.use(bodyParser.urlencoded());

var allowCrossDomain = function (req, res, next) {

  res.header('Access-Control-Allow-Origin', '*');//自定义中间件，设置跨域需要的响应头。

  res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, DELETE');  //允许任何方法

  res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type,X-Session-Token');   //允许任何类型

  next();

};

app.use(allowCrossDomain);

var jsonParser = bodyParser.json();

// get请求实现读取文件并返回数据

app.get('/api/users/:username/:password', function (req, res) {

  fs.readFile(__dirname + "/users.json", 'utf8', function (err, data) {   // 读取文件

      console.log( req.params.username );

      // console.log(JSON.parse(data),typeof JSON.parse(data))

      var status = {"msg":"用户名密码错误","status":false,data:""}  //定义一个返回的固定格式

      if(req.params.username){

        var jsonData = JSON.parse(data);

        console.log(req.params);

        for(var i = 0; i < jsonData.length;i++){

          if(req.params.username == jsonData[i].name && req.params.password == jsonData[i].password){

            if (req.params.username == "admin"){   // 当请求用户为admin时，验证成功则返回所有数据

              console.log("admin")

              status.data  = JSON.stringify(jsonData);

              status.status = true;

              status.msg = "验证成功。";

            }else{

              status.status = true;

              status.msg = "验证成功。";

              status.data = JSON.stringify(jsonData[i]);  // 普通用户返回当前登录用户数据

            }

          }

        }

        console.log(status);

        res.end( JSON.stringify(status));

    };

    })

});

///添加用户

app.post('/api/users/add', jsonParser, function(req,res){

  fs.readFile(__dirname + "/users.json",function(err,data){

    if(err){

        req.end(err)

    }

    console.log(req.params)

    console.log(req.body)

    // console.log(req)

    params={

      "name":req.query.name,

      "password":req.query.password,

      "age":req.query.age

    }

    console.log(req.query)

    var person = data.toString();//将二进制的数据转换为字符串

    person = JSON.parse(person);//将字符串转换为json对象

    console.log(person)

    person.push(params);//将传来的对象push进数组对象中

    console.log(person.data);

    var str = JSON.stringify(person);//因为nodejs的写入文件只认识字符串或者二进制数，所以把json对象转换成字符串重新写入json文件中

    fs.writeFile(__dirname + "/users.json",str,function(err){

        if(err){

          res.end(err)

        }

        res.end(JSON.stringify(str))

    });

});

});

var server = app.listen(8081, function () {

  var host = server.address().address

  var port = server.address().port

  console.log("访问地址为 http://%s:%s", host, port)

});

user.json

[{"name":"user","password":"456","age":"23"},{"name":"user2","password":"456","age":"44"},{"name":"user3","password":"456","age":"34"},{"name":"admin","password":"admin","age":"12"},{"name":"yinxin","password":"123","age":"12"},{"name":"yinxin1","password":"123","age":"12"},{"name":"yinxin1","password":"123","age":"12"}]

 login.html

<!--

 * @Author: your name

 * @Date: 2020-03-27 12:20:04

 * @LastEditTime: 2020-03-28 21:59:13

 * @LastEditors: Please set LastEditors

 * @Description: In User Settings Edit

 * @FilePath: /vue-sdu/login1.html

 -->

 <!doctype html>

 <html>

 <head>

 <meta charset="utf-8">

 <link rel="stylesheet" href="./login.css">

 <title>login</title>

 <style type="text/css">

 </style>

 </head>

 <body>

 <div class="header" id="head">

   <div class="title">金渡教育</div>

 </div>

 <div class="wrap" id="wrap">

   <div class="logGet">

       <!-- 头部提示信息 -->

       <div class="logD logDtip">

         <p class="p1">登录</p>

       </div>

       <!-- 输入框 -->

       <form method="get" onsubmit="return false">

        <div class="lgD">

          <input type="text" id="username" required="required"

            placeholder="输入用户名" />

        </div>

        <div class="lgD">

          <input type="password" id="password" required="required"

            placeholder="输入用户密码" />

        </div>

        <div class="logC">

          <a target="_self"><button type="submit" onclick="sendData()">登录</button>

          </a>

          <span id="message"></span>

        </div>

      </form>

     </div>

 </div>

 <div class="footer" id="foot">

   <div class="copyright">

     <p>Copyright © 2020 Qunar.com Inc. All Rights Reserved.</p>

     <div class="img">

     <i class="icon"></i><span>联系邮箱：yinxin918@163.com</span>

   </div>

   </div>

 </div>

 <script>

  function sendData(){

      var name = document.getElementById("username").value;

      var password = document.getElementById("password").value;

      var xmlhttp = new XMLHttpRequest();

      if (name && password){

         //open---指定一个接口（url, method）

        xmlhttp.open("get", "http://localhost:8081/api/users/"+name+"/"+password); //异步

        xmlhttp.send(); //发送

        xmlhttp.onreadystatechange = function() { //接收数据

          //4--node服务响应完成   200---成功

          if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {

              //把拿到的数据展示出来 写入dom

              // content.innerHTML = xmlhttp.responseText; //conten 简写

              data = JSON.parse(xmlhttp.responseText)

              console.log(data)

              if (data.status){

                document.getElementById("message").innerHTML = data.msg

                location.href = "index.html?data="+JSON.stringify(data)

              }else{

                document.getElementById("message").innerHTML = data.msg

              }

          }

      }

      }

  }

</script>

 </body>

 </html>

*{

  margin:;

  padding:;

}

#wrap {

  height: 719px;

  width:;

  background-repeat: no-repeat;

  background-position: center center;

  position: relative;

}

#head {

  height: 120px;

  width:;

  background-color: #66CCCC;

  text-align: center;

  position: relative;

}

#foot {

  width:;

  height: 126px;

  background-color: #CC9933;

  position: relative;

}

#wrap .logGet {

  height: 408px;

  width: 368px;

  position: absolute;

  background-color: #FFFFFF;

  top: 20%;

  right: 15%;

}

.logC a button {

  width: 100%;

  height: 45px;

  background-color: #ee7700;

  border: none;

  color: white;

  font-size: 18px;

}

.logGet .logD.logDtip .p1 {

  display: inline-block;

  font-size: 28px;

  margin-top: 30px;

  width: 86%;

}

#wrap .logGet .logD.logDtip {

  width: 86%;

  border-bottom: 1px solid #ee7700;

  margin-bottom: 60px;

  margin-top: 0px;

  margin-right: auto;

  margin-left: auto;

}

.logGet .lgD img {

  position: absolute;

  top: 12px;

  left: 8px;

}

.logGet .lgD input {

  width: 100%;

  height: 42px;

  text-indent: 2.5rem;

}

#wrap .logGet .lgD {

  width: 86%;

  position: relative;

  margin-bottom: 30px;

  margin-top: 30px;

  margin-right: auto;

  margin-left: auto;

}

#wrap .logGet .logC {

  width: 86%;

  margin-top: 0px;

  margin-right: auto;

  margin-bottom: 0px;

  margin-left: auto;

}

.title {

  font-family: "宋体";

  color: #FFFFFF;

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);  /* 使用css3的transform来实现 */

  font-size: 36px;

  height: 40px;

  width: 30%;

}

.copyright {

  font-family: "宋体";

  color: #FFFFFF;

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);  /* 使用css3的transform来实现 */

  height: 60px;

  width: 40%;

  text-align:center;

}

#foot .copyright .img {

  width: 100%;

  height: 24px;

  position: relative;

}

.copyright .img .icon {

  display: inline-block;

  width: 24px;

  height: 24px;

  margin-left: 22px;

  vertical-align: middle;

  background-repeat: no-repeat;

  vertical-align: middle;

  margin-right: 5px;

}

.copyright .img .icon1 {

  display: inline-block;

  width: 24px;

  height: 24px;

  margin-left: 22px;

  vertical-align: middle;

  background-repeat: no-repeat;

  vertical-align: middle;

  margin-right: 5px;

}

.copyright .img .icon2 {

  display: inline-block;

  width: 24px;

  height: 24px;

  margin-left: 22px;

  vertical-align: middle;

  background-repeat: no-repeat;

  vertical-align: middle;

  margin-right: 5px;

}

#foot .copyright p {

  height: 24px;

  width: 100%;

}

span{

  color:red;

}

node.js 实现接口-操作文件进行用户增删改查的更多相关文章

用dom4j解析xml文件并执行增删改查操作
转自:https://www.aliyun.com/jiaocheng/1339446.html xml文件: <?xml version="1.0" encoding=&q ...
用户增删改查 django生命周期数据库操作
一 django生命周期 1 浏览器输入一个请求(get/post)2 响应到django程序中3 执行到url,url通过请求的地址匹配到不同的视图函数4 执行对应的视图函数,此过程可以查询数据库, ...
Node+Express+node-mysql 实战于演习全套mysql(增删改查)
最近这段时间研究Node感觉不错,自己做了一个增删改查,虽然有些简陋,但是思想是想通的,其实所有项目都是增删改查,有助于初学者快速掌握Node 首先本实例展示的是基于Node+Express+nod ...
第二百七十六节，MySQL数据库，【显示、创建、选定、删除数据库】，【用户管理、对用户增删改查以及授权】
MySQL数据库,[显示.创建.选定.删除数据库],[用户管理.对用户增删改查以及授权] 1.显示数据库 SHOW DATABASES;显示数据库 SHOW DATABASES; mysql - 用户 ...
springLdap 操作ldap示例（增删改查）
转自:http://blog.csdn.net/sundenskyqq/article/details/9002440 这部分的示例网上的确有很多,但是个人在查找的过程中还是感到不够满意,所以就自己总 ...
DjangoMTV模型之model层——ORM操作数据库（基本增删改查）
Django的数据库相关操作对象关系映射(英语:(Object Relational Mapping,简称ORM),是一种程序技术,用于实现面向对象编程语言里不同类型系统的数据之间的转换.从效果上说 ...
MyBatis操作数据库（基本增删改查）
一.准备所需工具(jar包和数据库驱动) 网上搜索下载就可以二.新建一个Java project 1.将下载好的包导入项目中,build path 2.编写MyBatis配置文件:主要填写prope ...
EF Codefirst 多对多关系操作中间表的增删改查（CRUD）
前言此文章只是为了给新手程序员,和经验不多的程序员,在学习ef和lambada表达式的过程中可能遇到的问题. 本次使用订单表和员工表建立多对多关系. 首先是订单表: public class Ord ...
ASP.NET学习笔记（3）——用户增删改查（三层）
说明(2017-10-6 11:21:58): 1. 十一放假在家也没写几行代码,本来还想着利用假期把asp.net看完,结果天天喝酒睡觉,回去的票也没买到,惨.. 2. 断断续续的把用户信息的页面写 ...

随机推荐

【WPF学习】第五十八章理解逻辑树和可视化树
在前面章节中,花费大量时间分析了窗口的内容模型——换句话说,研究了如何在其他元素中嵌套元素,进而构建完整的窗口. 例如,考虑下图中显示的一个非常简单的窗口,该窗口包含两个按钮.为创建该按钮,在窗口中嵌 ...
什么是Servlet？Servlet的周期和方法
1.什么是Servlet? Servlet是运行在web服务器或应用服务器的程序,它是作为来自web浏览器或其他http客户端的请求和HTTP服务器上的数据库或应用程序之间的中间层! 2.Servl ...
项目测试中发现产品bug怎么办
我所在的产品线,并非公司最大最强的产品甚至为了推广我们这个产品,一般会拿给客户先免费试用而在试用之前,是要经过一番通测的,测得很急,测得很快所以产品bug非常多那么在测试项目的时候,自然会发现 ...
BFC块级格式上下文介绍
块级格式上下文(Block formatting context) 什么是BFC? 块格式化上下文(block formatting context) 是页面 CSS视觉渲染的一部分.它是用于决定块盒 ...
Python网络协议(osi七层协议)
一互联网的本质咱们先不说互联网是如何通信的(发送数据,文件等),先用一个经典的例子,给大家说明什么是互联网通信. 现在追溯到八九十年代,当时电话刚刚兴起,还没有手机的概念,只是有线电话,那么此时你 ...
CentOS系统python默认版本由python2改为python3
一.了解 CentOS中如果安装有yum,一般会有python2的某个版本.命令行键入python,出现的python2的环境: [root@instance-hrnebyqu src]# pytho ...
学习 CSS 之用 CSS 3D 实现炫酷效果
一.前言把大象关进冰箱需要几步?三步,把冰箱门打开,把大象关进去,把冰箱门关上. 用 CSS 实现 3D 效果需几步?三步,设置透视效果 perspective,改变元素载体为 preserve-3 ...
小白的docker极简入门（二）、5分钟教你玩转docker安装
0-前言上一篇中,我们已经安装后Linux了,我们需要在Linux下安装docker,然后才能在docker中安装和部署各种应用同样,5分钟教你完成docker正确安装和使用, 不是纸上谈兵,不是 ...
《Python学习手册第五版》 -第18章参数
在函数的定义和调用中,参数是使用最多喝最频繁的,本章内容就是围绕函数的参数进行讲解本章重点内容如下: 1.参数的传递 1)不可变得参数传递 2)可变得参数传递 2.参数的匹配模式 1)位置次序:从左 ...
AspNetCore3.1_Secutiry源码解析_6_Authentication_OpenIdConnect
title: "AspNetCore3.1_Secutiry源码解析_6_Authentication_OpenIdConnect" date: 2020-03-25T21:33: ...

node.js 实现接口-操作文件进行用户增删改查

首先安装npm,使用npm安装express

node.js 实现接口-操作文件进行用户增删改查的更多相关文章

随机推荐

热门专题