javaScript客户端-服务端-数据库的一点点笔记

Node.js Client

基本用法

1.服务端配置

进入对应文件夹 打开终端

npm init    //初始化文件夹  全部回车

npm install express -save     //-save表示在当前文件创建 没加则全局添加

npm install express-ws -save    

npm install mysql;		

npm install body-parser //如果要用到post 则需要安装

在生成的package中的依赖中有以下则安装成功

“dependencies”: {
“body-parser”: “^1.19.0”,
“express”: “^4.17.1”,
“express-ws”: “^4.0.0”,
“mysql”: “^2.18.1”
}

1.1服务器收，发

let express =require("express"); //支持http短连接
let expressWS =require("express-ws"); // 导入系统包(express,express-ws)不用写路径。
const bodyParser = require("body-parser");
let app = express();		//短链接
expressWS(app);				//长链接
app.all('*', function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    next();
});		//解决跨域连接问题，所有连接都被允许

//get方法
app.get("/hello",(req,res)=>{	//在路径下定义一个方法
  console.log(req.query);//只会接收一次，事实上也只会在访问网址的时候传一次，所以只要接受一次
   
  //str = JSON.stringify(obj) 序列化 将JSON对象变成字符串
  //obj = JSON.parse(str) 反序列化 将字符串变成JSON对象

  //res.send方法 只能发一次给浏览器。不能写两个res.send();
  //在服务端没返回之前，客户端那里一直会转圈，是在等待服务端返回，一旦收到返回小希之后连接就会断开。
  res.send(JSON.stringify(req.query));
});

//post方法
this.app.use(bodyParser.urlencoded({ extended: false }));   //post提交设置
this.app.use(bodyParser.json());
this.app.post("/loginPost", (req, res) => {
    //req.body.xxx    xxx为post提交时设置的
     console.log("-------", JSON.parse(req.body.login));
});



//服务端的收，客户端 - 服务端 一直可以通话的接口 以connect为名
app.ws("/connect", (ws, req) => {
    console.log("连接成功");

    ws.on("message", (data) => {   //添加消息监听，当客户端发送消息，会自动调用函数
        onMessage(ws, JSON.parse(data));
        // console.log(data, "---------------收到客户端消息");
    });



    ws.on("close", () => {//客户端关闭时(正常退出/异常退出)，服务端都会调用
        console.log("处理掉线或者主动退出的玩家数据")
    })
})


app.listen(7714);	//	   定义访问服务端的路径/方法？传值 
// get请求传值方式  http://localhost:7714/hello?name=123&password=123456

1.2客户端发，收

(() => {
    class CNet {
        constructor() {
            this.loginURL = "http://localhost:7714/loginPost";
        }
        
         /**http请求   get请求
         * 一般有的参数列表
         * url：完整链接
         * data：传递的数据，没有时填入null
         * cb：服务器返回数据之后回调
         * isParse：是否对服务器返回数据进行JSON反序列化（解包）
         */
        httpGet(url, data, cb, isParse = true) {  //第四个参数的返回值为true
            let xhr = cc.loader.getXMLHttpRequest();//得到一个XMLHttpRequest实例。
            if (!data) {//请求时没有数据
                xhr.open("GET", url);
            } else {
                xhr.open("GET", url + "?data=" + JSON.stringify(data));
            }
            // xhr.onreadystatechange 是当连接状态改变的时候会调用
            xhr.onreadystatechange = () => {//听
                if (xhr.readyState == 4) {
                    if (xhr.status == 200) {
                        if (isParse) {
                            cb(JSON.parse(xhr.responseText));
                        } else {
                            cb(xhr.responseText);
                        }
                    } else {
                        // 重发
                    }
                }
            }
            xhr.send();
        }
        
  
        
        /**http请求     短链接 post请求
         * url：完整链接 ，我这里定义了一个this.loginURL，所以没传url
         * data：传递的数据，没有时填入null
         * cb：服务器返回数据之后回调函数
         * isParse：是否对服务器返回数据进行JSON反序列化（解包）
         */
        httpPost(body, cb, isParse = true) {
            let xhr = cc.loader.getXMLHttpRequest();//得到一个XMLHttpRequest实例。
            let url;
            xhr.timeout = 5000;
            if (body) {//+ JSON.stringify(data)
                body = "login=" + JSON.stringify(body);
            }
            xhr.open("POST", this.loginURL, true); //1,使用的HTTP方法， 2，请求的url, 3,异步吗？
            if (cc.sys.isNative) {
                xhr.setRequestHeader("Accept-Encoding", "gzip,deflate", "text/html;charset=UTF-8");
            }
            if (body) {
                xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
            }
            // xhr.onreadystatechange 是当连接状态改变的时候会调用
            xhr.onreadystatechange = () => {//听
                if (xhr.readyState === 4 && (xhr.status >= 200 && xhr.status < 300)) {
                    if (isParse) {
                        cb(JSON.parse(xhr.responseText));
                    } else {
                        cb(xhr.responseText);
                    }
                }
            }
            xhr.send(body);     //发送消息
        }


        //长链接 连接服务器
        doConnect(account) {
            this.app = new WebSocket("ws://localhost:7714/connect");
            this.app.onopen = () => {//当长链接完成时自动调用一次，只调用一次
                this.send({
                    key: g_Event.E_MAIN,
                    sub: 1,
                    data: {
                        account: account,
                    }
                });
            }
            //监听服务器消息
            this.app.onmessage = (event) => {
                this.onMessage(JSON.parse(event.data));
            }
            // 当长连接关闭时，仅调用一次   被服务器强制下线，服务器炸了。。
            this.app.onclose = () => {
                cc.director.loadScene("login", () => {
                    g_Tools.showTip("您的账号在其他地方登录", "hint");
                });
            };
        }
        //处理服务端发来的消息，根据key转发到对应脚本
        onMessage(data){
            g_Slot.emit(data.key,data);
        }
        //发送消息到服务端
        send(data) {
            if (this.app) {
                this.app.send(JSON.stringify(data));
            }
        }

    }

    window.g_Net = new CNet();
}) ()

2.服务端连接数据库

连接前注意事项

1. 是否安装mysql服务器
2. 是否配置环境变量 //测试：cmd打开一个端口， mysql -u root -p测试
3. 服务是否开启
4. mysql服务器的连接账号密码分别为root和123456

问题一：

​ Client does not support authentication protocol…

//MySQL8.0版本的加密方式和MySQL5.0的不一样，连接会报错。**
//解决方法如下：

1. 在任意地方通过命令行进入mysql。(配置了环境变量)
2. 登陆数据库
   `mysql -uroot -p`
3. 选择数据库
   `use mysql`;
4. 输入root的密码
   `Enter password: ******`
5. 更改加密方式
   `mysql> alter user 'root'@'localhost' identified with mysql_native_password by '123456';`
6. 刷新：
   `mysql> FLUSH PRIVILEGES;`

增删改查语句 详情

connection.query("sql语句"，数组，function（err,result）{});

//上一句代码中有三个参数，其中第一个是sql语句，就是对数据库的增删改查语句，嫌太长可以保存在变量中；

//第二个参数是前面sql语句中参数的值，如下：sql语句中的值用?代替，在后面的中括号中寻找答案。加问号，是一个预编译过程，反应速度更快，实际开发就写成问号那种形式。

//第三个函数是回调函数，在对数据库操作完后触发，它有两个参数。err用来监听操作是否有异常，而result表示本次对数据库操作返回的结果


//connection.end();

一定要关闭数据库，不然会耗cpu