Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >专栏 >ajax请求

ajax请求

作者头像
Java架构师必看
发布于 2021-08-19 02:49:11
发布于 2021-08-19 02:49:11
1.8K0
举报
文章被收录于专栏:Java架构师必看Java架构师必看

ajax是无需刷新页面就能从服务器取得数据的方法。

chrome无法调试

XHR对象

open('get','example.php', false)

open()不会发送真正的请求,只是启动一个请求以备发送

若发送特定请求,要调用send()方法

如果不需要通过请求主体发送数据,则必须传入null。调用send()后,请求被分发到服务器。

timeout:超时时间

ontimeout:超时事件

load事件:onload

属性event,指向XHR对象实例

progress事件:onprogress

属性event,获取传输进度

跨域:一个简单的使用GET或POST发送的请求,没有自定义的头部,而主体内容是text/plain。在发送请求时,需额外加一个origin头部,包含请求页面的源信息(协议、域名、端口)。如果服务器任务请求可以接收,在Access-Control-Allow-Origin头部中回发相同的源信息。如果没有头部或头部源信息不匹配,浏览器会驳回请求。正常情况下,浏览器会处理请求。请求和响应都不包含cookie信息。

XDR对象(XDomainRequest):调用open(),接收两个参数:请求类型和URL,再调用send(),只支持异步执行。只要响应有效就会触发load事件,如果失败,会触发error事件。接收响应后,只能访问原始文本,没法确定响应的状态代码。

通过跨域XHR对象可以访问status和statusText属性,支持同步。但不能使用setRequestHeader()设置自定义头部,不能发送和接收cookie,调用getAllResponseHeaders()方法总会返回空字符串。

对于本地资源,最好使用相对URL,在访问远程资源时再使用绝对URL。

comet:其实现是Http流。在整个生命周期内保持一个Http连接。浏览器向服务器发送一个请求,服务器保持连接打开,周期性向浏览器发送数据。另外长轮询

SSE Comet交互推出的API(服务器发送事件)                                                                                                                                 webSocket                                                                                                                                                                                         一般情况下,只读取服务器数据,SSE比较容易实现。如果要双向通信(聊天室),会选择webSocket。组合XHR和SSE也可实现双向通信。

CSRF(跨站点请求伪造):未被授权系统有权访问某个资源                                                                                                              措施:1):以SSL连接来访问可以通过XHR请求的资源;   2):要求每一次请求都要附带经过相应算法计算得到的验证码         以下措施不起作用:1)发送POST而不是GET——容易改变;2)检查来源URL——来源记录容易伪造;3)基于cookie信息验证——容易伪造。

同源策略是对XHR的一个主要约束,为通信设置了“相同的域、相同的端口、相同的协议”限制。试图访问上述限制之外的资源,都会引发安全错误,除非采用被认可的跨域解决方案。这个解决方案叫做CORS。图像Ping和JSONP是另外两种跨域通信技术,不如CORS稳妥。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
AJAX 与跨域通信(一):AJAX 与同源策略
在远古时代,如果浏览器需要从服务器请求资源,其交互模式为 “客户端发出请求 -> 服务端接收请求并返回相应 HTML 文档 -> 页面刷新,客户端加载新的 HTML文档”,很显然,在这种情况下,即使只是为了更新部分数据,我们也不得不重新加载整个重绘的页面。而 AJAX 的出现解决了这个问题。
Chor
2019/11/11
1.1K0
AJAX 与跨域通信(一):AJAX 与同源策略
史上最全Web端即时通讯技术原理详解
关于IM(InstantMessaging)即时通信类软件(如微信,QQ),大多数都是桌面应用程序或者native应用较为流行,而网上关于原生IM或桌面IM软件类的通信原理介绍也较多,此处不再赘述。而web端的IM应用,由于浏览器的兼容性以及其固有的“客户端请求服务器处理并响应”的通信模型,造成了要在浏览器中实现一个兼容性较好的IM应用,其通信过程必然是诸多技术的组合,本文的目的就是要详细探讨这些技术并分析其原理和过程。 1.基于web的固有通信方式 浏览器本身作为一个瘦客户端,不具备直接通过系统调用来达
用户1263954
2018/06/22
1.8K0
ajax跨域的基本流程
创建XMLHttpRequest对象,也就是创建一个异步调用对象;判断XHR对象属性;创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息;设置响应HTTP请求状态变化的函数;发送HTTP请求;获取异步调用返回的数据;使用JavaScript和DOM实现局部刷新。
行云博客
2020/07/13
9330
ajax跨域有没有踩过坑,IE低版本浏览器如何支持?
同源策略 为了保证用户信息的安全,防止恶意的网站窃取数据,所有的浏览器都实行这个策略。 同源策略是指,用户在A网页上的所产生的信息,B网页上不能访问,反过来A网页也不能访问其它网页的信息,除非这两个网页"同源"。 为什么说同源策略可以保证用户信息安全,举个栗子:A网站是一家银行,用户登录以后,又去浏览其他网站。如果其他网站可以读取A网站的 Cookie,会发生什么? 两个文档同源需满足 1. 协议相同 2. 域名相同 3. 端口相同 Ajax跨域通信 同源策略规定,Ajax请求只能发给同源的网址,否则就报
连胜
2018/03/07
2.1K0
跨域二三事
更好的阅读体验 跨域是日常开发中经常开发中经常会接触到的一个重难点知识,何不总结实践一番,从此心中对之了无牵挂。 同源策略 之所以会出现跨域解决方案,是因为同源策略的限制。同源策略规定了如果两个 url 的协议、域名、端口中有任何一个不等,就认定它们跨源了。比如下列表格列出和 http://127.0.0.1:3000 比较的同源检测的结果, url 结果 原因 http://127.0.0.1:3000/index 同源 https://127.0.0.1:3000 跨源 协议不同
牧云云
2018/05/02
1.1K0
跨域二三事
AJAX 原理与 CORS 跨域
https://segmentfault.com/a/1190000011549088
Bug开发工程师
2018/09/21
1.4K0
AJAX 原理与 CORS 跨域
JavaScript第九弹——探究跨域
Hello小可爱们~~我又来了,还记得昨天说的今天要说什么吗???是滴,今天要说的就是跨域!
萌兔IT
2019/07/25
5420
你真的了解跨域吗
相信每个前端对于跨域这两个字都不会陌生,在实际项目中应用也很多,但跨域方法的多种多样让人目不暇接,前段时间公司同事出现了跨域问题,又一时找不到问题所在,所以在此总结下跨域知识,一篇由浅入深的万字Web基操文
isboyjc
2022/03/28
2.5K0
你真的了解跨域吗
滴滴前端面试题合集
DNS 服务器中以资源记录的形式存储信息,每一个 DNS 响应报文一般包含多条资源记录。一条资源记录的具体的格式为
coder2028
2022/09/12
8140
什么是跨域?一文弄懂跨域的全部解决方法
跨域(Cross-Origin Resource Sharing,简称 CORS)是一种安全策略,用于限制一个域的网页如何与另一个域的资源进行交互。这是浏览器实现的同源策略(Same-Origin Policy)的一部分,旨在防止恶意网站通过一个域的网页访问另一个域的敏感数据。
程序员洲洲
2024/06/07
6.2K0
什么是跨域?一文弄懂跨域的全部解决方法
写给刚入门的前端工程师的前后端交互指南
作为刚接触前端的不久的童鞋,大家都会兴奋于CSS和JS所带来漂亮界面,然而,前端工程师除了UI重构外,还有非常重要的职责在正确的区域渲染出服务端的数据。毕竟,我们要构建一个大的web应用,必然不是普普通通的静态页面构成。 下文将罗列将来前端工程师应该必备的同后端打交道的常用技能。 服务端渲染 谈起服务端渲染,对于动态服务而言,这个世界上跑的大多数页面都经历过服务端的数据渲染,接口->前端赋值->模版渲染 。这一切都在服务器完成,我们查看源码时候,可以看到完整的html代码,包括每个数据值。 常用的ph
用户1667431
2018/04/18
1K0
写给刚入门的前端工程师的前后端交互指南
跨域请求方案 终极版
现在是资源共享的时代,同样也是知识分享的时代,如果你觉得本文能学到知识,请把知识与别人分享。
互扯程序
2018/07/30
3.8K0
WEB 前端跨域解决方案
2.) 资源嵌入: <link> 、 <script> 、 <img/> 、 <frame> 等 dom 标签,还有样式中 background:url() 、 @font-face() 等文件外链
chuchur
2022/10/25
9550
Ajax与Comet
Ajax(Asynchronous JavaScript + XML的简写)可以向服务器请求数据而无需卸载(刷新)页面,带来更好的用户体验。 Ajax技术的核心是XMLHttpRequest对象(简称XHR)。
奋飛
2019/08/15
6920
史上最全跨域总结
跨域,是指浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的,是浏览器对JavaScript实施的安全限制。
Nealyang
2019/09/29
1.9K0
前端架构师之01_JavaScript_Ajax
响应头用于告知客户端本次响应的基本信息,包括服务器程序名、内容的编码格式、缓存控制等。
张哥编程
2024/12/13
1410
什么是跨域?解决方案有哪些?
同源策略/SOP(Same origin policy)是一种约定,由Netscape公司1995年引入浏览器,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到XSS、CSFR等攻击。所谓同源是指"协议+域名+端口"三者相同,即便两个不同的域名指向同一个ip地址,也非同源。
用户1093975
2018/08/03
15.2K0
什么是跨域?解决方案有哪些?
JS 中的网络请求 AJAX, Fetch, WebSocket
AJAX 是 Asynchronous JavaScript And XML 的简称,它可以让页面在不刷新的情况下从服务器获取数据。
羽月
2022/10/08
4.2K0
HTTP实用指南 - 笔记
HTTP( Hyper Text Transfer Protocol ) 模型如下图所示,是一个应用层(见上图)的协议,基于 TCP 协议,它有如下特点:
TagBug
2023/03/17
8640
HTTP实用指南 - 笔记
前端网络高级篇(四)CORS 跨域
AJAX同源策略主要用来防止CSRF攻击。如果没有AJAX同源策略,相当危险,我们发起的每一次HTTP请求都会带上请求地址对应的cookie,那么可以做如下攻击:
娜姐
2020/09/22
8210
前端网络高级篇(四)CORS 跨域
相关推荐
AJAX 与跨域通信(一):AJAX 与同源策略
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档