前端知识--前端访问后端技术Ajax及框架Axios

一、异步数据请求技术----Ajax

Ajax是前端访问后端的技术,为异步请求(不刷新页面,请求数据,只更新局部数据)。

例如:在京东网站中搜索电脑,就会出现一些联想搜索,但此时页面并没有刷新。

 异步通信,常用的两种途径:

1)联想搜索

2)表单校验

 

步骤3中的onreadystatechange可以监听服务器端数据,数据来了,即可响应。 

二、Axios框架:用于替代Ajax

原生的Ajax因繁琐,已经不怎么用了,目前,使用Axios框架,可以简化Ajax操作。 

使用Axios操作,分为两步。其中发送请求分为get和post两种。

url是访问后台服务器的地址 ;

then的括号中填写的是函数,如上写的是箭头函数,(result)=>{}   result是函数参数,该参数为对象,用于接收后台传递过来的所有数据。该对象中含有多项数据,我们只需要data数据,故使用result.data

then为回调函数,当服务器访问成功,并响应了数据,就会触发此函数,服务端没影响,该函数是不执行的。 

示例:

使用post方式,需要再添加 data ,“id=1”是根据实际条件填写的。

上述get、post方式还可以如下简化,一般使用如下的方式 

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

WEB开发-HTTP认证

1 需求 2 接口 3 示例 HTTP Authentication(HTTP认证)是Web服务器用来验证客户端请求的一种机制。它通常用于保护需要用户凭据(如用户名和密码)才能访问的资源。HTTP认证有几种不同的分类或方法,以下是其中一些主要的分…

手机怎么设置不同的ip地址

在数字化日益深入的今天,智能手机已成为我们生活、工作和学习中不可或缺的设备。然而,随着网络应用的广泛和深入,我们有时需要为手机设置不同的IP地址来满足特定需求。比如,避免网络限制、提高网络安全、或者进行网络测试等。本文…

解决R语言找不到系统库导致的报错

1、基本需知 1.1、系统库 系统库(System library)是一组预先编写和编译好的软件模块集合,用于支持操作系统的基本功能和提供一些常见的服务。这些库通常由操作系统或第三方开发者提供,并且在系统安装过程中被预装或者用户可以额…

分享 2 个 .NET EF 6 只更新某些字段的方法

前言 EF 更新数据时,通常情况下,是更新全部字段的,但实际业务中,更新全部字段的情况其实很少,一般都是修改其中某些字段,所以为了实现这个目标,很多程序员通常会这样作: 先从数据库…

数据治理之“财务一张表”

前言 信息技术的发展,伴随企业业务系统的纷纷建设,提升业务处理效率的同时,也将企业的整体主价值链流程分成了一段一段的业务子流程,很多情况下存在数据上报延迟、业务协作不顺畅、计划反馈不及时、库存积压占资多……都可以从数据…

力扣94题(java语言)

题目 思路 使用一个栈来模拟递归的过程,以非递归的方式完成中序遍历(使用栈可以避免递归调用的空间消耗)。 遍历顺序步骤: 遍历左子树访问根节点遍历右子树 package algorithm_leetcode;import java.util.ArrayList; import java.util.List; import…

VirtualBox 安装Centos 7 避坑指南 SSH连不上 镜像失效 静态网络配置等

背景 几乎每次安装Centos 7 时,都会遇到各种各样的问题,毕竟每次安装动辄就是半年几年,几乎都是在换工作时,有了新机器才会倒腾一次,时间久远,就会忘记一些细节,这次整理一下,避免以…

C语言 | Leetcode C语言题解之第275题H指数II

题目&#xff1a; 题解&#xff1a; int hIndex(int* citations, int citationsSize) {int left 0, right citationsSize - 1;while (left < right) {int mid left (right - left) / 2;if (citations[mid] > citationsSize - mid) {right mid - 1;} else {left mi…

Nacos 2.x 新增 grpc 端口,Nginx 需要配置TCP端口转发的注意事项

Nacos 2.x 开始&#xff0c;最大的变化就是端口。在默认主端口 8848 之外又新增了三个端口&#xff0c;新增端口是在配置的主端口 server.port 的基础上&#xff0c;进行一定偏移量自动生成。 8848&#xff08;主端口&#xff0c;默认8848&#xff09;web页面端口及相关http接口…

Spring Security认证授权介绍

一、目标 真正控制系统权限的&#xff0c;需要引入专门的安全框架才行&#xff0c;所以&#xff0c;我们今天重点来学习Spring家族中的一员Spring Security安全框架。最终呢&#xff0c;我们会使用Spring Security框架来控制养老项目的后台管理系统 能够熟悉常见的权限控制的方…

数据分析或处理中关于坐标系的一些事

通过对本文的阅读&#xff0c;你将获取坐标系的一些基础知识&#xff0c;以及学会如何使用pyproj实现地理数据的投影与转换。更重要的是&#xff0c;作为一个开发者&#xff0c;面对地理坐标系的图层数据&#xff0c;需要进行面积计算、距离量测、规则分块等需求时&#xff0c;…

IP 泄露: 原因与避免方法

始终关注您的IP信息&#xff01; 您的IP地址不仅显示您的位置&#xff0c;它包含几乎所有的互联网活动信息&#xff01; 如果出现IP泄漏&#xff0c;几乎所有的信息都会被捕获甚至非法利用&#xff01; 那么&#xff0c;网站究竟如何追踪您的IP地址&#xff1f;您又如何有效…

服务攻防-框架安全(漏洞复现)

关闭靶场 sudo docker-compose down 运行此靶场 sudo docker-compose up -d 查看启动环境 sudo docker ps 运行dockers容器 docker exec -it 64052abd288b /bin/bash thinkphp框架 thinkphp 2 - rce漏洞复现 docker exec -it 731dbae0e0b5 /bin/bash 集成化工具扫描 可以命令…

利用换元法计算积分的常见题型(考研高数复习)

考研中常见的几种换元法积分计算题 (1)被积式仅包含一个根式&#xff1a;根号下为有 a a a 和 x x x 的平方和/平方差 此种类型的积分题型&#xff0c;可以通过构造单个锐角大小为 t t t 的直角三角形&#xff0c;利用勾股定理和三角函数进行代换。 平方和的情况 形如 ∫…

sed利用脚本处理文件

一、sed是什么 sed 命令是利用脚本来处理文本文件。它可以依照脚本的指令来处理、编辑文本文件。主要用来自动编 辑一个或多个文件、简化对文件的反复操作、编写转换程序等。 二、sed的原理 读入新的一行内容到缓存空间&#xff1b; 从指定的操作指令中取出第一条指令&…

自定义协议(应用层协议)——网络版计算机基于TCP传输协议

应用层&#xff1a;自定义网络协议&#xff1a;序列化和反序列化&#xff0c;如果是TCP传输的&#xff1a;还要关心区分报文边界&#xff08;在序列化设计的时候设计好&#xff09;——粘包问题 1、首先想要使用TCP协议传输的网络&#xff0c;服务器和客户端都应该要创建自己…

力扣高频SQL 50题(基础版)第十七题

文章目录 力扣高频SQL 50题&#xff08;基础版&#xff09;第十七题1075. 项目员工 I题目说明思路分析实现过程准备数据实现方式结果截图 力扣高频SQL 50题&#xff08;基础版&#xff09;第十七题 1075. 项目员工 I 题目说明 项目表 Project&#xff1a; ----------------…

Hadoop、HDFS、MapReduce 大数据解决方案

本心、输入输出、结果 文章目录 Hadoop、HDFS、MapReduce 大数据解决方案前言HadoopHadoop 主要组件的Web UI端口和一些基本信息MapReduceMapReduce的核心思想MapReduce的工作流程MapReduce的优缺点Hadoop、HDFS、MapReduce 大数据解决方案 编辑 | 简简单单 Online zuozuo 地址…

建投数据人力资源系列产品获得欧拉操作系统及华为鲲鹏技术认证书

近日&#xff0c;经欧拉生态创新中心和华为技术有限公司测评&#xff0c;建投数据自主研发的人力资源管理系统、招聘管理系统、绩效管理系统、培训管理系统&#xff0c;完成了基于欧拉操作系统openEuler 22.03、华为鲲鹏Kunpeng 920&#xff08;Taisha 200&#xff09;的兼容性…

43 华三AC登录Web页面

一 无线上WEB页面 1 创建vlan 56 [AC-KongZhi]vlan 56 2 退出 [AC-KongZhi-vlan56]quit 3 进入vlan三层口 配置IP地址 [AC-KongZhi]interface Vlan-interface 56 [AC-KongZhi-Vlan-interface56]ip address 192.168.56.55 24 4 在AC控制器与Host主机的接口上能通关vlan 5…