ajax

ajax

• Ajax 指的是只刷新局部页面的技术，诞生于2007年。
• ajax：含义：
  • A
    • 异步的
  • J
    • JavaScript
  • A
    • 和
  • X
    • XML
• 可以同时执行的事情
  • setTimeout
  • 事件
• 什么是XML 可扩展标记语言
  • XML是用来存储数据的
  • XHTML 可扩展的超文本标记语言
  • DOM用于操作标准化文档解构 (HTML，XML)
• 现代Ajax 使用的JSON传递数据
• status HTTP状态码
  • 1xx 信息
  • 2xx 成功
  • 3xx 重定向
  • 4xx 客户端错误
  • 5xx 服务端错误

创建ajax步骤

1. 创建ajax对象
2. 建立连接
3. 发送请求
4. 设置回调

• 代码：

 var xhr = new XMLHttpRequest(); // 创建ajax对象
        xhr.open('GET', './content.txt', true); //建立连接
        xhr.send(); //发送请求
        xhr.onreadystatechange = function() {
            if (xhr.readyState == 4 && xhr.status == 200) { // 就绪状态为4 且 HTTP状态码是200
                console.log(xhr.responseText); // responseText 服务器响应文本数据
            }
        }

原生js ajax请求有几个步骤？分别是什么

//创建 XMLHttpRequest 对象
var ajax = new XMLHttpRequest();
//规定请求的类型、URL 以及是否异步处理请求。
ajax.open('GET',url,true);
//发送信息至服务器时内容编码类型
ajax.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
//发送请求
ajax.send(null);  
//接受服务器响应数据
ajax.onreadystatechange = function () {
    if (obj.readyState == 4 && (obj.status == 200 || obj.status == 304)) { 
    }
};

XMLHttpRequest的目的是什么？

• 它将后台数据发送到服务器。
• 它从服务器请求数据。
• 它从服务器接收数据。
• 它在不重新加载页面的情况下更新数据。

XMLHttpRequest的属性是什么？

• onReadyStateChange - 只要readystate属性发生变化，就会调用它。
• readyState - 表示请求的状态。
• responseText - 它将响应作为文本返回。
• responseXML - 它以XML格式返回响应。
• status - 返回请求的状态编号。
• statusText - 返回状态的详细信息。

XMLHttpRequest的重要方法是什么？

• abort()- 用于取消当前请求。
• getAllResponseHeaders()- 返回标题详细信息。
• getResponseHeader()- 返回特定的标题详细信息。
• open()- 用于打开请求。
• send()- 用于发送请求。
• setRequestHeader()- 它添加了请求标头。

XMLHttpRequest使用的open()方法有哪些类型？

• open(method,URL)- 它打开指定get或post方法和URL的请求。
• open(method,URL,async)- 它与上面相同但是指定异步或不指定。
• open(method,URL,async,userName,password)- 与上面相同，但指定用户名和密码。

XMLHttpRequest使用的send()方法有哪些类型？

• send()- 它发送get请求
• send(string)- 发送帖子请求。

回调函数在AJAX中的作用是什么？

回调函数将函数作为参数传递给另一个函数。如果我们必须在网站上执行各种AJAX任务，那么我们可以创建一个用于执行XMLHttpRequest的函数和一个用于执行每个AJAX任务的回调函数。

ajax的优缺点

• 优点
  • 快速回复
  • 带宽利用率
  • 在从服务器检索数据之前，不会阻止用户。
  • 它允许我们只将重要数据发送到服务器。
  • 它使应用程序具有交互性和更快速。
• 缺点
  • 取决于JavaScript
  • 安全问题
  • 调试很困难

AJAX有哪些安全问题？

• AJAX源代码是可读的
• 攻击者可以将脚本插入系统

同步和异步请求有什么区别？

同步请求会阻止用户，直到检索到响应，而异步不会阻止用户。

AJAX中请求的准备状态有哪些？

• 0：意味着未被发现
• 1：表示已打开
• 2：表示HEADERS_RECEIVED
• 3：表示装载
• 4：表示完成

JavaScript和AJAX有什么区别？

JavaScript

• JavaScript是一种基于对象的脚本语言。
• 它请求服务器并等待响应。
• 重新加载页面时会占用更多带宽。
  AJAX
• AJAX是一组相互关联的技术，如JavaScript，XML，HTML，CSS等
• 它向服务器发送请求，不等待响应。
• 它不会重新加载页面，因此占用的带宽更少。

使用AJAX存在的问题

（1）复杂性增加了

• 服务器端开发人员需要了解HTML客户端页面以及服务器端逻辑中将需要表示逻辑。
• 页面开发人员必须具备JavaScript技能。

（2）基于AJAX的应用程序可能难以调试，测试和维护

• JavaScript很难测试 - 自动测试很难。
• JavaScript中的模块化程度较弱。
• 尚缺乏设计模式或最佳实践指南。

（3）工具包/框架尚未成熟

• 他们中的大多数都处于测试阶段。

（4）尚未标准化XMLHttpRequest

• IE的未来版本将解决这个问题。

（5）旧浏览器中不支持XMLHttpRequest

• iframe会有所帮助。

（6）JavaScript技术依赖性和不兼容性

• 必须启用应用程序才能运行。
• 仍然存在一些浏览器不兼容性。

（7）JavaScript代码对黑客可见

• 设计糟糕的JavaScript代码可能会引发安全问题。