1、首先用webStorm提供的模板创建服务端框架 file -> New -> Project
2.创建Node.js服务端框架
3、其他的文件都不需要改动，搭建自己的服务端需要创建自己的应用框架如user.js(名称自己随便写)
4、创建好自己的js文件后需要在app.js里引入和设置自己的模块
5、还需要解决跨域访问的问题，同样在app.js里设置
var app = express(); //解决跨域问题 app.all("*",function (req,res,next) { res.header("Access-Control-Allow-Origin","*"); res.header("Content-Type", "application/json;charset=utf-8"); next(); });注意：一定是在express()创建Express对象之后引入 解决跨域问题代码为固定写法，直接引入即可
6、在node_modules文件夹内创建mysql模块
可以直接打开webStorm的Terminal输入npm i mysql安装
7、安装好mysql模块后，ok,可以开始在user.js里书写自己的服务端了
//首先需要导入mysql模块，前两句为固定写法 var mysql=require('mysql'); var router = require('express').Router(); //必须传入一个对象类型 var sqlConfig={ //数据库的地址 host:'localhost', //数据库的用户名，默认用户名是root user:'root', //数据库的名字 database:'sharetime' //如果有密码还需要些数据库密码password }; //用createConnection方法创建连接数据库的对象 var connection = mysql.createConnection(sqlConfig); //connect方法连接数据库 connection.connect(function (error) { if (error){ //如果连接错误 重新连接数据库 connection = mysql.createConnection(connection.config); connection.connect(); } }); //使用post方法传输 router.post('/register',function (req,res) { console.log(req.body); var info={"message":"asd"}; res.send(info); //接收客户端传过来的参数，所有的增删该查都是调用query方法执行对应的sql语句 //注意username，password,phone要和客户端传过来的顺序一致 connection.query("INSERT INTO `time` (`id`, `username`, `password`, `phone`) VALUES (NULL, '"+req.body.username+"', '"+req.body.password+"', '"+req.body.phone+"')",function (err,result,f) { //检测是否出错 console.log(err); console.log(result) }); }) //导出自己创建好的模块，也是固定写法 module.exports = router;框架参考mysql文档
8、搭建好服务端现在去写客户端 创建一个工程： HTML:
<!DOCTYPE html> <html lang="en" ng-app="app"> <head> <meta charset="UTF-8"> <title>Title</title> <!--用angular的方式创建客户端，先引用angular文档，也可以用Ajax的方式书写--> <script src="angular.min.js"></script> </head> <body ng-controller="controller"> <button ng-click="toRegister()">注册</button> <script src="app.js"></script> </body> </html>app.js文件：
angular.module("app",[]) .controller("controller",function ($scope,$http,$httpParamSerializerJQLike) { $scope.toRegister = function () { $http({ url:"http://localhost:3000/user/register", method:"POST", //$httpParamSerializerJQLike：将客户端数据序列化，如果使用Ajax书写序列化方法为serialize() //但是用户提交的的内容必须要在form表单中提交 data:$httpParamSerializerJQLike({ //写死的数据内容 username:"xiaoming", password:'123123', phone:'111' }), //请求头固定书写格式 headers:{ "content-type":"application/x-www-form-urlencoded" } //调用then方法检测结果 }).then(function (result) { console.log(result); //catch方法检测错误 }).catch(function (err) { console.log(err) }) }; });9、创建好客户端之后，运行服务端
10、在客户端点击注册打开F12出现注册好的数据类型
11、在结合上篇文章数据库相关操作中XAMPP的数据库中可以查看到客户端所提交的数据内容
ok了，简单的服务端和客户端的交互就完成了 拜拜！
