AJAX

最新推荐文章于 2023-03-07 15:15:06 发布
最新推荐文章于 2023-03-07 15:15:06 发布
阅读量239 收藏
点赞数
分类专栏： AJAX 文章标签： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/DingDing_Zhang/article/details/107699967
版权

1.对象

// 实例化构造函数创建对象
var obj = new Object();
obj.name = '张三';      // 添加属性
obj.age = 18;
// 字面量创建对象
var obj = {
    name: '张三',
    age: 18
};
// 通过.访问成员变量
console.log(obj.name);          // 张三
// 通过[]访问成员变量
console.log(obj['name']);       // 张三

.和[]的最大区别是[]支持传入参数，访问不确定的属性值

obj.属性名 = 属性值 -> 属性名不可以修改

obj[‘属性名’] = ‘属性值’ -> [] 里面可以放变量

2.JSON

JSON(JavaScript Object Notation, JS对象简谱)是一种轻量级的数据交换格式。它基于ECMAScript(欧洲计算机协会制定的js规范)的一个子集，采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得JSON成为理想的数据交换语言

JSON是一个序列化的对象或数组

JSON.stringify

该方法可以将一个JS对象序列化为一个JSON字符串

var data = {
    name: '张三',
    age: 18
}
JSON.stringify(data);       // '{"name":"张三","age":18}'
JSON.parse

该方法可以将一个序列化的JSON字符串转换为一个JS对象

var str = '{"name":"张三","age":18}';
JSON.parse(str);     // {name:"张三",age:18}

3.计算机基础知识

进程和线程
  • 进程：是具有一定独立功能的程序关于某个数据集合上的一次进行活动，是系统进行资源分配和调度的一个独立单位
  • 线程：是进程的一个实体，是cpu调度和分派的基本单位，他是比进程更小的能够独立运行的基本单位，线程自己基本上不拥有系统资源，只拥有一点在运行中必不可少的资源。一个线程可以创建和撤销另一个线程
  • 一个进程里面至少有一个线程

JS是单线程语言，JS的单线程与它的用途有关。作为浏览器脚本语言，JavaScript的主要用途是与用户互动，以及操作DOM。这决定了它只能是单线程，否则会带来很复杂的同步问题。比如，假定JavaScript同时有两个线程，一个线程在某个DOM节点上添加内容，另一个线程删除了这个节点，这时浏览器应该以哪个线程为准？所以，为了避免复杂性，从一诞生，JavaScript就是单线程，这已经成这门语言的核心特征，将来也不会改变（所谓单线程，是指在JS引擎中负责解释和执行JavaScript代码的线程只有一个）

同步和异步
同步

上一件事情没有完成，继续处理上一件事情，只有上一件事情完成了，才会做下一件事情，事件一个一个完成

异步

规划要做一件事情，但是不是当前立马去执行这件事情，需要等一定的时间，这样的话，我们不会等着他执行，而是继续执行下面的操作，事件同时开始，不等待完成

端口

端口是英文port的意译，可以认为是设备与外界通讯交流的出口。端口可分为虚拟端口和物理端口，其中虚拟端口指计算机内部或交换机路由器内的端口，不可见。例如计算机中的80端口、21端口、23端口等。物理端口又称为接口，是可见端口，计算机背板的RJ45网口，交换机路由器集线器等RJ45端口。电话使用RJ11插口也属于物理端口的范畴

端口分类
  • 公认端口（Well Known Ports）：从0到1023，它们紧密绑定（binding）于一些服务。通常这些端口的通讯明确表明了某种服务的协议
  • 注册端口（Registered Ports）：从1024到49151。它们松散地绑定于一些服务。也就是说有许多服务绑定于这些端口，这些端口同样用于许多其它目的
  • 动态和/或私有端口（Dynamic and/or Private Ports）：从49152到65535。理论上，不应为服务分配这些端口。实际上，机器通常从1024起分配动态端口
常见的默认端口
  • 21端口：FTP 文件传输服务
  • 22端口：SSH 远程连接服务
  • 23端口：TELNET 终端仿真服务
  • 25端口：SMTP 简单邮件传输服务
  • 53端口：DNS 域名解析服务
  • 80端口：HTTP 超文本传输服务
  • 443端口：HTTPS 加密的超文本传输服务
  • 3306端口：MYSQL数据库端口
  • 5432端口：postgresql数据库端口
  • 6379端口：Redis数据库端口
  • 8080端口：TCP服务端默认端口
  • 8888端口：Nginx服务器的端口
  • 9200端口：Elasticsearch服务器端口
  • 27017端口：mongoDB数据库默认端口
  • 22122端口：fastdfs服务器默认端口

4.ajax的概念和优缺点

ajax的概念

Ajax即“Asynchronous Javascript And XML”（异步的JavaScript和XML），是指一种创建交互式、快速动态网页应用的网页开发技术，无需重新加载整个网页的情况下，能够更新部分网页的技术。又称为异步无刷新技术

对比新浪博客和起点中文网，我们可以看出两者之间的区别

ajax的优点
  1. 无刷新更新数据：AJAX最大优点就是能在不刷新整个页面的前提下与服务器通信维护数据。这使得Web应用程序更为迅捷地响应用户交互，并避免了在网络上发送那些没有改变的信息，减少用户等待时间，带来非常好的用户体验
  2. 异步服务器通信：AJAX使用异步方式与服务器通信，不需要打断用户的操作，具有更加迅速的响应能力。优化了Browser和Server之间的沟通，减少不必要的数据传输、时间及降低网络上数据流量
    3.前后端负载均衡：AJAX可以把以前一些服务器负担的工作转嫁到客户端，利用客户端闲置的能力来处理，减轻服务器和带宽的负担，节约空间和宽带租用成本。并且减轻服务器的负担，AJAX的原则是“按需取数据”，可以最大程度的减少冗余请求和响应对服务器造成的负担，提升站点性能
  3. 基于标准被广泛支持：AJAX基于标准化的并被广泛支持的技术，不需要下载浏览器插件或者小程序，但需要客户允许JavaScript在浏览器上执行。随着Ajax的成熟，一些简化 Ajax使用方法的程序库也相继问世。同样，也出现了另一种辅助程序设计的技术，为那些不支持JavaScript的用户提供替代功能
  4. 前后端分离AJAX使WEB中的界面与应用分离（也可以说是数据与呈现分离），有利于分工合作、减少非技术人员对页面的修改造成的WEB应用程序错误、提高效率、也更加适用于现在的发布系统
ajax的缺点
  1. AJAX干掉了Back和History功能，即对浏览器机制的破坏在动态更新页面的情况下，用户无法回到前一个页面状态，因为浏览器仅能记忆历史记录中的静态页面。一个被完整读入的页面与一个已经被动态修改过的页面之间的差别非常微妙；用户通常会希望单击后退按钮能够取消他们的前一次操作，但是在Ajax应用程序中，这将无法实现
  2. AJAX存在安全问题AJAX技术给用户带来很好的用户体验的同时也对IT企业带来了新的安全威胁，Ajax技术就如同对企业数据建立了一个直接通道。这使得开发者在不经意间会暴露比 以前更多的数据和服务器逻辑。Ajax的逻辑可以对客户端的安全扫描技术隐藏起来，允许黑客从远端服务器上建立新的攻击。还有Ajax也难以避免一些已知 的安全弱点，诸如跨站点脚步攻击、SQL注入攻击和基于Credentials的安全漏洞等等
  3. 对搜索引擎支持较弱对搜索引擎的支持比较弱。如果使用不当，AJAX会增大网络数据的流量，从而降低整个系统的性能

5.ajax的核心代码

ajax技术的核心是XMLHttpRequest构造函数，通过实例化对象以及方法的调用完成数据请求

  // 创建xhr，确认事件（挖洞 修地铁）
  var xhr = new XMLHttpRequest();    // 创建ajax对象
  // 开辟通道（开通 指定运行路线 目标）
  xhr.open('get', './mockdata/txt.txt', true);
  // 事件监听（雷达探测器）
  xhr.onreadystatechange = function () {
  	// 状态满足特定条件的时候
    // xhr.readyState == 4 表示前端成功 -- 状态码
    // xhr.status == 200 表示后端成功 -- 响应码
    if (xhr.readyState == 4 && xhr.status == 200) {  
      console.log(xhr.responseText); // 响应的文本
    }
  }
  // 发射
  xhr.send();  // 发送请求和数据

6.ajax的细节

ajax的状态码

readyState表明当前请求所在的状态，共有5个值

  • 0 => 未初始化状态(unitialized)，open还没有调用
  • 1 => 正在加载(loading)，服务器连接已建立，open已调用
  • 2 => 加载完毕(loaded)，请求已接收头信息
  • 3 => 交互(interactive)，请求处理中，已接收主体信息
  • 4 => 完成(complete)，响应已完成
  var xhr = new XMLHttpRequest();
  console.log(xhr.readyState);                  // 0
  xhr.open('get', './mockdata/txt.txt', true);
  console.log(xhr.readyState);                  // 1
  xhr.onreadystatechange = function () {
    console.log(xhr.readyState);                // 2 3 4
  }
  console.log(xhr.readyState);                  // 1
  xhr.send();

只有在事件监听中才可以拿到 2，3，4 状态码

ajax的响应码
  • 1：信息类，表示收到web浏览器的请求，正在进一步的处理中
  • 2：成功，表示用户被正确接收，比如200 ok
  • 3：重定向，表示请求没有成功，客户端必须采取进一步的动作
  • 4：客户端错误，表示客户端提交的请求有错误，比如404，请求中所引用的文档不存在
  • 5：服务器错误，表示服务器不能完成队请求的处理，比如500
常见的响应码
  • 200：交易成功
  • 304：客户端已经执行了GET，但文件未变化
  • 404：没有发现文件、查询或URL
  • 500：服务器产生内部错误
  • 100：客户必须继续发出请求
  • 101：客户要求服务器根据请求转换HTTP协议版本
  • 201：提示知道新文件的URL
  • 202：接受和处理、但处理未完成
  • 203：返回信息不确定或不完整
  • 204：请求收到，但返回信息为空
  • 205：服务器完成了请求，用户代理必须复位当前已经浏览过的文件
  • 206：服务器已经完成了部分用户的GET请求
  • 300：请求的资源可在多处得到
  • 301：删除请求数据
  • 302：在其他地址发现了请求数据
  • 303：建议客户访问其他URL或访问方式
  • 305：请求的资源必须从服务器指定的地址得到
  • 306：前一版本HTTP中使用的代码，现行版本中不再使用
  • 307：申明请求的资源临时性删除
  • 400：错误请求，如语法错误
  • 401：请求授权失败
  • 402：保留有效ChargeTo头响应
  • 403：请求不允许
  • 405：用户在Request - Line字段定义的方法不允许
  • 406：根据用户发送的Accept拖，请求资源不可访问
  • 407：类似401，用户必须首先在代理服务器上得到授权
  • 408：客户端没有在用户指定的饿时间内完成请求
  • 409：对当前资源状态，请求不能完成
  • 410：服务器上不再有此资源且无进一步的参考地址
  • 411：服务器拒绝用户定义的Content - Length属性请求
  • 412：一个或多个请求头字段在当前请求中错误
  • 413：请求的资源大于服务器允许的大小
  • 414：请求的资源URL长于服务器允许的长度
  • 415：请求资源不支持请求项目格式
  • 416：请求中包含Range请求头字段，在当前请求资源范围内没有range指示值，请求也不包含If - Range请求头字段
  • 417：服务器不满足请求Expect头字段指定的期望值，如果是代理服务器，可能是下一级服务器不能满足请求
  • 501：服务器不支持请求的函数
  • 502：服务器暂时不可用，有时是为了防止发生系统过载
  • 503：服务器过载或暂停维修
  • 504：关口过载，服务器使用另一个关口或服务来响应用户，等待时间设定值较长
  • 505：服务器不支持或拒绝支请求头中指定的HTTP版本
ajax的请求中状态
  var xhr = new XMLHttpRequest();
  xhr.open('get', './mockdata/txt.txt', true);
  xhr.onreadystatechange = function () {
    if (xhr.readyState == 4 && xhr.status == 200) {
      document.body.innerHTML = xhr.responseText;
    } else {
      // 请求中的状态（不成功） 
      document.body.innerHTML = 'loading...';
    }
  }
  xhr.send();

7.异步与回调

异步特性

我们知道JS是单线程的，既然是单线程那么就很容易出现线程被堵塞的情况，而异步就可以解决堵塞的问题，当然JS是单线程的它本身是不能异步的，但JS的宿主环境浏览器是多线程的，宿主环境通过某种方式使得JS具备了异步的特性，会脱离当前的执行顺序

var num = 1;
setTimeout(function() {
  num++;
  console.log(num);
}, 1000);
console.log(num); 
// 两次输出结果并是不2 1而是1 2

通常我们会使用回调函数来解决异步的问题

8.ajax调用接口

var xhr = new XMLHttpRequest();
xhr.open('get', 'api');
xhr.onreadystatechange = function () {
    if (xhr.readyState == 4 && xhr.status == 200) {
        var data = JSON.parse(xhr.responseText);
        console.log(data);
    }
}
xhr.send();

9.同源策略和跨域

同源策略

同源策略（same origin policy）是一种约定，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的，浏览器只是针对同源策略的一种实现。同源策略是浏览器的行为，是为了保护本地数据不被JavaScript代码获取回来的数据污染，因此拦截的是客户端发出的请求回来的数据接收，即请求发送了，服务器响应了，但是无法被浏览器接收

同源指的是域名/IP，协议，端口都相同

跨域

跨域，是指浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对JavaScript实施的安全限制。同源策略限制了以下行为：

  1. Cookie、LocalStorage和IndexDB无法读取
  2. DOM和JS对象无法获取
  3. Ajax请求发送不出去
CORS（XHR2）

CORS是一个W3C标准，全称是"跨域资源共享"（Cross-origin resource sharing）。 它允许浏览器向跨源服务器，发出XMLHttpRequest请求，从而克服了AJAX只能同源使用的限制

// PHP CORS
//解决跨域问题
header("Access-Control-Allow-Origin:*");

10.用户注册接口

<?php
header('content-type:text/html; charset=utf8'); // 返回文本和html内容，编码方式utf-8
header("Access-Control-Allow-Origin:*"); // 告诉浏览器，别拦我，谁都可以访问

$server = 'localhost:3306'; // 服务器
$username = $password = 'root'; // 用户名 密码
$dbname = 'mall2004'; // 库名（数据库名）

// 数据库连接对象，mysqli_connect的作用是负责连库，$conn代表当前连好的库
$conn = mysqli_connect($server, $username, $password, $dbname);

mysqli_set_charset($conn, 'utf8'); // 解决数据库中文乱码

if (!$conn) { // 如果$conn不存在，表示：数据库连接失败
    die('数据库连接失败');
}
// echo '数据库连接成功';

// 后端接收前端传过来的参数
// $_REQUEST 支持get和post拿到的参数
$username = $_REQUEST['username'];
$password = $_REQUEST['password'];

// 注册
$sql = "SELECT * from userinfo WHERE username = '$username'"; // 从库里面找到当前参数，$username 表示用户传进来的数据
$result = mysqli_query($conn, $sql); // 得到结果集
$data = mysqli_fetch_assoc($result); // 从结果集中拿一条数据（数据只能一条一条拿）

if ($data) { // 表示当前库中 用户名 存在
    echo json_encode(array( // json_encode() 是将 PHP对象/数组 变为一个 json数据（以字符串的形式体现的）
        'code' => 0, // 表示失败
        'msg' => '用户名已存在', // 表示为什么失败
    ));
} else { // 表示 用户名 不存在
    $sql = "INSERT INTO userinfo (username, password) VALUES ('$username', '$password')"; // 在数据库中创建并插入数据
    mysqli_query($conn, $sql);  // 表示：受影响行数
    $rows = mysqli_affected_rows($conn);// 拿到受影响行数

    if ($rows > 0) { // 表示：受影响行数至少是 1
        echo json_encode(array(
            'code' => 1, // 表示成功
            'msg' => '注册成功',
        ));
    }
}

11.用户登录接口

<?php
header('content-type:text/html;charset=utf-8'); // 返回文本和html内容，编码方式utf-8
header("Access-Control-Allow-Origin:*"); // 告诉浏览器，别拦我，谁都可以访问

$server = 'localhost:3306'; // 服务器
$username = $password = 'root'; // 用户名 密码
$dbname = 'mall2004'; // 库名（数据库名）

// 数据库连接对象，mysqli_connect的作用是负责链接库，$conn代表当前连好的库
$conn = mysqli_connect($server, $username, $password, $dbname);

mysqli_set_charset($conn, 'utf8'); // 解决数据库中文乱码

if (!$conn) { // 如果$conn不存在，表示：数据库连接失败
    die('数据库连接失败');
}
// echo '数据库连接成功';

$obj = array( // 定义 $obj, 给一个默认值
    'code' => 0, // 默认失败（满足条件时才成功）
    'msg' => '登录失败', // 默认登录失败
);

// 如果前端的 username 没有 拿到（存在/传入） 或者 前端的 password 没有 拿到（存在/传入）
if (!isset($_REQUEST['username']) || !isset($_REQUEST['password'])) { // 判断当前 参数是否传入
    $obj['msg'] = '缺少必要参数'; // 缺少必要参数
    die(json_encode($obj)); // 表示后面的 路 都不走了
}

// 后端接收前端传过来的参数
// $_REQUEST 支持get和post拿到的参数
$username = $_REQUEST['username'];
$password = $_REQUEST['password'];

// 登录
$sql = "SELECT * from userinfo WHERE username = '$username'"; // 查询用户：从库里面找到当前参数，$username 表示用户传进来的数据
$result = mysqli_query($conn, $sql); // 得到结果集
$data = mysqli_fetch_assoc($result); // 从结果集中拿一条数据（数据只能一条一条拿）

if ($data) { // 表示当前库中 用户名 存在
    // 当用户名存在时，进行密码的比对
    if ($data['password'] === $password) { // 如果从$data中拿出的密码 password 恒等于用户传进来的密码 password
        $obj['code'] = 1; // 表示成功
        $obj['msg'] = '登录成功'; // 表示登录成功
    } else { // 表示从$data中拿出的密码 password 不恒等于用户传进来的密码 password
        $obj['msg'] = '用户名或密码错误'; // 失败
    } 
} else { // 表示 用户名 不存在
    $obj['msg'] = '用户名或密码错误'; // 失败
}

echo json_encode($obj); // 给前端返回

12.用户列表接口

<?php
header('content-type:text/html;charset=utf-8'); // 返回文本和html内容，编码方式utf-8
header("Access-Control-Allow-Origin:*"); // 告诉浏览器，别拦我，谁都可以访问

$server = 'localhost:3306'; // 服务器
$username = $password = 'root'; // 用户名 密码
$dbname = 'mall2004'; // 库名（数据库名）

// 数据库连接对象，mysqli_connect的作用是负责连库，$conn代表当前连好的库
$conn = mysqli_connect($server, $username, $password, $dbname);

mysqli_set_charset($conn, 'utf8'); // 解决数据库中文乱码

if (!$conn) { // 如果$conn不存在，表示：数据库连接失败
    die('数据库连接失败');
}
// echo '数据库连接成功';

// 用户列表
$sql = 'select * from userinfo'; // 查 用户列表
$result = mysqli_query($conn, $sql); // 得到结果集

$list = array(); // 创建一个 空数组
// 循环中 拿到所有的数据（$data）
while ($data = mysqli_fetch_assoc($result)) { // 循环的条件：当 $data 不等于 null 时
    // 伪插是 $list[]
    $list[] = $data; // 将拿到的所有 数据（$data）插入 空数组中
};
  
echo json_encode(array( // 包装数组：json_encode() 是将 PHP对象/数组 变为一个 json数据（以字符串的形式体现的）
    'code' => 1, // 表示成功
    'data' => $list // data 中放入 $list 数组
));

13.用户删除接口

<?php
header('content-type:text/html; charset=utf8'); // // 返回文本和html内容，编码方式utf-8
header("Access-Control-Allow-Origin:*"); // 告诉浏览器，别拦我，谁都可以访问

$server = 'localhost:3306'; // 服务器
$username = $password = 'root'; // 用户名 密码
$dbname = 'mall2004'; // 库名（数据库名）

// 数据库连接对象，mysqli_connect的作用是负责链接库，$conn代表当前连好的库
$conn = mysqli_connect($server, $username, $password, $dbname);

mysqli_set_charset($conn, 'utf8'); // 解决数据库中文乱码

if (!$conn) { // 如果$conn不存在，表示：数据库连接失败
  die('数据库连接失败');
}

// 后端接收前端传过来的参数
// $_REQUEST 支持get和post拿到的参数
$uid = $_REQUEST['uid']; // 从前端拿到一个uid（唯一标识）

// 删除
$sql = "DELETE FROM userinfo WHERE uid = $uid"; // 删除 userinfo 表中 uid 为 $uid 的数据 
mysqli_query($conn, $sql); // 执行 sql 删除
$rows = mysqli_affected_rows($conn); // 从 $conn 中拿到受影响行数

$obj = array( // 给一个默认值
    'code' => 0, // 默认失败（满足条件时才成功）
    'msg' => '服务器异常'
);

if ($rows > 0) {  // 表示：受影响行数至少是 1
    $obj = array(
        'code' => 1, // 表示成功
        'msg' => '删除成功' // 表示删除成功
    );
}

echo json_encode($obj); // 给前端返回

14.用户更新接口

<?php
header('content-type:text/html; charset=utf8'); // // 返回文本和html内容，编码方式utf-8
header("Access-Control-Allow-Origin:*"); // 告诉浏览器，别拦我，谁都可以访问

$server = 'localhost:3306'; // 服务器
$username = $password = 'root'; // 用户名 密码
$dbname = 'mall2004'; // 库名（数据库名）

// 数据库连接对象，mysqli_connect的作用是负责链接库，$conn代表当前连好的库
$conn = mysqli_connect($server, $username, $password, $dbname);

mysqli_set_charset($conn, 'utf8'); // 解决数据库中文乱码

if (!$conn) { // 如果$conn不存在，表示：数据库连接失败
    die('数据库连接失败');
}

// 后端接收前端传过来的参数
// $_REQUEST 支持get和post拿到的参数
$uid = $_REQUEST['uid']; // 从前端拿到一个uid（唯一标识）
$password = $_REQUEST['password']; // 从前端拿到一个password，需要修改

// 修改，更新
$sql = "UPDATE userinfo SET `password` = '$password' WHERE uid = $uid"; // 修改/更新 userinfo 表中 uid 为 $uid 的数据 
mysqli_query($conn, $sql); // 执行 sql 修改/更新
$rows = mysqli_affected_rows($conn); // 从 $conn 中拿到受影响行数

$obj = array( // 给一个默认值
    'code' => 0, // 默认失败（满足条件时才成功）
    'msg' => '更新失败',
);

if ($rows > 0) {  // 表示：受影响行数至少是 1
    $obj = array(
        'code' => 1, // 表示成功
        'msg' => '更新成功', // 表示更新成功
    );
};

echo json_encode($obj); // 向前端返回
DingDing_Zhang
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
ajax 引用端口
weixin_71439860的博客
08-18 227
ajax 引用端口
ajax接口和介绍
SasukeN的博客
06-30 6096
ajaxajax技术的目的是让JS发送HTTP请求,与后台通信,获取数据和信息.ajax技术的原理是实例化xmlhttp对象,使用此对象与后台通信.XMLHTTP:跨域加载数据不会出现跨域的安全提示信息问题.ajax通信的过程不会影响后续JS的执行,从而实现异步. 同步和异步异步:同时做几件事情同步:指的是做完一件事后再做另外一件事. 局部刷新和无刷新ajax可以时间局部刷新,也叫做无刷...
ajax 监听的哪个端口,ajax 查看端口是否连接数据库
weixin_36324426的博客
08-06 277
ajax 查看端口是否连接数据库 内容精选换一换删除数据库失败，提示有session正在连接。可能当前仍有session正在连接数据库，或者可能有session在不停地连接该数据库，故删除数据库失败。需要查看数据库中的session，检查是否仍有session在连接，如果有，排查连接数据库的机器，停止连接后再删除数据库。查询结果中的关键字段，说明如下：datname：用户会话所连接的数ROMA C...
ajax的二十个问题
a190404的博客
06-09 201
Ajax即Asynchronous Javascript And XML（异步JavaScript和XML）在 2005年被Jesse James Garrett提出的新术语，用来描述一种使用现有技术集合的‘新’方法，包括: HTML 或 XHTML, CSS, JavaScript, DOM, XML, XSLT, 以及最重要的XMLHttpRequest。使用Ajax技术网页应用能够快速地将增量更新呈现在用户界面上，而不需要重载（刷新）整个页面，这使得程序能够更快地回应用户的操作。......
Ajax之基础知识
李建雨的博客
12-24 530
目录 一、什么是Ajax? 二、Ajax请求的使用 1.Ajax请求使用步骤 2.如何发送Ajax请求 1.(现在没落了)通过jQUery方式 2.(现在重点用这个)axios发送Ajax请求 3.详解发送了get请求后客户端做了哪些事 三、编码解码方法 一、什么是Ajax? 核心:就是从服务器端进行数据交互的一种技术 通俗:通过Ajax从服务器获取数据 为什么要从服务器获取数据? 在实际开发中需要动态的从服务器获取数据。 客户端和服务器： 什么是客户端? 概念:手机电脑都属于
Ajax Interceptor
05-19
谷歌浏览器扩展，修改接口返回
Ajax实现文件下载
12-11
JQuery的ajax函数的返回类型只有xml、text、json、html等类型，没有“流”类型，所以我们要实现ajax下载，不能够使用相应的ajax函数进行文件下载。但可以用js生成一个form，用这个form提交参数，并返回“流”类型的...
AJAXCALL
10-31
AJAXCALL
Ajax详解
07-22
资源名称：Ajax详解内容简介：《Ajax 详解》电子书 chm格式，是《四天学会Ajax》一书扩展，更加详细的讲述Ajax的方方面面。 内容简要给大家说明一下：Ajax简介、使用Javaｓｃｒｉｐｔ和Ajax发出异步请求、Ajax中的...
ajax实例
01-08
ajax发送与接收数据 ajax可以使网页实现异步更新。意味着使用ajax获取服务器数据时，可以部分地更新页面而不用重载。 ajax JS代码 $.ajax({ contentType: application/x-www-form-urlencoded; charset=utf-8, //...
处理axios本地请求地址自动加上了http://localhost:8080/
Renners的博客
07-29 8665
问题请求地址变成了localhost8080+配置的本地地址。处理方法配置完善的ip地址，加上http或https。原因baseURL配置的ip不完整。再次调用后发现已经可以了。
Axios基础使用以及api的深入理解
qq_52569656的博客
03-07 1521
本文主要是介绍前端开发过程中对于Axios的基础使用以及并且了解其axios的源码实现后手写部分axios内置api方法加深对其理解；阅读本文你能够了解到为什么在使用Axios发送请求时：我们能够通过函数调用的方式又或是函数对象的方式指定请求方式便捷的发起请求；请求拦截器和响应拦截器的执行顺序原理等
关于axios.get的使用方法以及解决服务端无法获取完整接口地址的问题
weixin_44295944的博客
08-08 2699
阅读此文，默认能够使用get和post方式获取后台数据 1.传入的地址例如："http://localhost:8000/user?id=XXX" // 为给定 ID 的 user 创建请求 axios.get('/user?id=12345') .then(function (response) { console.log(response); }) 2.传入的地址例如...
axios的详细使用
Kepler_明的博客
12-09 620
关于axios Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。 官网的回答 安装 使用 npm: $ npm install axios 使用 bower: $ bower install axios 使用 cdn: <script src="https://unpkg.com/axios/dist/axios.min.js"></script> axios的请求方式 主要请求方式无非就是增删改查，get（请求数据）
VUE 之 Axios 的get和post前后端传参详解
热门推荐
qq_42552857的博客
03-21 4万+
vue axios请求方式和传参格式 http的get方法传递数组参数有两种形式 形式一: 通过逗号拼接query参数 http://localhost:8080/api?arr=1,2,3,4&name=1 形式二: 通过数组名+下标指定参数 http://localhost:8080/api?arr[0]=1&arr[1]=2 使用axios的get方法传递数组参数 形式一的解决方案 // 这里注意使用+''将参数转换成了字符串,
axios学习笔记
Demon_HL的博客
07-08 166
axios请求方式： axios(config) axios.request(config) axios.get(url [,config]) axios.post(url [,data [,config]]) axios.put(url [,data [,config]]) axios.delete(url [,config]) axios.patch(url [,data [,config]]) axios.head(url [,con
Ajax前后端交互利器详解(二)
Augenstern_QXL的博客
09-07 1465
✍ 1、同源政策 1.1、Ajax请求限制 Ajax 只能向自己的服务器发送请求。比如现在有一个A网站、有一个B网站，A网站中的 HTML 文件只能向A网站服务器中发送 Ajax 请求，B网站中的 HTML 文件只能向 B 网站中发送 Ajax 请求，但是 A 网站是不能向 B 网站发送 Ajax请求的，同理，B 网站也不能向 A 网站发送 Ajax请求。 1.2、什么是同源 如果两个页面拥有相同的协议、域名和端口，那么这两个页面就属于同一个源，其中只要有一个不相同，就是不同源 例如我们开启两个服务器，一
复习Ajax 01- ajax的基础用法
vip77778888的博客
01-08 573
Ajax 是浏览器中的技术：用来实现客户端网页请求服务器的数据。 它的英文全称是 Asynchronous Javascript And XML，简称 Ajax。 目录 Ajax http 协议 端口号 路径 使用 Ajax 请求数据的 5 种方式 axios专注于数据请求的库。 http 响应状态码 http 响应状态码 Vs 业务状态码 接口的概念 axios({ url:'请求路径', method:'get...
Ajax请求
weixin_52755319的博客
03-17 167
Ajax请求首先我们要了解Ajax是什么接下来我们了解一下Ajax的步骤 首先我们要了解Ajax是什么 Ajax 即“Asynchronous Javascript And XML”（异步 JavaScript 和 XML），是指一种创建交互式、快速动态网页应用的网页开发技术，无需重新加载整个网页的情况下，能够更新部分网页的技术。 通过在后台与服务器进行少量数据交换，Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。 Ajax HTTP脚本化 使用js代
ajax嵌套ajax
最新发布
07-28
在前端开发中，可以使用Ajax嵌套Ajax来实现多个异步请求的依次执行。具体步骤如下： 1. 在第一个Ajax请求的回调函数中，发送第二个Ajax请求。可以使用`$.ajax()`方法或者其他类似的方法发送异步请求。 2. 在第二个...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值