Ajax常见面试题 -- 前端面试题(二)
1:什么是ajax?ajax作用是什么?
异步的javascript和xml AJAX 是一种用于创建快速动态网页的技术。 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)) {
}
};
//字符串转对象
JSON.parse(json)
eval('(' + jsonstr + ')')
// 对象转字符串
JSON.stringify(json)
常用的post,get,delete。不常用copy、head、link等等。
代码上的区别
1:get通过url传递参数
2:post设置请求头 规定请求数据类型
使用上的区别
1:post比get安全
(因为post参数在请求体中。get参数在url上面)
2:get传输速度比post快 根据传参决定的。
(post通过请求体传参,后台通过数据流接收。速度稍微慢一些。而get通过url传参可以直接获取)
3:post传输文件大理论没有限制 get传输文件小大概7-8k ie4k左右
4:get获取数据 post上传数据
(上传的数据比较多 而且上传数据都是重要数据。所以不论在安全性还是数据量级 post是最好的选择)
同源策略限制 不同源会造成跨域。以下任意一种情况不同,都是不同源。
http://www.baidu.com/8080/index.html
- 原理:动态创建一个script标签。利用script标签的src属性不受同源策略限制。因为所有的src属性和href属性都不受同源策略限制。可以请求第三方服务器数据内容。
- 步骤:
- 去创建一个script标签
- script的src属性设置接口地址
- 接口参数,必须要带一个自定义函数名 要不然后台无法返回数据。
- 通过定义函数名去接收后台返回数据
//去创建一个script标签
var script = document.createElement("script");
//script的src属性设置接口地址 并带一个callback回调函数名称
script.src = "http://127.0.0.1:8888/index.php?callback=jsonpCallback";
//插入到页面
document.head.appendChild(script);
//通过定义函数名去接收后台返回数据
function jsonpCallback(data){
//注意 jsonp返回的数据是json对象可以直接使用
//ajax 取得数据是json字符串需要转换成json对象才可以使用。
}
- 原理:服务器设置Access-Control-Allow-OriginHTTP响应头之后,浏览器将会允许跨域请求
- 限制:浏览器需要支持HTML5,可以支持POST,PUT等方法兼容ie9以上
需要后台设置
Access-Control-Allow-Origin: * //允许所有域名访问,或者
Access-Control-Allow-Origin: http://a.com //只允许所有域名访问
- 原理:相同主域名不同子域名下的页面,可以设置document.domain让它们同域
- 限制:同域document提供的是页面间的互操作,需要载入iframe页面
var ifr = document.createElement('iframe');
ifr.src = 'http://b.a.com/bar';
ifr.onload = function(){
var ifrdoc = ifr.contentDocument || ifr.contentWindow.document;
ifrdoc.getElementsById("foo").innerHTML);
}; ifr.style.display = 'none';
document.body.appendChild(ifr);
2xx (成功)表示成功处理了请求的状态代码
200 (成功) 服务器已成功处理了请求。 通常。
3xx (重定向) 表示要完成请求,需要进一步操作。 通常,这些状态代码用来重定向。
304 (未修改) 自从上次请求后,请求的网页未修改过。 服务器返回此响应时,不会返回网页内容。
4xx(请求错误) 这些状态代码表示请求可能出错,妨碍了服务器的处理
1:400 (错误请求) 服务器不理解请求的语法。
2:403 (禁止) 服务器拒绝请求。
3:404 (未找到) 服务器找不到请求的网页。
5xx(服务器错误)这些状态代码表示服务器在尝试处理请求时发生内部错误。 这些错误可能是服务器本身的错误,而不是请求出错
500 (服务器内部错误) 服务器遇到错误,无法完成请求。
501 (尚未实施) 服务器不具备完成请求的功能。 例如,服务器无法识别请求方法时可能会返回此代码。
502 (错误网关) 服务器作为网关或代理,从上游服务器收到无效响应。
503 (服务不可用) 服务器目前无法使用(由于超载或停机维护)。 通常,这只是暂时状态。
504 (网关超时) 服务器作为网关或代理,但是没有及时从上游服务器收到请求。
505 (HTTP 版本不受支持) 服务器不支持请求中所用的 HTTP 协议版本。
Ajax常见面试题 -- 前端面试题(二)的更多相关文章
- 前端面试题总结(二)CSS篇
前端面试题总结(二)CSS篇 一.link和@import的区别? link属于HTML标签,可以引入出css以外的事务,如RSS,而@import是css提供的,只能加载css文件. link会在页 ...
- 史上最全前端面试题(含答案)-A篇
HTML+CSS1.对WEB标准以及W3C的理解与认识标签闭合.标签小写.不乱嵌套.提高搜索机器人搜索几率.使用外 链css和js脚本.结构行为表现的分离.文件下载与页面速度更快.内容能被更多的用户所 ...
- 金三银四,磨砺锋芒;剑指大厂,扬帆起航(2020年最全大厂WEB前端面试题精选)上
金三银四,磨砺锋芒:剑指大厂,扬帆起航(2020年最全大厂WEB前端面试题精选)上 引言 元旦匆匆而过,2020年的春节又接踵而来,大家除了忙的提着裤子加班.年底冲冲冲外,还有着对于明年的迷茫和期待! ...
- 【web前端面试题整理02】前端面试题第二弹袭来,接招!
前言 今天本来准备先了解下node.js的,但是,看看我们一个小时前与一个小时后的差距: 既然如此,我们继续来搜集我们的前端面试题大业吧!!! 特别感谢玉面小肥鱼提供哟,@玉面小飞鱼 题目一览 Jav ...
- 各大互联网公司前端面试题(js)
对于巩固复习js更是大有裨益. 初级Javascript: 1.JavaScript是一门什么样的语言,它有哪些特点? 没有标准答案. 2.JavaScript的数据类型都有什么? 基本数据类型 ...
- 【重点--web前端面试题总结】
前端面试题总结 HTML&CSS: 对Web标准的理解.浏览器内核差异.兼容性.hack.CSS基本功:布局.盒子模型.选择器优先级及使用.HTML5.CSS3.移动端适应. JavaScri ...
- 前端周报:前端面试题及答案总结;JavaScript参数传递的深入理解
1.2017前端面试题及答案总结 |掘金技术征文 "金三银四,金九银十",用来形容求职最好的几个月.但是随着行业的饱和,初中级前端er就业形势不容乐观. 行业状态不可控,我们能做的 ...
- 前端面试题 -- JS篇
前端面试题 -- JS篇 类型 1.js中有哪些数据类型,并解释清楚原始数据类型和引用数据类型 js中共有null,undefined, string,number,boolean,object六种数 ...
- 第136天:Web前端面试题总结(理论)
Web前端面试题总结 HTML+CSS理论知识 1.讲讲输入完网址按下回车,到看到网页这个过程中发生了什么 a. 域名解析 b. 发起TCP的3次握手 c. 建立TCP连接后发起http请求 d. 服 ...
随机推荐
- 设置 Linux 下打印机的几种方式
设置 Linux 下打印机的几种方式 一.使用 cups 进行设置 如若遇到 cups 也没有驱动的话可以前往 openprinting.org 找寻对应驱动. 二.前往 official 下载驱动 ...
- flask_json数据入库Mongo
首先我们先导入python内置的json库,用来将接送数据转换为python对象 import json #导入自定义的数据公共库 from db_tool import db #载入库之前先清空数据 ...
- centos 部署.netcore 开发环境
.netcore 2.0的安装,安装前,先参考官方文档 https://www.microsoft.com/net/core#linuxcentos 先做微软的签名校验工作 # sudo rpm -- ...
- java中连接各种数据的方法
1.oraclethin驱动连接字符串:jdbc:oracle:thin:用户名/密码@localhost:1521:cake驱动类:oracle.jdbc.driver.OracleDriver 2 ...
- Python Mock的入门学习
一.Mock是什么 Mock这个词在英语中有模拟的这个意思,因此我们可以猜测出这个库的主要功能是模拟一些东西.准确的说,Mock是Python中一个用于支持单元测试的库,它的主要功能是使用mock对象 ...
- Elasticsearch5.3.1 IK分词,同义词/联想搜索设置
[大数据]-Elasticsearch5.3.1 IK分词,同义词/联想搜索设置 原文地址:http://www.cnblogs.com/NextNight/p/6837407.html --题外话 ...
- Javac常量池的解读
interface IA{ public void md(); } public class Test07 implements IA{ final double d = 2.0d; final fl ...
- 使用node和express+mongodb实现数据增删改功能
2018即将过去,2019即将来临,前端技术不断在在更新,学的东西越来越多.我们只有不断的学习,才不能被淘汰.在前后端分离的一个时代,后端提供接口,前端调用接口,逻辑判断,每个都是独立的工作.如果自己 ...
- react项目中使用antd
1.antd官网: https://ant.design/docs/react/introduce-cn 2.React中使用Antd 1.安装antd npm install antd --save ...
- hibernate对连接池的支持和HQL查询
hibernate对连接池的支持 连接池, 作用: 管理连接:提升连接的利用效率! 常用的连接池: C3P0连接池 Hibernate 自带的也有一个连接池,且对C3P0连接池也有支持! 只维护一个连 ...