node.js前后台交互示例 -- 使用node.js实现用户注册功能
node.js环境自行搭建,参考菜鸟教程的node.js就可以。
1 通过ajax提交index.html中form表单
register.html文件如下:
<!doctype html>
<html>
<head>
<meta charset="UTF-8" />
<title>Document</title>
<script src="jquery.js"></script>
<script src="ajax.js"></script>
<style>
form{padding: 100px;border: 1px solid red;width: 350px;margin: 0 auto;}
form input{display: block;margin: 0 auto;margin-bottom: 20px;}
</style>
</head>
<body>
<form id="register" action="" method="get">
<input type="hidden" name="action" value="register" />
用 户 名: <input type="text" name="name" placeholder="请输入用户名..." />
密  码: <input type="password" name="pass" placeholder="请输入密码..." />
电子邮件:<input type="email" name="email" placeholder="请输入合法邮件名..." />
<input id="register-sub" type="submit" value="注册" />
</form>
</body>
</html>
ajax.js文件如下:
$(function(){
$('#register-sub').on('click',function(){
var info = $('form').serialize();
$.ajax({
type:"get",
url:"http://127.0.0.1:8081",
data:info,
success:function(response,status,xhr){
alert(response);
localStorage.name = $('input[name="name"]').val();
}
});
return false;
});
$('#login-sub').on('click',function(){
return false;
});
});
2 重点node.js后台:接收数据、写入数据库、给前台返回信息
首先创建服务器文件:server.js: res.writeHead();后边的那个是为了跨域访问
var http = require('http');
var url = require('url');
var util = require('util');
var mysql = require('./mysql');//这个是自己写的用来向数据库写入用户的文件
http.createServer(function(req,res){
res.writeHead(200,{"Content-Type":'text/plain','charset':'utf-8','Access-Control-Allow-Origin':'*','Access-Control-Allow-Methods':'PUT,POST,GET,DELETE,OPTIONS'});
//解析URL参数
var params = url.parse(req.url,true).query;
mysql.reg(params.action,params.name,params.pass,params.email);
res.write("注册成功");
res.end();
}).listen(8081);
其次mysql.js文件连接数据库:
exports.reg = function (action,name,pass,email){
var mysql = require('mysql');
var connection = mysql.createConnection({
host : 'localhost',
user : 'root',
password : '123456',
port: '3306',
database: 'test',
});
connection.connect();
var modSql = "insert into user (name,pass,email) values ('"+name+"','"+pass+"','"+email+"')";
connection.query(modSql,function (err, result) {
if(err){
console.log('[UPDATE ERROR] - ',err.message);
return;
}
});
connection.end();
}
这样其实一个注册功能就基本实现了,在浏览器中打开register.html,点击注册,会把数据提交到服务器(这里跨域了奥),再写入数据库,就实现了注册功能。
node.js前后台交互示例 -- 使用node.js实现用户注册功能的更多相关文章
- 背水一战 Windows 10 (64) - 控件(WebView): 加载指定 HttpMethod 的请求, 自定义请求的 http header, app 与 js 的交互
[源码下载] 背水一战 Windows 10 (64) - 控件(WebView): 加载指定 HttpMethod 的请求, 自定义请求的 http header, app 与 js 的交互 作者: ...
- node.js 接口调用示例
测试用例git地址(node.js部分):https://github.com/wuyongxian20/node-api.git 项目架构如下: controllers: 文件夹下为接口文件 log ...
- 前端(Node.js)(3)-- Node.js实战项目开发:“技术问答”
1.Web 与 Node.js 相关技术介绍 1.1.Web应用的基本组件 web应用的三大部分 brower(GUI)<==>webserver(business logic.data ...
- node.js学习(二)--Node.js控制台(REPL)&&Node.js的基础和语法
1.1.2 Node.js控制台(REPL) Node.js也有自己的虚拟的运行环境:REPL. 我们可以使用它来执行任何的Node.js或者javascript代码.还可以引入模块和使用文件系统. ...
- Edge.js:让.NET和Node.js代码比翼齐飞
通过Edge.js项目,你可以在一个进程中同时运行Node.js和.NET代码.在本文中,我将会论述这个项目背后的动机,并描述Edge.js提供的基本机制.随后将探讨一些Edge.js应用场景,它在这 ...
- io.js - 兼容 NPM 平台的 Node.js 新分支
io.js(JavaScript I/O)是兼容 NPM 平台的 Node.js 新分支,由 Node.js 的核心开发者在 Node.js 的基础上,引入更多的 ES6 特性,它的目的是提供更快的和 ...
- [Whole Web, Node.js, PM2] Configuring PM2 for Node applications
In this lesson, you will learn how to configure node apps using pm2 and a json config file. Let's sa ...
- 前后台交互经常使用的技术汇总(后台:Java技术,前台:Js或者Jquery)
1:由于针对特定的前后台交互用到的知识总结,所以不大量贴代码,主要给出思路,方便自己以后脑补和技术总结,当然也希望可以帮助到别人. 后台Json和其他格式转化,之前总结过Json和对象,集合,字符串的 ...
- [Node.js] 01 - How to learn node.js
基本概念 链接:https://www.zhihu.com/question/47244505/answer/105026648 链接:How to decide when to use Node.j ...
随机推荐
- Java8中 Parallel Streams 的陷阱 [译]
译注:文本有所精简和意译 原文链接 : Java Parallel Streams Are Bad for Your Health!原作者:OLEG SHELAJEV 翻译:Hason 转载请保留相关 ...
- Alamofire源码解读系列(五)之结果封装(Result)
本篇讲解Result的封装 前言 有时候,我们会根据现实中的事物来对程序中的某个业务关系进行抽象,这句话很难理解.在Alamofire中,使用Response来描述请求后的结果.我们都知道Alamof ...
- 构建Docker平台【第四篇】创建服务及扩缩容等操作
第一步:创建服务 1. 配置 nginx 的 yaml 文件 apiVersion: extensions/v1beta1 kind: Deployment metadata: name: my-ng ...
- 基于Asp.Net Core Mvc和EntityFramework Core 的实战入门教程系列-3
来个目录吧: 第一章 第二章 第三章 暂时就这么多.后面路线更新吧 创建.查询.更新.删除 这章主要讲解使用EF完成 增删改查的功能. 自定义"详情信息"页面 我们通过基架生成的代 ...
- Oracle 字符集设置
因为装Linux系统时选择的是英文版,所以当需要测试中文数据库时会出现乱码,这里记录一下我修改字符集的操作. 一些命令: 1.查看sqlplus客户编码: $ echo $NLS_LANG 2.查看 ...
- Rabbitmq集群高可用部署详细
序言 清风万里的季节,周末本该和亲人朋友一起消遣这烂漫的花花草草,或是懒洋洋的晒个太阳听听风声鸟鸣.无奈工作使然,理想使然,我回到啦公司,敲起啦键盘,撸起啦代码,程序狗的世界一片黯然,一片黯然,愿天下 ...
- Struts2学习笔记③
今天把这两天看书体会的Struts的运行原理记录一下:其实Struts官方提供了一张图可以视为景点,几乎每一个将Struts的课程都会使用: 上面的图里面的struts核心过滤器已经更换为Struts ...
- AVFoundation自定义录制视频
#import <AVFoundation/AVFoundation.h> #import <AssetsLibrary/AssetsLibrary.h> @interface ...
- Unity获取安卓手机运营商,电量,wifi信号强度,本地Toast,获取已安装apk,调用第三方应用,强制自动重启本应用
一个完整的游戏项目上线需要不断的完善优化,但是到了后期的开发不再仅仅是游戏了,它的复杂度远远大于纯粹的应用开发.首先必须要考虑的就是集成第三方SDK,支付这块渠道商已经帮你我们做好了,只需要按照文档对 ...
- 介绍CPU,内存,硬盘,指令以及他们之间的关系
CPU:CPU,又称CPU芯片,中央处理器.是计算机上最重要的集成电路,位于计算机的主板上面,其主要任务是从主存上面提取指令和对指令进行执行,CPU包括运算逻辑部件.寄存器部件,运算器和控制部件等.C ...