前端发送Ajax请求的技术Axios

目录

1.引入Axios文件

2.使用Axios发送请求

2.1请求方法的别名

请求的URL地址怎么来的?

后端实现

前后端交互


1.引入Axios文件

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

2.使用Axios发送请求

2.1请求方法的别名

方法描述
axios.get(url [, config])发送get请求
axios.delete(url [, config])发送delete请求
axios.post(url [, data[, config]])发送post请求
axios.put(url [, data[, config]])发送put请求

 get请求:

axios.get("https://mock.apifox.cn/m1/3083103-0-default/emps/list").then(result => {console.log(result.data);
})

post请求:

axios.post("https://mock.apifox.cn/m1/3083103-0-default/emps/update","id=1").then(result => {console.log(result.data);
})

所有请求发出后不会立即执行then后面的代码,而是等服务器响应回来后执行。

请求的URL地址怎么来的?

是后端开发人员定义的API接口地址。

后端实现

后端开发人员会基于特定的技术栈(比如java,Node js,Python等)构建服务器

并在服务器上编写处理各种HTTP请求(GET,POST的)的代码逻辑。

当服务器收到GET||post请求时,调用相应的处理函数响应

前后端交互

前端通过Axios或其他HTTP客户端发送请求与到URL,并附带必要额查询参数(如姓名,性别,职位)。

服务端收到请求后就,解析这些参数,执行相应的数据库查询操作,最后将结果打包成JSON格式返回给前端。

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

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

相关文章

鸿蒙安装HAP时提示“code:9568344 error: install parse profile prop check error” 问题现象

在启动调试或运行应用/服务时&#xff0c;安装HAP出现错误&#xff0c;提示“error: install parse profile prop check error”错误信息。 解决措施 该问题可能是由于应用使用了应用特权&#xff0c;但应用的签名文件发生变化后未将新的签名指纹重新配置到设备的特权管控白名…

基于STM32的智能门锁安防系统(开源)

目录 项目演示 项目概述 硬件组成&#xff1a; 功能实现 1. 开锁模式 1.1 按键密码开锁 1.2 门禁卡开锁 1.3 指纹开锁 2. 功能备注 3. 硬件模块工作流程 3.1 步进电机控制 3.2 蜂鸣器提示 3.3 OLED显示 3.4 指纹与卡片管理 项目源代码分析 1. 主程序流程 (main…

html学习笔记(1)

一、什么是HTML HTML是HyperText Markup Language的缩写&#xff0c;即超文本标记语言&#xff0c;是一种用于创建网页的标准标记语言。以下是关于HTML的详细介绍&#xff1a; 基本概念 超文本&#xff1a;HTML中的“超文本”指的是网页中可以包含链接&#xff0c;这些链接…

JavaWeb开发(十五)实战-生鲜后台管理系统(二)注册、登录、记住密码

1. 生鲜后台管理系统-注册功能 1.1. 注册功能 &#xff08;1&#xff09;创建注册RegisterServlet&#xff0c;接收form表单中的参数。   &#xff08;2&#xff09;service创建一个userService处理业务逻辑。   &#xff08;3&#xff09;RegisterServlet将参数传递给ser…

【cuda学习日记】3.1 CUDA执行模型--线程束分化

3.1.1 将同用的function放到header文件里 ./common/common.h #define CHECK(call) \{\const cudaError_t error call; \if (error ! cudaSuccess)\{\printf("Error: %s: %d\n", __FILE__, __LINE__);\printf("code :%d reason :%s\n", error , cudaGetEr…

【STM32-学习笔记-15-】MAX7219点阵屏模块

文章目录 MAX7219点阵模块一、MAX7219Ⅰ、 概述Ⅱ、功能特点Ⅲ、引脚功能Ⅳ、典型应用电路Ⅴ、内部组成结构Ⅵ、时序图Ⅶ、寄存器 二、STM32控制点阵屏Ⅰ、程序框图Ⅱ、程序编写①、MAX7219.c②、MAX7219.h③、MAX7219_Img.h④、main.c MAX7219点阵模块 一、MAX7219 Ⅰ、 概述…

Redis数据库笔记——持久化机制

大家好&#xff0c;这里是Good Note&#xff0c;关注 公主号&#xff1a;Goodnote&#xff0c;专栏文章私信限时Free。本文详细介绍Redis的持久化机制&#xff0c;目标是将内存中的数据持久化到磁盘&#xff0c;以保证数据的可靠性和在重启后的恢复能力。 文章目录 持久化机制A…

K8S 集群搭建和访问 Kubernetes 仪表板(Dashboard)

一、环境准备 服务器要求&#xff1a; 最小硬件配置&#xff1a;2核CPU、4G内存、30G硬盘。 服务器可以访问外网。 软件环境&#xff1a; 操作系统&#xff1a;Anolis OS 7.9 Docker&#xff1a;19.03.9版本 Kubernetes&#xff1a;v1.18.0版本 内核版本&#xff1a;5.4.203-…

vue中echarts-中国地图,世界地图显示(echarts5.6版本本地导入)

地图去掉南海诸岛右下角的框显示&#xff08;因为显示的不是现在的10段线&#xff09; 资源里面主要是有个改好的中国地图json其他的无所谓&#xff0c;用现有的json也行&#xff0c;主要是为了解决10段线的问题 引入需要注意 import * as echarts from “./echarts”; 目录…

数据结构(三) 排序/并查集/图

目录 1. 排序 2.并查集 3.图 1.排序: 1.1 概念: 排序就是将数据按照某种规则进行排列, 具有某种顺序. 分为内排序和外排序. 内排序就是: 将数据放在内存中的排序; 外排序是: 数据太多无法在内存中排序的. 1.2 插入排序: 插入排序包含: 直接插入排序和希尔排序. (1) 直接插入…

算法随笔_13: 有效三角形的个数

上一篇:算法随笔_12:最短无序子数组-CSDN博客 题目描述如下: 给定一个包含非负整数的数组 nums &#xff0c;返回其中可以组成三角形三条边的三元组个数。 示例 1: 输入: nums [2,2,3,4] 输出: 3 解释:有效的组合是: 2,3,4 (使用第一个 2) 2,3,4 (使用第二个 2) 2,2,3 算法…

CSS 网络安全字体

适用于 HTML 和 CSS 的最佳 Web 安全字体 下面列出了适用于 HTM L和 CSS 的最佳 Web 安全字体&#xff1a; Arial (sans-serif)Verdana (sans-serif)Helvetica (sans-serif)Tahoma (sans-serif)Trebuchet MS (sans-serif)Times New Roman (serif)Georgia (serif)Garamond (se…

大模型学习笔记 - 第一期 - Milvus向量数据库

大模型学习笔记 - 向量数据库 目录 大模型学习笔记 - 向量数据库传统文字检索(无嵌入)面临的困境1. 用户和商户表述差异2. 不同语种的表述差异3. 不同背景下的音译表述差异 向量检索向量化服务 参考 传统文字检索(无嵌入)面临的困境 1. 用户和商户表述差异 ​ 如果商户维护了…

详细图文解读Transformer模型:《Attention is All You Need》完整版

目录 前言1、Transformer模型《Attention is All You Need》总结2、Transformer整体结构2.1、工作流程 3、Transformer的输入4、Self-Attention&#xff08;自注意力机制&#xff09;4.1、Self-Attention 结构4.2、Q, K, V计算4.3、Self-Attention 的输出4.4、Multi-Head Atten…

Hadoop•用Web UI查看Hadoop状态词频统计

听说这里是目录哦 通过Web UI查看Hadoop运行状态&#x1f407;一、关闭防火墙二、在物理计算机添加集群的IP映射三、启动集群四、进入HDFS的Web UI 词频统计&#x1f9a9;1、准备文本数据2、在HDFS创建目录3、上传文件4、查看文件是否上传成功5、运行MapReduce程序6、查看MapRe…

Ubuntu、Windows系统网络设置(ping通内外网)

一、 虚拟机VMware和Ubuntu系统的网络配置说明 1、虚拟机的网络适配器的模式有三种&#xff1a; 桥接模式NAT模式主机模式 2、虚拟机VMware的网卡配置(如何进行配置界面(虚拟机->设置)) 注意&#xff1a; 1、以上桥接模式(ubuntu有独立IP)、NAT模式(没有独立IP)都可以联…

将IDLE里面python环境pyqt5配置的vscode

首先安装pyqt5全套&#xff1a;pip install pyqt5-tools 打开Vscode&#xff1a; 安装第三方扩展&#xff1a;PYQT Integration 成功配置designer.exe的路径【个人安装pyqt5的执行路径】&#xff0c;便可直接打开UI文件&#xff0c;进行编辑。 配置pyuic,如果下图填写方法使用…

C# OpenCV机器视觉:特征匹配 “灵魂伴侣”

在一个阳光仿佛被施了魔法&#xff0c;欢快得直蹦跶的早晨&#xff0c;阿强像个即将踏上神秘寻宝之旅的探险家&#xff0c;一屁股墩在实验室那张堆满各种奇奇怪怪小玩意儿的桌前。桌上&#xff0c;零件、线路、半成品设备乱成一团&#xff0c;唯有他那宝贝电脑屏幕散发着清冷又…

简述mysql 主从复制原理及其工作过程,配置一主两从并验证

第一种基于binlog的主从同步 首先对主库进行配置&#xff1a; [rootopenEuler-1 ~]# vim /etc/my.cnf 启动服务 [rootopenEuler-1 ~]# systemctl enable --now mysqld 主库的配置 从库的配置 第一个从库 [rootopenEuler-1 ~]# vim /etc/my.cnf [rootopenEuler-1 ~]# sys…

Spring自定义BeanPostProcessor实现bean的代理Java动态代理知识

上文&#xff1a;https://blog.csdn.net/qq_26437925/article/details/145241149 中大致了解了spring aop的代理的实现&#xff0c;其实就是有个BeanPostProcessor代理了bean对象。顺便复习下java代理相关知识 目录 自定义BeanPostProcessor实现aopJava动态代理知识动态代理的几…