加载按钮点击后返回的是404页面的html代码
来源:8-6 加载更多-返回数据

Bingyuan
2019-12-04
老师,我在做个人主页里面加载更多的功能时,遇到了一个BUG,始终没有调试出来。
问题的背景是这样的,当我刷新页面的时候,可以获得一个正常的包含blog第一页数据和【加载更多】按钮的页面。这应该能说明控制器中的getProfileBlogList
是能正确的获取到数据的。然而当我点击加载更多的时候,页面是没有变化的。我按下F12观察网络请求,发现控制台报错,提示Uncaught TypeError: Cannot read property 'pageIndex' of undefined
,这说明返回的数据可能有问题,无法将pageIndex解析出来,然后看响应,竟然是404页面。我看了您的视频里面,返回的是一个successModel。
我又返回程序,看终端的显示,终端显示的是--> GET /api/profile/loadMore/abc/1 200 5ms 2.32kb
,abc是用户名,1是下一页的index了,这说明点击后ajax找的路由也是正确的。然后诡异的事情发生了,我在/api/profile/loadMore/:userName/:pageIndex
路由下面打console做标记,发现打不出来,也就是说可能根本就没走这些个代码,就返回了404回去了。我看了路由的代码,是这样的:
router.prefix('api/profile');
router.get('/loadMore/:userName/:pageIndex', loginCheck, async (ctx, next) => {
let { userName, pageIndex } = ctx.params;
pageIndex = parseInt(pageIndex);
const result = await getProfileBlogList(userName, pageIndex);
console.log('result结果是', result);
result.data.blogListTpl = getBlogListStr(result.data.blogList);
ctx.body = result;
});
我寻思也没有错啊,怎么就返回404了。又回去看了app.js
中路由的注册,发现路由里面注册的位置在第二个,应该也不至于被404兜底的。然后我又直接用浏览器去访问这个localhost:3000/api/profile/loadMore/abc/1 发现返回的就是一个404页面,用postman访问这个API(特意去掉了loginCheck),还是404页面。自此,我断定应该就是路由寻址就出了问题了,但接下来我就不知道该怎么调试了,老师能否提供点建议?
1回答
-
双越
2019-12-04
你要把 console.log 写在路由函数的第一行,看是否能命中?
你现在是写在了第4行中,有可能因为前面的代码执行报错,而执行不到 console.log
032019-12-04
相似问题