Node.js实现登录注册功能

2024-09-30 19:29:28

本文实例为大家分享了Node.js实现登录注册功能的具体代码，供大家参考，具体内容如下

目录结构

注册页面：

reg.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <link rel="stylesheet" href="./src/css/reg.css">
</head>
<body>
    <div class="reg">
        <h1>用户注册</h1>
        <p>
            <label for="">用户名：</label>
            <input type="text" id="username">
        </p>
        <p>
            <label for="">密&emsp;码：</label>
            <input type="text" id="password">
        </p>
        <button>注册</button>
    </div>
</body>
</html>
<script src="./node_modules/jquery/dist/jquery.js"></script>
<script>
    //点击注册发送ajax请求
    $('button').eq(0).on('click',()=>{
        $.ajax({
            url: '/register',
            type: 'POST',
            data: {
                username : $('#username').val(),
                password : $('#password').val()
            },
            success: function(res){
                switch (res) {
                    case '1':
                        alert('成功');
                        window.location.href = "./login.html";
                    break;
                    case '2':
                        alert('失败');
                    break;
                    case '3':
                        alert('重名');
                    break;
                    case '4':
                        alert('未知错误');
                    break;
                } 
            }
        })
    })
</script>

登录页面：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <link rel="stylesheet" href="./src/css/reg.css">
</head>
<body>
    <div class="reg">
        <h1>用户登录</h1>
        <p>
            <label for="">用户名：</label>
            <input type="text" id="username">
        </p>
        <p>
            <label for="">密&emsp;码：</label>
            <input type="text" id="password">
        </p>
        <button>登录</button>
    </div>
</body>
</html>

<script src="./node_modules/jquery/dist/jquery.js"></script>
<script>
    //点击登录发送ajax请求
    $('button').eq(0).on('click',()=>{
        $.ajax({
            url: '/login',
            type: 'GET',
            data: {
                username: $('#username').val(),
                password: $('#password').val()
            },
            success: function(res){
                console.log(res);
                switch (res){
                    case '1':
                        alert('成功');
                        window.location.href = "./index.html";
                        break;
                    case '2':
                        alert('失败');
                        break;
                    case '3':
                        alert('密码错误');
                        break;
                    case '4':
                        alert('未知错误');
                        break;
                }
            }
        })
    })
</script>

app.js

const http = require("http");
const fs = require("fs");
const url = require("url");
const querystring = require("querystring");
const post = 3000;
//通过http模块创建服务器，并监听端口3000
const server = http.createServer();
server.on("request",(req,res)=>{
    const dataurl = url.parse(req.url);
    //静态伺服
    //默认进入reg.html页面 
    if((req.url == "/" || req.url == "/reg.html") && req.method == "GET" && req.url != "/favicon.ico"){
        fs.readFile("./reg.html","utf8",(err,data)=>{
            if(err){
                fs.readFile("./404.html","utf8",(err,data)=>{
                    res.end(data);
                })
            }
            res.setHeader("Content-type","text/html");
            res.end(data);
        })
    //读取login.html
    }else if(req.url == "/login.html" && req.method == "GET"){
        fs.readFile("./login.html","utf8",(err,data)=>{
            if(err){
                fs.readFile("./404.html","uft8",(err,data)=>{
                    res.end(data);
                })
            }
            res.setHeader("Content-type","text/html");
            res.end(data);
        })
    //读取index.html
    }else if(req.url == "/index.html" && req.method == "GET"){
        fs.readFile("./index.html","utf8",(err,data)=>{
            if(err){
                fs.readFile("./404.html","uft8",(err,data)=>{
                    res.end(data);
                })
            }
            res.setHeader("Content-type","text/html");
            res.end(data);
        })
    //读取reg.css
    }else if(req.url == "/src/css/reg.css" && req.method == "GET"){
        fs.readFile("src/css/reg.css","utf8",(err,data)=>{
            if(err){
                console.log(err);
            }
            res.setHeader("Content-type","text/css");
            res.end(data);
        })
    //读取jquery
    }else if(req.url == "/node_modules/jquery/dist/jquery.js" && req.method == "GET"){
        fs.readFile("./node_modules/jquery/dist/jquery.js","utf8",(err,data)=>{
            if(err){
                console.log(err);
            }
            res.end(data);
        })
    }
})
server.listen(post);

注册接口：

/register

else if(req.url == "/register" && req.method == "POST"){
  let str = '';
    req.on('data',(chunk)=>{
        str += chunk;
    })
    req.on('end',()=>{
        let dataObj = querystring.parse(str);
        fs.readFile("./data.json","utf8",(err,data)=>{
            let obj = JSON.parse(data);   
            for(let i = 0; i < obj.length; i++){
                if(obj[i].username == dataObj.username){
                    return res.end('3');
                }
            }
            obj.push(dataObj);
            fs.writeFile('./data.json',JSON.stringify(obj),'utf8',(err,result)=>{
                if(err){
                    return res.end('2');
                }
                return res.end('1');
            })
        })
    })
}

登录接口：

/login

else if(dataurl.pathname == "/login" && req.method == "GET"){
   console.log(dataurl);
    var userInput = querystring.parse(dataurl.query);
    fs.readFile("./data.json","utf8",(err,data)=>{
        let obj = JSON.parse(data);
        for(let i = 0; i < obj.length; i++){
            if(obj[i].username == userInput.username && obj[i].password == userInput.password){
                return res.end('1');
            }else if(obj[i].username == userInput.username && obj[i].password != userInput.password){
                return res.end('3');
            }
        }
    })
}

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

node.js实现登录注册页面

本文实例为大家分享了node.js登录注册页面展示的具体代码,供大家参考,具体内容如下首先需要新建四个文件一个服务器js 一个保存数据的txt 一个登陆.一个注册页面html 1.注册页面 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>regist</title> </head> <
node.js+jQuery实现用户登录注册AJAX交互

最近实现了Node.js当作后台,jQuery写前台AJAX代码的,实现用户登录和注册的功能,刷新了前后端交互的三观.特记录一下. 1.login.ejs实现form框架 <form > <ul> <li><p>用户名</p></li> <li><input type="text" name="username" id="username"></
利用node.js+mongodb如何搭建一个简单登录注册的功能详解

前言最近突然对数据库和后台感兴趣了,就开始了漫长的学习之路,想想自己只是一个前端,只会java斯科瑞普,所以就开始看nodejs,看着看着突然发现mongodb和nodejs更配哦!,遂就开了我的mongodb之路.下面话不多说了,来一起看看详细的介绍吧. mongodb简介就超简洁的说一下,mongo就是一个nosql的数据库,不使用sql的语法,当然其实也是大同小异的,增删改查还是差不多的,但是在概念上mongo还是跟mysql有相当大的区别的;比如在mongo中没有表的概念,而是一个集
node.js实现简单登录注册功能

本文实例为大家分享了node.js实现简单登录注册的具体代码,供大家参考,具体内容如下 1.首先需要一个sever模块用于引入路由,引入连接数据库的模块,监听服务器2.要有model层,里面写数据库连接模块和数据库的各种model(表),并导出model对象3.工具类utils,里面存放一些功能的模块,并且封装后导出 ,例如发送验证码的功能4.写路由,需要对数据库操作就使用导出的model对象,需要功能模块就使用导出的功能对象随后返回这个路由,在sever里引入5.生成api文档 sever模块
node.js+express+mySQL+ejs+bootstrop实现网站登录注册功能

同志们,经过不懈的努力,查了各种文档,终于鼓捣出了一个稍微像样一点的node项目,当然如果直接拿去项目里用,这个demo还太简单,毕竟一个完整的登录注册还有很多实际的内容,本案例mySQL的用户列表里,为便于理解,只设置了username 和password两个字段,正常的登录注册,肯定会有更多的字段的.但是对于初学node的人来说,比如笔者,还是学习到了不少内容,甚至,紧张的我不知如下下笔,肯定这个是参考了很多网上其他少年博客,以后这个登录注册demo会依据项目的需要而有所改进, 效果如下效
Node.js+Express+MySql实现用户登录注册功能

本文实例为大家分享了Node.js实现用户登录注册的具体代码,供大家参考,具体内容如下 IDE:WebStorm 工程目录: 数据库表 Login.js: /** * Created by linziyu on 2017/7/8. */ /** * express接收html传递的参数 */ var express=require('express'); var app=express(); var mysql=require('mysql'); /** * 配置MySql */ var con
快速搭建Node.js(Express)用户注册、登录以及授权的方法

项目准备建立一个文件夹,这里叫 EXPRESS-AUTH npm init -y 启动服务新建一个server.js 或者 app.js npm i express 开启端口,启动服务 // server.js // 引入 express const express = require('express') // 创建服务器应用程序 const app = express() app.get('/user', async (req, res) => { res.send('hello nod
Node.js实现登录注册功能

本文实例为大家分享了Node.js实现登录注册功能的具体代码,供大家参考,具体内容如下目录结构注册页面: reg.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial
Node.js实现登陆注册功能

本文实例为大家分享了Node.js实现登陆注册的具体代码,供大家参考,具体内容如下 1.服务器端在项目里创建一个json文件用来存储数据,通过express创建服务器对象,fs模块对文件进行读写. 运用post请求代码如下: var express = require('express') var fs = require("fs") var app = express() app.use(express.static("www")) app.use(expre
Node.js如何实现注册邮箱激活功能 (常见)

一. 先注册一个支持发送验证邮件的邮箱,网易的126邮箱就可以注册成功后进行登录,然后点击导航栏的设置,选择POP3/SMTP/IMAP,开启POP3/SMTP/IMAP服务,设置授权码就可以了. 二. 下载nodemailer插件在命令行输入:npm install --save nodemailer 三. 编写发送邮件代码: 1 . 对发送激活邮件代码进行封装,然后导出: //email.js // 引入 nodemailer var nodemailer = require('node
Node+Express+MongoDB实现登录注册功能实例

注入MongoDB 依赖 var mongoose = require("mongoose"); 由于需要进行表单处理,需要用到bodyParser中间件 bodyParser模块来做文件解析,将表单里的数据进行格式化 var bodyParser = require("body-parser"); app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: true })); 登录后将
图解NodeJS实现登录注册功能

该Demo根据菜鸟教程的练手项目,请提前到菜鸟教程的官网查看nodejs的相关教程,根据教程实际操作一遍,然后自己动手去实现登录.注册功能,此Demo只作参考,不符合前端相关规范. 使用的技术栈 node+express+mongodb 项目目录结构 node_modules: 第三方模块目录 public: 公共文件目录(js.css.image) login.html:登录页面 register.html:注册页面 main.html:主页面 db.js:数据库相关封装(数据库添加.查询)
koa2实现登录注册功能的示例代码

本文介绍了koa2实现登录注册功能的示例代码,分享给大家,具体如下: 这个主要结合前几天的内容,做个实际案例的效果版本: 项目结构: 前几天,我们把注册和登录的页面demo实现了,今天我们主要实现这么几个内容注册新用户判断该邮箱是否注册过登录判断是否注册过登录时的密码的正确本文代码地址:https://github.com/xiaqijian/koa2-lessons/tree/master/lesson6 明天,我们将利用session实现登录状态判断今天的这篇是在之前的代码基础
利用Node.JS实现邮件发送功能

第一步.配置篇首先需要安装nodemailer库 npm install nodemailer//默认会安装最新的版本. 关于这个库的文档参见nodemailer 第二步.库的一些使用介绍这个库使用方法很简单的.首先是要创建一个用于发送邮件的实例 var transporter = nodemailer.createTransport(transport[, defaults]) transport参数属性属性太多了就只写一些关键的属性 port:连接的端口号,一般就是465 host:你
vue中uni-app 实现小程序登录注册功能

思路: 1.使用微信的 open-type="getUserInfo" 获取用户信息,将用户信息保存到userinfoDetails对象中去. <button v-else type="primary" class="reserve-btn" open-type="getUserInfo" @getuserinfo="getuserinfo">预约挂号</button> 2.使用 u

Node.js实现登录注册功能

相关推荐

随机推荐