Bug 解决 | 前端无法正确请求后端接口并得到响应?

目录

1、配置问题

2、代码问题

3、网络问题


前端请求后端接口发现得到的响应不对,或者通过 f12 明明看到了后端的响应,但是前端页面无法正常的展示出来。

这种情况该怎么排查呢?这篇我们就来好好的理一理!

1、配置问题

1)跨域问题:这样会导致请求不正确,详情看我前面分享过的这篇文章:

Bug 解决 | 无法正常登录或获取不到用户信息https://blog.csdn.net/weixin_48916444/article/details/140838478?spm=1001.2014.3001.5501

2)SSL/HTTPS配置问题:如果项目使用了HTTPS,在配置不正确的情况下可能导致请求出现问题。确保SSL证书配置正确。

3)权限问题:确保前端项目有权访问后端接口,比如确认当前的账号是否有权限访问当前的接口?

2、代码问题

1)接口地址错误,确保前端项目中请求的后端接口地址是正确的,包括主机名、端口和路径等信息。

2)前端代码问题:比如前端没有等待后端数据返回就结束页面的渲染

举个例子,在用户列表页,按照标签搜索后,后端数据正常返回,但页面卡住,一直处于加载状态?

在图示位置加:loading="loading",并在下面定义一个变量const loading = ref(true);

在红线处加loading.value = false;

3)前后端交互的数据格式不匹配,前端发送请求时的数据格式与后端接收数据的格式不一致,导致解析失败。确保前后端约定的数据格式一致。

4)请求方法不正确:确保前端项目中使用的请求方法(GET、POST、PUT、DELETE等)与后端接口要求的方法相匹配。

3、网络问题

可能是由于网络问题导致前端无法连接到后端服务器。切换网络或者查看是否有代理等等。


**以上就是本次的学习分享,希望对大家有所帮助,****关注我!**日更 分享有用干货!!!

如果有疑问的可以评论提出来~

相关推荐
毕加锁3 分钟前
深度解析昇腾Catlass:C++模板元编程与高性能算子开发范式(1)
开发语言·c++
求梦8204 分钟前
【操作系统】第五章死锁
笔记
德思特7 分钟前
德思特产品 | 掌握波束之核:Vaunix可编程移相器与巴特勒矩阵如何定义下一代无线测试
经验分享
2501_9151063210 分钟前
iOS 上架费用解析,哪些成本可以通过流程优化降低。
android·ios·小程序·https·uni-app·iphone·webview
闲蛋小超人笑嘻嘻14 分钟前
localStorage用法详解
前端
Swift社区18 分钟前
用 RN 的渲染模型,反推 Vue 列表的正确拆分方式
前端·javascript·vue.js
Mr_chiu18 分钟前
微前端从入门到精通:Vue开发者的大型应用架构演进指南
前端·架构
鹿野素材屋21 分钟前
帧同步场景下的确定性随机数生成:基于时间戳的固定种子设计与实践
java·开发语言
Violet_YSWY22 分钟前
Vue-Pinia defineStore 语法结构
前端·javascript·vue.js
全栈陈序员22 分钟前
v-if 和 v-for 的优先级是什么?
前端·javascript·vue.js·学习·前端框架·ecmascript