当前位置: 首页 > news >正文

前端发送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格式返回给前端。

相关文章:

前端发送Ajax请求的技术Axios

目录 1.引入Axios文件 2.使用Axios发送请求 2.1请求方法的别名 请求的URL地址怎么来的&#xff1f; 后端实现 前后端交互 1.引入Axios文件 <script src"https://unpkg.com/axios/dist/axios.min.js"></script> 2.使用Axios发送请求 2.1请求方法的…...

第17章:Python TDD回顾与总结货币类开发

写在前面 这本书是我们老板推荐过的&#xff0c;我在《价值心法》的推荐书单里也看到了它。用了一段时间 Cursor 软件后&#xff0c;我突然思考&#xff0c;对于测试开发工程师来说&#xff0c;什么才更有价值呢&#xff1f;如何让 AI 工具更好地辅助自己写代码&#xff0c;或许…...

opencv_KDTree_搜索介绍及示例

cv::flann::KDTreeIndexParams 说明&#xff0c;使用&#xff1f; cv::flann::KDTreeIndexParams 是 OpenCV 中用于配置 KD 树&#xff08;K-Dimensional Tree&#xff09;索引参数的类。KD 树是一种用于多维空间中的点搜索的数据结构&#xff0c;常用于最近邻搜索等问题。在…...

Windows 上安装 MongoDB 的 zip 包

博主介绍&#xff1a; 大家好&#xff0c;我是想成为Super的Yuperman&#xff0c;互联网宇宙厂经验&#xff0c;17年医疗健康行业的码拉松奔跑者&#xff0c;曾担任技术专家、架构师、研发总监负责和主导多个应用架构。 近期专注&#xff1a; RPA应用研究&#xff0c;主流厂商产…...

先进制造aps专题二十七 西门子opcenter aps架构分析

欧美的商业aps&#xff0c;主要就是sap apo,西门子opcenter aps,达索quintiq 从技术的层面&#xff0c;西门子aps是不如sap apo的&#xff0c;但是西门子aps是西门子数字化工厂产品的核心&#xff0c;有很多特色&#xff0c;所以分析 西门子aps主要分计划器和排产器两个部分 计…...

【数据分享】1929-2024年全球站点的逐年平均气温数据(Shp\Excel\无需转发)

气象数据是在各项研究中都经常使用的数据&#xff0c;气象指标包括气温、风速、降水、湿度等指标&#xff0c;其中又以气温指标最为常用&#xff01;说到气温数据&#xff0c;最详细的气温数据是具体到气象监测站点的气温数据&#xff01;本次我们为大家带来的就是具体到气象监…...

机器学习——什么是代价函数?

1.代价函数的定义 首先,提到代价函数是估计值和实际值的差,这应该是指预测值和真实值之间的差异,用来衡量模型的好坏。 在一元线性模型中,模型是直线,有两个参数,可能是斜率和截距。 通过调整这两个参数,让代价函数最小,这应该是说我们要找到最佳的斜率和截距,使得预测…...

docker 部署 MantisBT

1. docker 安装MantisBT docker pull vimagick/mantisbt:latest 2.先运行实例&#xff0c;复制配置文件 docker run -p 8084:80 --name mantisbt -d vimagick/mantisbt:latest 3. 复制所需要配置文件到本地路径 docker cp mantisbt:/var/www/html/config/config_inc.php.…...

02内存结构篇(D1_自动内存管理)

目录 一、内存管理 1. C/C程序员 2. Java程序员 二、运行时数据区 1. 程序计数器 2. Java虚拟机栈 3. 本地方法栈 4. Java堆 5. 方法区 运行时常量池 三、Hotspot运行时数据区 四、分配JVM内存空间 分配堆的大小 分配方法区的大小 分配线程空间的大小 一、内存管…...

Centos 8 交换空间管理

新增swap 要增加 Linux 系统的交换空间&#xff0c;可以按照以下步骤操作&#xff1a; 1. 创建一个交换文件 首先&#xff0c;选择文件路径和大小&#xff08;例如&#xff0c;增加 1 GB 交换空间&#xff09;。 sudo fallocate -l 1G /swapfile如果 fallocate 不可用&…...

“深入浅出”系列之数通篇:(5)TCP的三次握手和四次挥手

TCP&#xff08;传输控制协议&#xff09;的三次握手和四次挥手是TCP连接建立和释放的过程。 一、TCP三次握手 TCP三次握手是为了建立可靠的连接&#xff0c;确保客户端和服务器之间的通信能力。具体过程如下&#xff1a; 第一次握手&#xff1a;客户端向服务器发送一个带有…...

接口测试及接口测试常用的工具

&#x1f345; 点击文末小卡片&#xff0c;免费获取软件测试全套资料&#xff0c;资料在手&#xff0c;涨薪更快 首先&#xff0c;什么是接口呢&#xff1f; 接口一般来说有两种&#xff0c;一种是程序内部的接口&#xff0c;一种是系统对外的接口。 系统对外的接口&#xff…...

使用rpc绕过咸鱼sign校验

案例网站是咸鱼 找到加密函数i()&#xff0c;发现参数是由token时间戳appkeydata构成的 js客户端服务 考虑到网站可能有判断时间戳长短而让请求包失效的可能&#xff0c;我们请求包就直接用它的方法生成 下面我们先把token和h置为键值对tjh123 再把方法i()设为全局变量my_…...

NPC与AI深度融合结合雷鸟X3Pro AR智能眼镜:引领游戏行业沉浸式与增强现实新纪元的畅想

if… NPC&#xff08;非玩家角色&#xff09;与AI&#xff08;人工智能&#xff09;的深度融合&#xff0c;正引领游戏行业迈向一个全新的沉浸式与增强现实&#xff08;AR&#xff09;相结合的新时代。这一创新不仅预示着游戏体验的质变&#xff0c;更可能全面革新游戏设计与叙…...

【物联网】ARM核介绍

文章目录 一、芯片产业链1. CPU核(1)ARM(2)MIPS(3)PowerPc(4)Intel(5)RISC-V 2. SOC芯片(1)主流厂家(2)产品解决方案 3. 产品 二、ARM核发展1. 不同架构的特点分析(1)VFP(2)Jazelle(3)Thumb(4)TrustZone(5)SIMD(6)NEON 三、ARM核(ARMv7)工作模式1. 权限级别(privilege level)2.…...

Android系统定制APP开发_如何对应用进行系统签名

前言 当项目开发需要使用系统级别权限或frame层某些api时&#xff0c;普通应用是无法使用的&#xff0c;需要在AndroidManifest中配置sharedUserId&#xff1a; AndroidManifest.xml中的android:sharedUserId“android.uid.system”&#xff0c;代表的意思是和系统相同的uid&a…...

Tesla Free-Fall Attack:特斯拉汽车网络安全事件纪要

Tesla Free-Fall Attack&#xff1a;特斯拉汽车网络安全事件纪要 1. 引言 Tesla Free-Fall Attack 是由腾讯科恩实验室&#xff08;Tencent Keen Security Lab&#xff09;于2016年9月对特斯拉Model S汽车实施的一次远程攻击事件&#xff0c;揭示了汽车网络安全的严重漏洞&am…...

网络安全工程师学习路线

https://www.processon.com/view/link/6584f06465b7eb6189e99508 1、HTML基本语言 常用标签、表单、上传页面、登录页面、超链接2、javascript基本语法 变量、函数、流程控制语法、post请求、ajax请求、输入数据到页面、文件上传3、mysql基本用法 增删改查 infromation_sch…...

分区和分表有什么区别?

数据库中数据量过多&#xff0c;表太大的时候&#xff0c;不仅可以做分库分表&#xff0c;还可以做表分区&#xff0c;分区和分表类似&#xff0c;都是按照一定的规则将一张大表进行分解。 听上去好像也差不多&#xff0c;不就是将表拆分吗&#xff1f;那具体有什么差别呢&…...

C#,入门教程(01)—— Visual Studio 2022 免费安装的详细图文与动画教程

通过本课程的学习&#xff0c;你可以掌握C#编程的重点&#xff0c;享受编程的乐趣。 在本课程之前&#xff0c;你无需具备任何C#的基础知识&#xff0c;只要能操作电脑即可。 不过&#xff0c;希望你的数学不是体育老师教的。好的程序是数理化的实现与模拟。没有较好的数学基础…...

边缘计算医疗风险自查APP开发方案

核心目标:在便携设备(智能手表/家用检测仪)部署轻量化疾病预测模型,实现低延迟、隐私安全的实时健康风险评估。 一、技术架构设计 #mermaid-svg-iuNaeeLK2YoFKfao {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg…...

在HarmonyOS ArkTS ArkUI-X 5.0及以上版本中,手势开发全攻略:

在 HarmonyOS 应用开发中&#xff0c;手势交互是连接用户与设备的核心纽带。ArkTS 框架提供了丰富的手势处理能力&#xff0c;既支持点击、长按、拖拽等基础单一手势的精细控制&#xff0c;也能通过多种绑定策略解决父子组件的手势竞争问题。本文将结合官方开发文档&#xff0c…...

Vue3 + Element Plus + TypeScript中el-transfer穿梭框组件使用详解及示例

使用详解 Element Plus 的 el-transfer 组件是一个强大的穿梭框组件&#xff0c;常用于在两个集合之间进行数据转移&#xff0c;如权限分配、数据选择等场景。下面我将详细介绍其用法并提供一个完整示例。 核心特性与用法 基本属性 v-model&#xff1a;绑定右侧列表的值&…...

大数据零基础学习day1之环境准备和大数据初步理解

学习大数据会使用到多台Linux服务器。 一、环境准备 1、VMware 基于VMware构建Linux虚拟机 是大数据从业者或者IT从业者的必备技能之一也是成本低廉的方案 所以VMware虚拟机方案是必须要学习的。 &#xff08;1&#xff09;设置网关 打开VMware虚拟机&#xff0c;点击编辑…...

376. Wiggle Subsequence

376. Wiggle Subsequence 代码 class Solution { public:int wiggleMaxLength(vector<int>& nums) {int n nums.size();int res 1;int prediff 0;int curdiff 0;for(int i 0;i < n-1;i){curdiff nums[i1] - nums[i];if( (prediff > 0 && curdif…...

Vue2 第一节_Vue2上手_插值表达式{{}}_访问数据和修改数据_Vue开发者工具

文章目录 1.Vue2上手-如何创建一个Vue实例,进行初始化渲染2. 插值表达式{{}}3. 访问数据和修改数据4. vue响应式5. Vue开发者工具--方便调试 1.Vue2上手-如何创建一个Vue实例,进行初始化渲染 准备容器引包创建Vue实例 new Vue()指定配置项 ->渲染数据 准备一个容器,例如: …...

SpringBoot+uniapp 的 Champion 俱乐部微信小程序设计与实现,论文初版实现

摘要 本论文旨在设计并实现基于 SpringBoot 和 uniapp 的 Champion 俱乐部微信小程序&#xff0c;以满足俱乐部线上活动推广、会员管理、社交互动等需求。通过 SpringBoot 搭建后端服务&#xff0c;提供稳定高效的数据处理与业务逻辑支持&#xff1b;利用 uniapp 实现跨平台前…...

Unit 1 深度强化学习简介

Deep RL Course ——Unit 1 Introduction 从理论和实践层面深入学习深度强化学习。学会使用知名的深度强化学习库&#xff0c;例如 Stable Baselines3、RL Baselines3 Zoo、Sample Factory 和 CleanRL。在独特的环境中训练智能体&#xff0c;比如 SnowballFight、Huggy the Do…...

回溯算法学习

一、电话号码的字母组合 import java.util.ArrayList; import java.util.List;import javax.management.loading.PrivateClassLoader;public class letterCombinations {private static final String[] KEYPAD {"", //0"", //1"abc", //2"…...

C#中的CLR属性、依赖属性与附加属性

CLR属性的主要特征 封装性&#xff1a; 隐藏字段的实现细节 提供对字段的受控访问 访问控制&#xff1a; 可单独设置get/set访问器的可见性 可创建只读或只写属性 计算属性&#xff1a; 可以在getter中执行计算逻辑 不需要直接对应一个字段 验证逻辑&#xff1a; 可以…...