前端web通信

前言
    Web2.0以来,Ajax的出世,解决了传统表单提交页面跳转,闪烁白屏等问题。使得Web页面可以实现局部更新,不仅减少了网络带宽,还大大提升了用户体验。

    但Ajax并非是一把万能的钥匙,足以打开Web通信这扇大门,当请求遇到跨域通信时,Ajax就没辙了。
    (一个众所周知的问题,Ajax直接请求普通文件存在跨域无权限访问的问题,甭管你是静态页面、动态网页、web服务、WCF,只要是跨域请求,一律不准)

    Web的快速发展让开发走向工程化的同时,要求工作维度进行划分(前端后端分工明细),以便扩展维护日益复杂庞大的项目需求。而前后端分离的开发方式正是这种需求背景下衍生的产物。(以前混编的代码现在是再也不想看到)

    前后端分离的开发方式,如何进行数据通信是开发人员绕不过去的问题。作为开发同学的小伙伴客户端的浏览器,有点小调皮还做了一个同源策略的限制,当我们的数据请求遇到不同源的情况下(跨域),我们就得尝试其它的通信方法,不能Ajax一条道走到黑

同源策略及限制
    
    同源策略限制从一个源加载的文档或脚本如何与来自另一个源的资源进
    行交互。这是一个用于隔离潜在恶意文件的关键的安全机制。

同源要求协议,域名,端口(默认80)三者都相同,否则为非同源
同源策略限制:
Cookie, LocalStorage和IndexDB无法读取
Dom无法获取
Ajax请求不能发送
前后端如何通信
Ajax(仅支持同源)
WebSocket (不受同源限制)
CORS (都支持,新的W3C通信标准)

如何创建Ajax
XMLHttpRequest对象的工作流程
兼容性处理

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值