首页 前端知识 [YM]课设-C#-WebApi-Vue-员工管理系统 (六)前后端交互

[YM]课设-C#-WebApi-Vue-员工管理系统 (六)前后端交互

2024-09-29 22:09:23 前端知识 前端哥 252 175 我要收藏

Http状态码:

终于也是到了前端

上文提到http状态码

这里详细说一下

1xx    表示临时响应并需要请求者继续执行操作
2xx    成功,操作被成功接收并处理
3xx    表示要完成请求,需要进一步操作。 通常,这些状态代码用来重定向
4xx    客户端错误,请求包含语法错误或无法完成请求
5xx    这些状态代码表示服务器在尝试处理请求时发生内部错误。 这些错误可能是服务器本身的错误,而不是请求出错

通常出现并且掌握的状态码:

200:成功,服务器已经成功处理了请求。

400: 错误请求,服务器不理解请求的语法。

401:未授权,请求要求身份验证。 对于需要登录的网页,服务器可能返回此响应。

404:找不到,服务器没找到请求的网页

状态码只是反应当前http的状态

一个状态出现的错误又是不同的

应该对症下药

前期准备:

文件:

将前端文件准备好

[YM]课设-C#-WebApi-Vue-员工管理系统-前端文件-CSDN博客

此项目是前后端分离

文件规范一下

 用vscode打开前后端

Node.JS:

使用npm启动前端

下载地址:下载 | Node.js 中文网

下载对应系统的安装包

这边以windows为例

点击next

唯一配置的就是可以改一下安装路径

直接下载即可

下载完毕用cmd验证一下

Win+R打开cmd

下载成功 

前后端交互:

先将后端启动

记住现在的后端端口号

打开前端

找到最下面的vue.config.js文件

下拉到devServer中的proxy

target设置为自己的后端端口号

我这边启动的后端端口号是5299

target设置为5299即可

其他博主已经调好了

点击npm运行

这里前端启动需要一些时间

静静等待即可

启动之后自动会跳转到网页

OHOHHHHHH! 

前端直接弹出

这边方便调试,前端设置了一个默认的账号

直接登录

进入到首页

看一下后端的日志

显示到通过username和password检验成功登录

我们打开其他页面进行测试一下

注意小BUG:

这个分页查询与前端交互有点小BUG,博主已经修改了前面的章节

原因:前后端传递参数时变量名不一致

主要修改:

将原本currentPage改为page变量名

这样我们就能够获取其他页的信息了

哦?

这个页面的接口后端还没有写

下节学习一下这个统计表前端以及后端接口

———————————

持续更新中...

关注[YM]课设专栏[YM]课设_夜喵YM的博客-CSDN博客

文章:

[YM]课设-C#-WebApi-Vue-员工管理系统 (前言)-CSDN博客

[YM]课设-C#-WebApi-Vue-员工管理系统 (一)创建webapi项目-CSDN博客

[YM]课设-C#-WebApi-Vue-员工管理系统 Api接口文档&SQL脚本-CSDN博客

[YM]课设-C#-WebApi-Vue-员工管理系统 (二)连接数据库-CSDN博客

[YM]课设-C#-WebApi-Vue-员工管理系统 (三)部门管理-CSDN博客

[YM]课设-C#-WebApi-Vue-员工管理系统 (四)员工管理-条件分页查询-CSDN博客

[YM]课设-C#-WebApi-Vue-员工管理系统 (五)登录-CSDN博客

[YM]课设-C#-WebApi-Vue-员工管理系统-前端文件-CSDN博客

转载请注明出处或者链接地址:https://www.qianduange.cn//article/18777.html
标签
评论
发布的文章

jQuery QueryBuilder 教程

2024-10-29 23:10:44

水球图 及各种参数设置

2024-10-29 23:10:13

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!