node.js实现form表单提交到数据库(详细代码)

最近在学习node.js,就记录下自己做的一个小小demo案例(代码若有错误,望各位朋友及时提出哈 ~ ^^ ~)*

1、首先新建一个formServer.js文件把需要的模块引入进来(要先在node.js环境里面安装这些模块哦,怎么安装呢?去问问度娘就知道了哈)

var http = require('http');
var querystring = require('querystring');
var mysql = require('mysql');
var multiparty = require('multiparty');
var form = new multiparty.Form();  //解析formData里面数据的模块

2、创建一个http服务用来接收和响应客户端提交的数据

var server = http.createServer(function(requset,respone){
	var data;
	//非formData的表单提交
	// requset.on('data',function(a){
	// 	data = querystring.parse(decodeURIComponent(a));
	// 	console.log('数据:',data);
	// })

	//formData的表单提交
    form.parse(requset, function (err, a) {
       console.log(a);
       data = a;
    });
	requset.on('end',function(a){
		console.log('接收数据完成!');
		connect(data);
	    respone.end(JSON.stringify({statua:200 , msg:'请求成功' , data:{ data }}));
	})
	// respone.setHeader('Access-Control-Allow-Origin','*');  //解决跨域问题
	respone.writeHead(200,{'Content-Type':'application/json;chatset=utf-8'});
}).listen(8080,'www.test.com');  // api接口:www.test.com:8080

3、创建数据库连接(数据库准备工作: 案例里面的数据库名称test,表中的字段 name , age , sex , tel)

// 使用连接池去连接服务器
var pool = mysql.createPool({
	host:'localhost',
	database:'test',  //数据库表名
	port:3306,
	user:'root',
	password:'root'
})

function connect(params){
	pool.getConnection(function(err,connection){
		if (err) {
			 console.log('与mysql数据库建立连接失败');
			}else{
			var addSe = 'insert into user(name,age,sex,tel) value (?,?,?,?)';
			var addData = [params.name , params.age , params.sex , params.tel];
			connection.query(addSe,addData,function(err,result){
				if (err) {
					console.log('插入数据失败',err);
				}else{
					console.log('插入数据成功');
					connection.release();
				}
			})
		}
	})
    //处理数据库服务器连接中断时的操作
  	pool.on('error',function(err){
	    if(err.code === 'PROTOCOL_CONNECTION_LOST'){
	      console.log('与mysql数据库之间的连接丢失');
	      //3秒后重新尝试连接数据库
	      setTimeout(function(){
	        connect();
	      },3000);
	    }else{
	      throw err;
	    }
    })
}

4、前面3步骤已经建好的服务器和数据库连接,最后一步就可以向服务器发送请求了,在本地新建一个index.html文件使用ajax提交数据到服务器

<form id="Form">
    <ul>
        <li>
            <label>姓名:</label><input type="text" name="name" id="name"/>
        </li>
        <li>
            <label>性别:</label><input type="text" name="sex" id="sex"/>
        </li>
        <li>
            <label>年龄:</label><input type="text" name="age" id="age"/>
        </li>
        <li>
            <label>手机:</label><input type="text" name="tel" id="tel"/>
        </li>
        <li><input type="button" value="提交" id="ok_btn"/></li>
    </ul>
</form>

<script>
    $('#ok_btn').on('click', function (){
        var form = new FormData(document.getElementById('Form'));
        $.ajax({
            type: 'post',
            url: 'http://www.test.com:8080/',
            data:form,
            processData:false,
            contentType:false,
            success: function (data) {
                console.log(data);
                alert('提交数据成功');
                $('#name').val('');
                $('#sex').val('');
                $('#age').val('');
                $('#tel').val('');
            }
        })
    })
</script>

现在整个流程已经创建好,就可以实现一个简单的表单提交了

猜你喜欢

转载自blog.csdn.net/m0_37273490/article/details/82820252