前言
Web2.0以来,Ajax的出世,解决了传统表单提交页面跳转,闪烁白屏等问题。使得Web页面可以实现局部更新,不仅减少了网络带宽,还大大提升了用户体验。
但Ajax并非是一把万能的钥匙,足以打开Web通信这扇大门,当请求遇到跨域通信时,Ajax就没辙了。
(一个众所周知的问题,Ajax直接请求普通文件存在跨域无权限访问的问题,甭管你是静态页面、动态网页、web服务、WCF,只要是跨域请求,一律不准)
Web的快速发展让开发走向工程化的同时,要求工作维度进行划分(前端后端分工明细),以便扩展维护日益复杂庞大的项目需求。而前后端分离的开发方式正是这种需求背景下衍生的产物。(以前混编的代码现在是再也不想看到)
前后端分离的开发方式,如何进行数据通信是开发人员绕不过去的问题。作为开发同学的小伙伴客户端的浏览器,有点小调皮还做了一个同源策略的限制,当我们的数据请求遇到不同源的情况下(跨域),我们就得尝试其它的通信方法,不能Ajax一条道走到黑
同源策略及限制
同源策略限制从一个源加载的文档或脚本如何与来自另一个源的资源进
行交互。这是一个用于隔离潜在恶意文件的关键的安全机制。
同源要求协议,域名,端口(默认80)三者都相同,否则为非同源
同源策略限制:
* Cookie, LocalStorage和IndexDB无法读取
* Dom无法获取
* Ajax请求不能发送
前后端如何通信
* Ajax(仅支持同源)
* WebSocket (不受同源限制)
* CORS (都支持,新的W3C通信标准)
如何创建Ajax
* XMLHttpRequest对象的工作流程
* 兼容性处理
*
前端web通信
最新推荐文章于 2023-12-18 18:00:00 发布