页面加载不出博客列表

Question

环境

node v15.14.0

直接问题

输入url后chrome页面加载不出数据，并且控制台有报错

network显示如下信息

问题分析：

1、数据库连接正常，查询语句没有问题，在mysql.js的exec函数中打印result可以正常显示

function exec(sql) {
    const promise = new Promise((resolve, reject) => {
        con.query(sql, (err, result) => {
            if (err) {
                reject(err)
                return
            }
            console.log(result)
            resolve(result)
        })
    })
    return promise
}

2、推测可能是由于promise异步加载带来的问题？
在router/blog.js中打印getList的结果，终端一直提示pending

 const result = getList(author, keyword)
 console.log('router', result)
 result.then(listData => {
     return new SuccessModel(listData)
 })

以下为相关代码

app.js

 //  处理 blog 路由
 const blogResult = handleBlogRouter(req, res)
 // console.log('blogResult', blogResult)
 if(blogResult) {
     blogResult.then(blogData => {
         res.end(
             JSON.stringify(blogData)
         )
     })
     return
 }

src/router/blog.js

// 获取博客列表
 if(method === 'GET' && path === '/api/blog/list') {
     const author = req.query.author || ''
     const keyword = req.query.keyword || ''
     // const listData = getList(author, keyword)
     // return new SuccessModel(listData)

     // 处理promise
     const result = getList(author, keyword)
     console.log('router', result)
     result.then(listData => {
         return new SuccessModel(listData)
     })
 }

src/controller/blog.js

const getList = (author, keyword) => {
    let sql = `select * from blogs where 1=1 `
    if (author) {
        sql += `and author='${author}' `
    }
    if (keyword) {
        sql += `and title like '%${keyword}%' `
    }
    sql += `order by createtime desc;`

    // 返回 promise
    return exec(sql)
}

src/db/mysql.js

// 统一执行 sql 的函数
function exec(sql) {
    const promise = new Promise((resolve, reject) => {
        con.query(sql, (err, result) => {
            if (err) {
                reject(err)
                return
            }
            resolve(result)
        })
    })
    return promise
}

Answer 1

双越 2021-07-05 17:10:11

最关键的信息在这里，你再截个图给我吧

• 提问者 大暖同学 #1

  回复放不了图片，我把截图放在回答里啦，感谢双老师

Answer 2

双越 2021-07-06 08:16:31

感觉这里少一个 return ，你加上试试。

• 提问者 大暖同学 #1

  果然是！谢谢老师！

Answer 3

提问者 大暖同学 2021-07-05 22:44:20

又又老师，我还是没有解决问题

感觉这个问题很奇怪，在handleBlogRouter函数里面是可以返回博客列表的

打印信息如下

但是app.js调用这个函数就没有返回值

打印信息如下

所以一开始才会直接执行到res.end(...)

Answer 4

提问者 大暖同学 2021-07-05 20:51:51

这是headers的截图

• 双越 #1

  这个接口返回 404 ，检查一下代码，是不是正常直行到了 res.end(...) ？

• 提问者 大暖同学 回复 双越 #2

  是的TAT，我还是没有解决，麻烦您看下我的新回答

• weixin_慕盖茨3412677 #3

  请问你解决了吗，我跟你的问题一模一样

点开查看后面1条评论