node.js实现简单的登录注册页面
首先需要新建四个文件
一个服务器js
一个保存数据的txt
一个登陆、一个注册页面html
1、注册页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>regist</title>
</head>
<body>
<div>
<label for="user">用户名</label><input type="text" id="user">
</div>
<div>
<label for="password">密 码</label><input type="password" id="password">
</div>
<div>
<button id="register">注册</button>
</div>
</body>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script>
$(function () {
$("#register").click(function () {
$.ajax({
url:"http://localhost:3000/register",
type:"POST",
data:{
username:$("#user").val(),
password:$("#password").val()
},
success:function (res) {
alert(res);
},
error:function (err) {
console.log(err);
}
})
})
});
</script>
</html>
2、登录界面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>login</title>
</head>
<body>
<div>
<label for="user">用户名</label><input type="text" id="user">
</div>
<div>
<label for="password">密 码</label><input type="password" id="password">
</div>
<div>
<button id="login">登录</button>
<button id="register"><a href="regist.html">注册</a></button>
</div>
</body>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script>
$(function () {
$("#login").click(function () {
if ($("#user").val().length == 0){
return alert("请输入内容!");
}
if ($("#password").val().length == 0){
return alert("请输入密码!");
} $.ajax({
url:"http://localhost:3000/login",
type:"POST",
data:{
username:$("#user").val(),
password:$("#password").val()
},
success:function (res) {
alert("登录成功!")
},
error:function (err) {
console.log(err);
}
}) })
});
</script>
</html>
3、搭建服务器
var http = require("http");
var url = require("url");
var qs = require("querystring");
var fs = require("fs");
http.createServer(function (req , res) {
//设置请求头
res.setHeader("Access-Control-Allow-Origin","*");
if(req.method == "POST"){
//接收发来的用户名和密码
var result = "";
//获取前端代码发来的路由地址
var pathName = url.parse(req.url).pathname;
req.addListener("data",function (chunk) {
result += chunk;
});
req.on("end" , function () {
var user = qs.parse(result);
//判断用户是否存在
if(user.username){
fs.readFile("db.txt" , "utf-8" , function (err,data) {
if (!err){
console.log("读取文件成功");
if (!data){
if(pathName == "/login"){
res.end("该用户不存在");
return;
}
//根据前端发来的路由地址判断是登录还是注册页面，如果是注册页面
if(pathName == "/register"){
//创建一个数组一个对象来保存帐号和密码
var arr = [];
var obj = {};
//把用户的帐号密码保存
obj.username = user.username;
obj.password = user.password;
arr.push(obj);
//同步写入db.txt文件，必须是同步进行
fs.writeFileSync("db.txt" , JSON.stringify(arr) , "utf-8");
res.end("注册成功!");
return;
}
}else {
console.log("文件中有数据");
//把数据转成JSON对象，以便我们使用
var arr = JSON.parse(data);
//遍历整个保存数据的数组 判断登录注册
for(var i = 0;i < arr.length;i++){
var obj = arr[i];
if(obj.username == user.username){
if(pathName == "/login"){
if (obj.password == user.password){
res.end("登录成功!");
return;
}else {
res.end("密码错误！");
return;
}
}
if(pathName == "/register"){
res.end("该用户已存在!");
return;
}
}
}
if(pathName == "/login"){
res.end("用户名不存在!");
return;
}
if(pathName == "/register"){
//创建新对象写入数据
var obj = {};
obj.username = user.username;
obj.password = user.password;
arr.push(obj);
fs.writeFileSync("db.txt" , JSON.stringify(arr) , "utf-8");
res.end("注册成功!");
return;
}
}
}else {
console.log("读取文件失败");
}
})
}
});
}else {
res.end("get请求");
}
}).listen(3000 , function (err) {
if (!err){
console.log("服务器启动成功，正在监听port3000...");
}
});
4、在db.txt文件中可以查看注册信息
node.js实现简单的登录注册页面的更多相关文章
- Centos7 中 Node.js安装简单方法
最近,我一直对学习Node.js比较感兴趣.下面是小编给大家带来的Centos7 中 Node.js安装简单方法,在此记录一下,方便自己也方便大家,一起看看吧! 安装node.js 登陆Centos ...
- javaWeb登录注册页面
简单的登陆注册页面 1.配置JDBC驱动连接数据库 2. 配置struts2框架 3. 利用1 2完成登录页面, 注意做到不耦合,即servlet Api和控制器完全脱离) 4. 利用1 2 制作注册 ...
- Angular之简单的登录注册
使用Angular实现了一个简单的登录注册的功能........ 涉及到的Angular知识点很少 主要是这个功能的实现...(*^__^*) 嘻嘻…… 里面涉及到的知识点记录: 1.本地存储的操作 ...
- 登录注册页面html模版
登录注册页面html模版 地址:http://download.csdn.net/detail/xiaosongaixiaoqian/5432033
- /*用户登录注册页面输入框的设置*/<span>的使用
<!DOCTYPE html> /*用户登录注册页面输入框的设置*/ <html lang="en"> <head> <meta char ...
- 创建node.js一个简单的应用实例
在node.exe所在目录下,创建一个叫 server.js 的文件,并写入以下代码: //使用 require 指令来载入 http 模块 var http = require("http ...
- Python 实现简单的登录注册界面
Python 实现简单的登录注册界面 注意:编写代码之前需要导入很重要的包 import tkinter as tk import pickle from tkinter import message ...
- 带你玩转JavaWeb开发之四 -如何用JS做登录注册页面校验
今日内容 使用JQuery完成页面定时弹出广告 使用JQuery完成表格的隔行换色 使用JQuery完成复选框的全选效果 使用JQuery完成省市联动效果 使用JQuery完成下列列表左右选择 使用J ...
- HTML登录注册页面简单实现
github:传送门 , 码云: 传送门 效果参考: 登录页面,注册页面 使用了bootstrap,jQuery. 后端使用的CGI处理表单,存入MySQL数据库.(之后更新) 登录页面源码 < ...
随机推荐
- 【算法系列学习】Dijkstra单源最短路 [kuangbin带你飞]专题四 最短路练习 A - Til the Cows Come Home
https://vjudge.net/contest/66569#problem/A http://blog.csdn.net/wangjian8006/article/details/7871889 ...
- vector作为参数的三种传参方式
c++中常用的vector容器作为参数时,有三种传参方式,分别如下(为说明问题,用二维vector): function1(std::vector<std::vector<int> ...
- Java Swing 图形界面实现验证码（验证码可动态刷新）
import java.awt.Color;import java.awt.Font;import java.awt.Graphics;import java.awt.Toolkit;import j ...
- Java中的Classpath
classpath实际上就是编译后的,以classes文件夹为起点的路径各种path获取到的路径的区别 Demo.class.getResource("");//得到的是Demo类 ...
- css文字溢出隐藏，及强制断句
只显示一行文字,便溢出隐藏 text-overflow: ellipsis; white-place: nowrap; overflow: hidden; 显示 n 行文字后便溢出隐藏 displa ...
- Gitlab使用Webhook实现Push代码自动部署
1.Jenkins 安装完成以后,首先我们在Jenkins中需要安装一下,Gitlab Hook Plugin 插件: 2.插件安装完成我们创建任务,在任务重构建触发器下获取回调URL: 注意: 注意 ...
- 刨根究底字符编码之四——EASCII及ISO 8859字符编码方案
EASCII及ISO 8859字符编码方案 1. 计算机出现之后,从美国发展到欧洲,由于欧洲很多国家中所用到的字符中,除了基本的美国也用的那128个ASCII字符之外,还有很多衍生的拉丁字母等字符 ...
- 025 hibernate悲观锁、乐观锁
Hibernate谈到悲观锁.乐观锁,就要谈到数据库的并发问题,数据库的隔离级别越高它的并发性就越差 并发性:当前系统进行了序列化后,当前读取数据后,别人查询不了,看不了.称为并发性不好 数据库隔离级 ...
- Grid search in the tidyverse
@drsimonj here to share a tidyverse method of grid search for optimizing a model's hyperparameters. ...
- Js之浅谈dom操作
JavaScript之浅谈dom操作 1.理解dom: DOM(Document Object Model ,文档对象模型)一种独立于语言,用于操作xml,html文档的应用编程接口. 怎么说,我从两 ...