1学习使用axios

一、axios介绍: 

axios 是一个基于 Promise 的 HTTP 客户端,用于浏览器和 Node.js。它提供了一种简单的方法来发送 HTTP 请求,并且具有很多实用的功能,使得网络请求变得更加方便和可靠。

以下是 axios 的一些主要特点和功能:

  1. 基于 Promiseaxios 的所有请求都返回一个 Promise 对象,这使得异步操作更加简单和直观。你可以使用 .then() 和 .catch() 方法来处理请求成功或失败的情况。
  2. 支持浏览器和 Node.js:无论你是在浏览器环境下还是 Node.js 环境下,都可以使用 axios 来发送 HTTP 请求。
  3. 支持请求和响应拦截:你可以使用拦截器在请求发送到服务器之前或响应返回到客户端之前对其进行修改或处理。
  4. 转换请求和响应数据:在请求发送到服务器之前或响应返回到客户端之前,你可以对请求或响应数据进行转换。
  5. 取消请求:使用 CancelToken,你可以取消一个还在进行的 HTTP 请求。
  6. 自动转换 JSON 数据:当 axios 收到一个包含 JSON 数据的响应时,它会自动将 JSON 数据转换为 JavaScript 对象。
  7. 客户端支持防止 CSRF/XSRFaxios 库默认支持 CSRF/XSRF 保护。

安装 axios 非常简单,你可以使用 npm 或 yarn 进行安装:

npm install axios
# 或者
yarn add axios

以下是一个简单的 axios 使用示例:

const axios = require('axios');
axios.get('https://api.example.com/data')
.then(function (response) {
// 处理响应数据
console.log(response.data);
})
.catch(function (error) {
// 处理错误
console.log(error);
});

总的来说,axios 是一个强大且灵活的 HTTP 客户端,提供了很多实用的功能,使得网络请求变得更加简单和可靠。

二、后端的简单搭建方式(铺垫知识):

在这里我用的vscode

1.首先我们在命令行中下载

安装Node.js: JSON Server 是一个基于 Node.js 的工具,所以首先需要确保你的计算机上已经安装了 Node.js。你可以从 Node.js 的官方网站 Node.js — Run JavaScript Everywhere 下载适合你操作系统的安装程序,并按照安装指南进行安装。

安装JSON Server: 安装完成 Node.js 后,你可以使用 npm (Node 包管理器) 来安装 JSON Server。打开命令行工具(如终端或命令提示符)并输入以下命令:

npm install -w json-server

创建JSON文件: 在你想要模拟的数据存储目录中创建一个 JSON 文件,比如 db.json。这个 JSON 文件将用来存储你模拟的 RESTful API 的数据。 

在vscode中创建一个db.json文件

[{"id": 1,"name": "Home","number": "555-1234"},{"id": 2,"name": "Office","number": "666-7890"}
]

接下来运行文件:

json-server db.json

成功创建

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

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

相关文章

【笔记】RDD算子操作(Spark基础知识)

持续更新中!!! 目录 一、RDD的创建 1.从本地创建 (1)本地文件 (2)hdfs文件(先提前创建目录并上传文件) 2.从集合创建(通过并行集合(列表&am…

学点Java_Day12_JDBC

1 JDBC 面向接口编程 在JDBC里面Java这个公司只是提供了一套接口Connection、Statement、ResultSet,每个数据库厂商实现了这套接口,例如MySql公司实现了:MySql驱动程序里面实现了这套接口,Java程序员只要调用实现了这些方法就可以…

如何调试Clang源码

下载编译Clang 这个就直接去LLVM官网下载,然后编译好Clang就行,注意得debug模式,保存符号信息。 调试Clang 可以直接通过命令行来调试 #进入调试环境,这里的clang得是刚刚编译好的 lldb ./clang # r是运行,后面是正…

电脑关机速度很慢怎么解决?

给电脑关机,总是要很久才完全关闭。这是因为计算机运行了太长时间,并且打开的程序太多,则关闭时间超过十秒钟,这是正常的现象。还有就是计算机升级或补丁程序更新也将导致计算机缓慢关闭。此时,建议耐心等待关闭完成。…

离心式风机运行效率测算

1.总压静压动压; 2.动压0.5空气体密度风速2; 风机所需功率P(KW):PQp/(36001000η0η1) Q—风量,m3/h; p—风机的全风压,Pa; η0—风机的内效率&a…

计算机网络-RIP动态路由协议简介

一、概述 前面我们学习了动态路由协议按照工作机制及算法划分可以分为:距离矢量路由协议DV型和链路状态路由协议LS型。RIP就是典型的距离矢量路由协议,但是实际工作中用得已经比较少了。 距离矢量路由协议DV: RIP 链路状态路由协议LS: OSPF IS-IS 二、RI…

深入Spark与LDA:大规模文本主题分析实战

使用LDA模型和Spark进行文本主题分析 本篇博客介绍了如何使用LDA(潜在狄利克雷分配)模型和Spark进行文本主题分析。我们的目标是从大量的用户评论中提取出主题。 1. 环境设置 首先,我们需要导入所需的库,包括jieba(…

Java八股文(JVM)

Java八股文のJVM JVM JVM 什么是Java虚拟机(JVM)? Java虚拟机是一个运行Java字节码的虚拟机。 它负责将Java程序翻译成机器代码并执行。 JVM的主要组成部分是什么? JVM包括以下组件: ● 类加载器(ClassLoa…

当当狸智能激光雕刻机 多种材质自由雕刻,轻松打造独一无二的作品

提及“激光雕刻”,大多数人的印象一般都是:笨重巨大、价格昂贵、操作复杂、使用门槛较高、调试难度大...不是普通人能够随意操作的,让人望尘莫及。 而小米有品上新的这台「当当狸桌面智能激光雕刻机L1」,将超乎你的想象&#xff…

JimuReport积木报表 v1.7.4 公测版本发布,免费的JAVA报表工具

项目介绍 一款免费的数据可视化报表,含报表和大屏设计,像搭建积木一样在线设计报表!功能涵盖,数据报表、打印设计、图表报表、大屏设计等! Web 版报表设计器,类似于excel操作风格,通过拖拽完成报…

【C语言基础】:数据在内存中的存储

文章目录 一、整数在内存中的存储二、大小端字节序和字节序判断1. 为什么有大小端?2. 练习 三、浮点数在内存中的存储1. 浮点数的存储1.1 浮点数的存储过程1.2 浮点数取的过程 四、题目解析 书山有路勤为径,学海无涯苦作舟。 创作不易,宝子们…

轻量级检测模型效果一定差?基于轻量级目标检测模型构建布匹瑕疵检测模型,对比分析不同分辨率图像尺度对模型效果的影响

瑕疵类的检测模型如:工业部件瑕疵、瓷砖瑕疵、PCB瑕疵、布匹瑕疵等等,在我们之前的博文中已经有过很多相关的开发实践了,这里就不再一一列举了,感兴趣的话可以直接搜索关键字信息博文内容即可一键直达。 因为本文的实验对象选择的…

structured bindings is supported from c++17

结构化绑定可以绑定结构体、数组和 tuple-like 对象。 完整示例&#xff1a; #include <iostream> #include <format> #include <iomanip>void test_00(){struct Box{int width_;int height_;std::string name_;};Box box{3,4,"amazing"};auto [w…

YOLOv9改进策略 | 损失函数篇 | InnerIoU、InnerMPDIoU二次创新损失函数助力小目标检测(全网独家首发)

一、本文介绍 本文给大家带来的改进机制是InnerIoU以及包含其它二次创新的代码InnerCIoU、InnerMPDIoU等一些列利用Inner形成的二次创新损失函数&#xff0c;到此大家可能比较模糊为啥Inner能够和其他损失函数形成二次创新&#xff0c;Inner又是一个什么样的机制&#xff0c;开…

【1】网络协议基础概念

【1】网络协议基础知识 1、互联网2、为什么要学习网络协议3、学习中需要搭建的环境4、客户端-服务器5、Java 的跨平台原理6、C/C的跨平台原理7、一个简单的SpringBoot项目(1) pom.xml(2) application.yml(3) NetworkStudyApp.java(4) SwaggerConfig.java(5) HelloWorldControll…

Git--08--Git分支合并操作

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 Git分支合并操作案例流程客户端&#xff1a;GitExtensions操作步骤&#xff1a;A操作步骤&#xff1a;B操作步骤&#xff1a;C操作步骤&#xff1a;D操作步骤&#…

Vue挂载全局方法

简介&#xff1a;有时候&#xff0c;频繁调用的函数&#xff0c;我们需要把它挂载在全局的vue原型上&#xff0c;方便调用&#xff0c;具体怎么操作&#xff0c;这里来记录一下。 一、这里以本地存储的方法为例 var localStorage window.localStorage; const db {/** * 更新…

LockSupport与线程中断机制

中断机制是个协商机制 Interrupt(): 将中断状态设置为true Interrupted():&#xff08;静态方法&#xff09; 1.返回当前线程的中断状态 2.将中断状态清零并设置为false is Interrupted(): 判断当前线程是否被中断 如何停止中断运行中的线程&#xff1f; 一个线程不应该由…

星光/宝骏/缤果/长安 车机CarPlay手机操作破解教程V2.0版本(无需笔记本、无需笔记本、无需笔记本)

之前写了个1.0版本&#xff0c;由于太局限&#xff0c;需要用到笔记本才能操作&#xff0c;很多车友反馈不方便。特此出个手机版教程&#xff0c;简单easy&#xff0c;妈妈再也不用担心我搞不定啦 一、准备工作 先卸载车机上的autokit 或者 智能互联 app&#xff0c;这步很关…

echarts 3D示例 echart, echarts-gl

echarts官网有很多的炫酷的3D模型 来尝试实现下&#xff0c;使用原本的柱状图或者折线图代码创建echarts示例,使用cdn的方式引入echarts <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8" /><meta name"viewp…