03-axios常用的请求方法、axios错误处理

欢迎来到“雪碧聊技术”CSDN博客!

在这里,您将踏入一个专注于Java开发技术的知识殿堂。无论您是Java编程的初学者,还是具有一定经验的开发者,相信我的博客都能为您提供宝贵的学习资源和实用技巧。作为您的技术向导,我将不断探索Java的深邃世界,分享最新的技术动态、实战经验以及项目心得。

让我们一同在Java的广阔天地中遨游,携手提升技术能力,共创美好未来!感谢您的关注与支持,期待在“雪碧聊技术”与您共同成长!

目录

一、常用的请求方法有哪些?

1、什么是请求方法?

2、常用的请求方法有哪些?

①GET请求:获取数据

②POST请求:提交数据

③PUT请求:修改数据(全部)

④DELETE请求:删除数据

⑤PATCH请求:修改数据(部分)

3、axios请求配置

4、案例:注册账号

①需求分析

②编写代码

③运行效果

5、总结

二、axios错误处理

1、场景:再次注册相同的账号,会遇到报错信息,提示“账号被占用”

2、处理:用更直观的方式,给普通用户展示错误信息


一、常用的请求方法有哪些?

1、什么是请求方法?

        对服务器资源,要执行的操作。

2、常用的请求方法有哪些?

①GET请求:获取数据

②POST请求:提交数据

场景:当数据需要在服务器上保存。

③PUT请求:修改数据(全部)

④DELETE请求:删除数据

⑤PATCH请求:修改数据(部分)

以上五者,就是restful风格的请求。

3、axios请求配置

  • url:请求的url地址
  • method:请求的方法,如果不写method则默认为GET请求(不区分大小写)
  • data:提交的数据

举例:

4、案例:注册账号

①需求分析

②编写代码

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>05.常用请求方法和数据提交</title>
</head><body><button class="btn">注册用户</button><script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script><script>/*注册用户: http://hmajax.itheima.net/api/register请求方法: POST参数名:username: 用户名 (中英文和数字组成, 最少8位)password: 密码 (最少6位)目标: 点击按钮, 通过axios提交用户和密码, 完成注册*///1.给按钮绑定事件document.querySelector('.btn').addEventListener('click', ()=>{axios({url:'http://hmajax.itheima.net/api/register',//指定请求方法method:'post',//提交的数据data: {username:'casually678',password:'12345678'}}).then(result=>{//打印返回结果console.log(result)})})</script>
</body></html>

③运行效果

5、总结

注意:查询数据用params,提交数据用data,二者不可混用!

二、axios错误处理

1、场景:再次注册相同的账号,会遇到报错信息,提示“账号被占用”

        

2、处理:用更直观的方式,给普通用户展示错误信息

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>05.常用请求方法和数据提交</title>
</head><body><button class="btn">注册用户</button><script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script><script>/*注册用户: http://hmajax.itheima.net/api/register请求方法: POST参数名:username: 用户名 (中英文和数字组成, 最少8位)password: 密码 (最少6位)目标: 点击按钮, 通过axios提交用户和密码, 完成注册*///1.给按钮绑定事件document.querySelector('.btn').addEventListener('click', ()=>{axios({url:'http://hmajax.itheima.net/api/register',//指定请求方法method:'post',//提交的数据data: {username:'casually678',password:'12345678'}}).then(result=>{//打印返回结果console.log(result)}).catch(error=>{alert(error.response.data.message)})})</script>
</body></html>

运行效果:

以上就是axios的请求方法、错误处理的全部内容,想了解更多axios知识,请关注本博主~

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/472377.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

2002.6 Partitioning the UMLS semantic network.划分 UMLS 语义网络

Partitioning the UMLS semantic network | IEEE Journals & Magazine | IEEE Xplore 问题 统一医学语言系统&#xff08;UMLS&#xff09;语义网络中的语义类型&#xff08;ST&#xff09;在知识表示和应用中存在不足&#xff0c;例如 ST 的组织方式缺乏直观性和可解释性…

WSL与Ubuntu系统--使用Linux

WSL与Ubuntu系统--使用Linux 前言基础教学视频卸载链接网络配置方法1方法2 正式安装步骤步骤1 基本命令修改网络配置Ubuntu系统的导出与导入文件操作给Ubuntu创造界面--也就是在装一个有界面的UbuntuHyper-v与windows主机文件共享 前言 需要链接梯子&#xff0c;并且梯子十分稳…

ZooKeeper单机、集群模式搭建教程

单点配置 ZooKeeper在启动的时候&#xff0c;默认会读取/conf/zoo.cfg配置文件&#xff0c;该文件缺失会报错。因此&#xff0c;我们需要在将容器/conf/挂载出来&#xff0c;在制定的目录下&#xff0c;添加zoo.cfg文件。 zoo.cfg logback.xml 配置文件的信息可以从二进制包…

AlphaFold3中文使用说明

目录 1. 在线网站用例1. 使用json输入预测蛋白结构 2. 本地命令行2.1 运行示例2.2 AF3输入A&#xff09;指定输入B&#xff09;输入格式b&#xff09;JSON最外层结构b.1 序列多序列比对&#xff08;MSA&#xff09;结构模板&#xff08;templates&#xff09; b.2 共价键b.3 用…

vue2/vue3中使用的富文本编辑器vue-quill

前言&#xff1a; 整理下常用的富文本编辑器工具。 vue3: 实现效果&#xff1a; 实现步骤&#xff1a; 1、安装插件&#xff0c; 编辑器核心插件 vueup/vue-quill yarn add pnpm i npm i cnpm i vueup/vue-quill vueup/vue-quill 2、安装选择性插件 &a…

【星海随笔】ZooKeeper-Mesos

开源的由 Twitter 与 伯克利分校的 Mesos 项目组共同研发设计。 两极调度架构 支持高可用集群&#xff0c;通过ZooKeeper进行选举。 Mesos master 管理着所有的 Mesos slave 守护进程 每个slave运行具体的任务或者服务。 Franework 包括的调度器和执行机两部分 执行器运行在Me…

Spring Cloud Eureka 服务注册与发现

Spring Cloud Eureka 服务注册与发现 一、Eureka基础知识概述1.Eureka两个核心组件2.Eureka 服务注册与发现 二、Eureka单机搭建三、Eureka集群搭建四、心跳续约五、Eureka自我保护机制 一、Eureka基础知识概述 1.Eureka两个核心组件 Eureka Server &#xff1a;服务注册中心…

前后端分离练习(云客项目)

这几天学习了一点前端的开发&#xff0c;后面通过这个小项目来整理开发的过程&#xff0c;参考的是动力节点的动力云客这个项目&#xff0c;大家有兴趣可以去看一下视频&#xff0c;我更多的是学习了它的前端开发&#xff0c;后端我是用自己的方式来的&#xff0c;那么开始今天…

Spring boot + Vue2小项目基本模板

Spring boot Vue2小项目基本模板 基本介绍基本环境安装项目搭建最终效果展示 基本介绍 项目来源哔哩哔哩的青戈&#xff0c;跟着学习搭建自己的简单vue小项目&#xff1b;看别人的项目总觉得看不懂&#xff0c;需要慢慢打磨 这里目前只简单的搭建了菜单导航和表格页面&#x…

金融领域先锋!海云安成功入选2024年人工智能先锋案例集

近日&#xff0c;中国人工智能产业发展联盟《2024年人工智能先锋案例集》&#xff08;以下简称“AIIA先锋案例集”&#xff09;在中国人工智能产业发展联盟第十三次全体会议上正式发布。该案例集由人工智能产业发展联盟&#xff08;AIIA&#xff09;、工业和信息化部新闻宣传中…

基于OpenCV的图片人脸检测研究

目录 摘要 第一章 引言 第二章 基于 OpenCV 的图片人脸检测 2.1 实现原理 2.2 代码实现与分析 2.3 代码详细分析 第三章 实验结果与分析 第四章 OpenCV 人脸检测的优势与局限性 4.1 优势 4.2 局限性 第五章 结论 第六章 未来展望 参考文献 摘要 人脸检测是计算机视…

【计算机毕设】无查重 基于python豆瓣电影评论舆情数据可视化系统(完整系统源码+数据库+开发笔记+详细部署教程)✅

目录 【计算机毕设】无查重 基于python豆瓣电影数据可视化系统&#xff08;完整系统源码数据库开发笔记详细部署教程&#xff09;✅ 一、项目背景 二、项目目标 三、项目功能 四、开发技术介绍 五、数据库设计 六、项目展示 七、开发笔记 八、启动步骤文档 九、权威教…

Python学习从0到1 day29 Python 高阶技巧 ⑦ 正则表达式

目录 一、正则表达式 二、正则表达式的三个基础方法 1.match 从头匹配 2.search&#xff08;匹配规则&#xff0c;被匹配字符串&#xff09; 3.findall&#xff08;匹配规则&#xff0c;被匹配字符串&#xff09; 三、元字符匹配 单字符匹配&#xff1a; 注&#xff1a; 示例&a…

[Python学习日记-67] 封装

[Python学习日记-67] 封装 简介 如何隐藏类中的属性 封装并不是单纯意义的隐藏 封装与扩展性 特性&#xff08;property&#xff09; 简介 从封装本身的意思去理解&#xff0c;封装就好像是拿来一个麻袋&#xff0c;把小猫、小狗、小王八和小猪一起装进麻袋&#xff0c;然…

@Autowired 和 @Resource思考(注入redisTemplate时发现一些奇怪的现象)

1. 前置知识 Configuration public class RedisConfig {Beanpublic RedisTemplate<String, Object> redisTemplate(RedisConnectionFactory factory) {RedisTemplate<String, Object> template new RedisTemplate<>();template.setConnectionFactory(facto…

MongoDB分布式集群搭建----副本集----PSS/PSA

MongoDB分布式集群 Replication 复制、Replica Set 复制集/副本集 概念 一、 副本集的相关概念 1.概念 “ A replica set is a group of mongod instances that maintain the same data set. ” 一组MongoDB服务器&#xff08;多个mongod实例&#xff09;&#xff08;有不…

五、函数封装及调用、参数及返回值、作用域、匿名函数、立即执行函数

1. 函数基本使用 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>Document</title><style&…

数据分析-48-时间序列变点检测之在线实时数据的CPD

文章目录 1 时间序列结构1.1 变化点的定义1.2 结构变化的类型1.2.1 水平变化1.2.2 方差变化1.3 变点检测1.3.1 离线数据检测方法1.3.2 实时数据检测方法2 模拟数据2.1 模拟恒定方差数据2.2 模拟变化方差数据3 实时数据CPD3.1 SDAR学习算法3.2 Changefinder模块3.3 恒定方差CPD3…

第八节 如何结合AAA实现用户远程登录-路由基础

关于调试设备的登录方式&#xff0c;一共有三种&#xff1a; 第一个&#xff1a;console&#xff1a;需要工程师在现场&#xff0c;进行登录&#xff0c;设备开局的时候使用 第二个&#xff1a;telnet ssh&#xff1a;基于网络互通的前提下进行登录的&#xff0c;远程登录 第三…

【Conda】Windows下conda的安装并在终端运行

下载 在官网下载 https://www.anaconda.com/download/success 安装 双击 一直下一步安装 配置环境变量 为了在终端运行&#xff0c;需配置环境变量 进入到安装conda的目录并复制路径 设置高级环境变量 在终端运行 输入&#xff1a; conda list表明可以正常运行 参考…