前后端交互——模拟QQ相册(连表查询判断数据)

代码示例：

1. 服务器文件

const Koa = require("koa");

const Router = require("koa-router");

const static = require("koa-static");

const fs = require("fs");

const koaBody = require("koa-body");

const mysql2 = require("mysql2");



let uName = "";



const connection = mysql2.createConnection({

    host: "localhost",

    user: "root",

    password: "123321",

    database: "js01",

    charset: "utf8"

});



let app = new Koa();

let router = new Router();



app.use(static(__dirname+"/static"));

app.use(koaBody({

    multipart:true

}))



router.get("/",ctx=>{

    ctx.body = "你好"

});

router.post("/checkUser",async ctx=>{

    // 获取到数据库数据，以完成后续的验证

    let sql = "SELECT * FROM qq_username";

    let [rows] = await connection.promise().query(sql);

    let qqUserName = rows;



    // 验证用户名和密码

    qqUserName.forEach(el => {

        if(el.username == ctx.request.body.username && el.password == ctx.request.body.pwd){

            uName = el.username;

            ctx.redirect("/photo.html");

        }

    });

    

    ctx.body = "密码错误";

});

router.get("/photo",async ctx=>{

    // 获取数据

    let imgArr = [];

    let sql = "SELECT u.username,p.imgurl,p.text FROM qq_username AS u LEFT JOIN qq_photo AS p ON u.username = p.username";

    let [rows] = await connection.promise().query(sql);



    // 连表查询符合用户名的图片

    rows.forEach(el=>{

        // 如果两个表的username相同，就把图片路径和文本添加到imgArr这个数组内

        if(el.username == uName){

            imgArr.push({

                url:el.imgurl,

                text:el.text

            });

        };

    });

    // 返回数据

    ctx.body =