【Python百日进阶-Web开发-Vue3】Day545 - Vue3 商城后台 05：登录axios请求

最新推荐文章于 2024-11-05 15:31:54 发布
最新推荐文章于 2024-11-05 15:31:54 发布
阅读量399 收藏
点赞数
分类专栏： 私用勿购 文章标签： 前端 javascript vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yuetaope/article/details/128834400
版权
本文介绍了在Vue3项目中使用axios进行API请求，包括axios的安装、创建实例、GET和POST请求的执行，以及如何处理请求拦截器和响应拦截器。在遇到跨域问题时，通过设置代理服务器和修改baseURL解决了问题，详细讲解了请求成功和失败的处理方式。
摘要由CSDN通过智能技术生成

文章目录

一、axios

项目api接口：http://dishaxy.dishait.cn/shopadminapi
在这里插入图片描述
axios中文官网：http://www.axios-js.com/zh-cn/
在这里插入图片描述

1.1 axios安装

yarn add axios

$ vite
info Direct dependencies
└─ axios@1.3
了解本专栏 订阅专栏 解锁全文 超级会员免费看
岳涛@心馨电脑
关注
专栏目录
订阅专栏
【Python百日进阶-Web开发-Vue3】Day547 - Vue3 商城后台 07：请求拦截器和响应拦截器
岳涛的博客
03-07 149
import service from './axios' // 定义管理员登录接口 export function login(username , password) {username , password }) } // 请求用户信息接口，要求的token信息在请求拦截器中自动添加了，这就不用传了 export function getInfo() {
【Python百日进阶-Web开发-Vue3】Day531 - Vue3后台系统 11：Echarts图表-饼图
岳涛的博客
02-27 256
/ 定义登录参数的接口 interface AdminLoginData {username : string password : string } // 定义登录返回值的data接口 interface AdminLoginResData {token : string tokenHead : string } // 定义登录返回值的接口 interface ManageResult < T = {} > {code?errno?
【Python百日进阶-Web开发-Vue3】Day521 - Vue3后台系统 01：项目构建
岳涛的博客
02-17 403
本项目参考B站的无私分享。
【Python百日进阶-Web开发-Vue3】Day523 - Vue3后台系统 03：登录跳转
岳涛的博客
02-19 306
assets文件夹下，新建styles文件夹，新建rebase.lessmargin : 0;border : 0;
【Python百日进阶-Web开发-Vue3】Day507 - Vue基础：代理解析
岳涛的博客
02-04 534
但是这样会有缺陷，如果你请求的资源本地就有，他会直接返回本地的数据，而不会向服务器发送请求，所以建议大家还是用前面的方式，虽然麻烦，但是可以配置多个代理，也不会出现资源直接从本地返回的情况。我们可以利用axios的二次封装，给所有的请求都添加上/api这个前缀（这个前缀是可以随意命名的）注意：如果在开发中，我们拿到的所有请求有共同的前缀，那么我们可以省略给所有接口统一加上。当然还有更加简洁的做法，让所有的请求都走代理，而并不去匹配请求的前缀。这个服务器发送请求。为头的请求都会走我上面配置的代理，向。
【Python百日进阶-Web开发-Vue3】Day522 - Vue3后台系统 02：登录，保存token
岳涛的博客
02-18 556
src文件夹下，新建request文件夹，新建request.ts文件。request文件夹下，新建api.ts文件。
【Python百日进阶-Web开发-Vue3】Day515 - Vue+ts后台项目2：登录页面
岳涛的博客
02-12 494
安装完插件，输入vb,选择vbase-3-ts-setup 快速生成 解决方案：src目录中，main.ts同级增加 shims-vue.d.ts文件，内容如下 上级目录（项目根目录）的tsconfig.json文件中include列表中增加一个元素 “src/*.ts”, 问题解决 1.4 主组件 App.vue 1.5 路由文件 router/index.ts 1.6 首页组件 views/HomeView.vue 1.7 登录组件 views/LoginView.vue 二、实现登录
【Python百日进阶-Web开发-Vue3】Day524 - Vue3后台系统 04：VueX保存用户信息
岳涛的博客
02-20 340
src文件夹下，新建store文件夹，新建index.ts文件。
【Python百日进阶-WEB开发】Day180 - Django案例：12用户登录
岳涛的博客
11-17 706
文章目录十、异步发送短信验证码 - 异步方案Celery10.1 生产者消费者设计模式10.2 Celery介绍10.3 Celery介绍和使用10.3.1十一、用户账号 登录11.1 用户登录11.1.1 用户登录逻辑分析11.1.2 用户登录接口设计和定义11.1.3 用户登录后端逻辑11.2 多账号登录11.2.1 自定义用户认证的后端，实现多账号登录11.2.2 开发环境配置文件dev.py11.2.3 前端login.html文件11.2.4 前端login.js文件11.3 首页用户名显示11.
【Python百日进阶-Web开发-Vue3】Day548 - Vue3 商城后台 08：loading加载状态和toast消息提示框封装
岳涛的博客
03-08 206
【代码】【Python百日进阶-Web开发-Vue3】Day548 - Vue3 商城后台 08：loading加载状态和toast消息提示框封装。
Webserver(3.3)生产者消费者模型
最新发布
学习历程记录和分享
11-05 233
解决该问题需要用互斥量确保线程同步，用条件变量或者信号量去解决生产者和消费者之间同步的问题，生产者把数据生产满了要通知消费者去消费。会产生数据安全问题，比如生产者还未生产出来，就去消费。
做一个能适配「手机」的网站需要注意什么
illidri的博客
11-01 310
像现在主流会采用 H5 响应式布局，仅涉及前端的开发工作，代码量少，效果佳，是一种性价比比较高的选择，如果题主有意要进行网站建站，特别是想要手机浏览也有一定效果，可以选择这种~当然还有一种类似的方式叫自适应布局，俗称 AWD（AdaptiveWebDesign），同样是检测视口分辨率，判断不同尺寸和分辨率是什么设备，从而返回不同布局页面。最根本的区别在于，响应式页面的代码量少，但质量要求高，根据不同分辨率自动调整排版，而自适应页面需要根据不同设备准备不同的页面，这样前期的开发工作就大了很多。
vxe-grid ，增加新行，并且定位到新增的行
花花鱼的专栏
11-05 134
vxe-grid新增空行，并且定位到空行位置。
前端react常见面试题目（basic)
警警的博客
11-02 974
react常见面试题目（basic)
前端 常见开发工具使用
weixin_45534301的博客
10-31 504
【代码】前端 常见开发工具使用。
keep-alive - 2024最新版前端秋招面试短期突击面试题【100道】
everfoot的博客
11-05 314
是 Vue.js 中非常有用的一个组件，特别适用于需要频繁切换的组件场景。通过缓存组件状态，它帮助开发者在提升性能的同时，保持良好的用户体验。在面试中能够清晰地解释keep-alive的使用场景和实现细节，将为你加分不少！希望这些知识能帮助你顺利应对相关问题，成功上岸！
Webserver(2.8)守护进程
学习历程记录和分享
11-04 212
每隔2s获取系统时间，将这个时间写入到磁盘文件中。
若依项目中vue处理字典和后端处理的方法汇总
SSHLY3的博客
10-31 462
但注意使用场景是数据仅拿来做页面展示，如若是修改页面调此接口就不适合。
Vue学习笔记(十五)
₍˄·͈༝·͈˄*₎◞ ̑̑的博客
11-01 1000
reactive+ref的创建与对比+toRefs+toRef+computed+watch的5种类型监视
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

岳涛@心馨电脑

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值