Javascript Ajax总结——其他跨域技术之Comet
Comet指一种更高级的Ajax技术( 也称 “服务器推送” ),一种服务器向页面推送数据的技术。Comet能够让信息近乎实时地被推送到页面上,非常适合体育比赛的分数和股票报价。
有两种实现Comet的方式:长轮询、流
传统轮询(也称短轮询),即浏览器定时向服务器发送请求,看有没有更新的数据。
长轮询把短轮询颠倒了一下。页面发起一个到服务器的新请求,然后服务器一直保持连接打开,直到有数据可发送。发送完数据之后,浏览器关闭连接,随即又发送一个到服务器的新请求。这一过程在页面打开期间一直持续不断。
轮询的优势是所有浏览器都支持,因为使用XHR对象和setTimeout()就能实现。而你要做的就是决定什么时候发送请求。
HTTP流,在页面的整个生命周期内只使用一个HTTP连接。浏览器向服务器发送一个请求,而服务器保持连接打开,然后周期性地向浏览器发送数据。
如,下面这段PHP脚本就是采用流实现的服务器中常见的形式:
1 <?php
2 $i = 0;
3 while(true){
4 //输出一些数据,然后立即刷新输出缓存
5 echo "Number is $i";
6 flush();
7 //等几秒钟
8 sleep(10);
9 $i++;
10 }
11 ?>
所有服务器语言都支持打印到输出缓存然后刷新(将输出缓存中的内容一次性全部发送到客户端)的功能。而这正是实现HTTP流的关键所在。
Firefox、Safari、Opera、Chrome中,通过侦听readystatechange事件及检测readyState的值是否为3,就可以利用XHR对象实现HTTP流。随着不断从服务器接收数据,readyState的值会周期性地变为3,。当readyState值变为3时,responseText属性就会保存接收到的所有数据。此时,比较此前接收到的数据,决定从什么位置开始取得最新的数据。使用XHR对象实现HTTP流的典型代码:
1 function createStreamingClient(url, progress, finished){
2 var xhr = new XMLHttpRequest(),
3 received = 0;
4 xhr.open("get, url, true");
5 xhr.onreadystatechange = function(){
6 var result;
7 if(xhr.readyState ==3){
8 //只取得最新数据并调整计数器
9 result = xhr.responseText.substring(received);
10 received += result.length;
11 //调用progress回调函数
12 progress(result);
13 } else if (xhr.readyState ==4){
14 finished(xhr.response);
15 }
16 };
17 xhr.send(null);
18 return xhr;
19 }
20 var client = createStreamingClient("streaming.php", function(data){
21 alert("Received: " + data);
22 }, function(data){
23 alert("Done!");
24 });
这个例子能在大多数浏览器中正常运行(IE除外),但管理Comet连接很容易出错,需要时间不短改进才能达到完美。
Javascript Ajax总结——其他跨域技术之Comet的更多相关文章
- js-其他跨域技术(JSONP`Comet)
###1. JSONP JSONP由两部分组成:回调函数和数据 JSONP是通过动态<script>元素来使用的,使用时可以为src属性指定一个跨域URL eg: function ha ...
- 06: AJAX全套 & jsonp跨域AJAX
目录: 1.1 AJAX介绍 1.2 jQuery AJAX(第一种) 1.3 原生ajax(第二种) 1.4 iframe“伪”AJAX(第三种) 1.5 jsonp跨域请求 1.6 在tornad ...
- js中ajax如何解决跨域请求
js中ajax如何解决跨域请求,在讲这个问题之前先解释几个名词 1.跨域请求 所有的浏览器都是同源策略,这个策略能保证页面脚本资源和cookie安全 ,浏览器隔离了来自不同源的请求,防上跨域不安全的操 ...
- ajax请求ashx跨域问题解决办法
ajax请求ashx跨域问题解决办法 https://blog.csdn.net/windowsliusheng/article/details/51583566 翻译windowsliusheng ...
- 原生JavaScript封装的jsonp跨域请求
原生JavaScript封装的jsonp跨域请求 <!DOCTYPE html> <html lang="en"> <head> <met ...
- JavaScript JSON AJAX 同源策略 跨域请求
网页和Ajax和跨域的关系 1 Ajax使网页可以动态地.异步地的与服务器进行数据交互,可以让网页局部地与服务器进行数据交互 2 Ajax强调的是异步,但是会碰到跨域的问题. 3 而有很多技术可以解决 ...
- AJAX请求和跨域请求详解(原生JS、Jquery)
一.概述 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX = 异步 JavaScript 和 XML,是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数 ...
- (转)jquery ajax使用及跨域访问解决办法
原文地址:***/UIweb/jquery_ajax_kuayujiejue.html 最近开发中,设计到智能手机项目,给领导做几个demo.主要是用jquery和jqeury mobile. 越来越 ...
- Ajax【介绍、入门、解决Ajax中文、跨域、缓存】
什么是Ajax Ajax(Asynchronous JavaScript and XML) 异步JavaScript和XML Ajax实际上是下面这几种技术的融合: (1)XHTML和CSS的基于标准 ...
- JavaScript使用jsonp实现跨域
为什么要把ajax跨域写一下呢,因为ajax跨域并不是想跨就能跨的.因为为了安全,ajax是不允许跨域的. 举个例子,你有一个卖水果的网站,你的ajax请求另一个网站提供的图片,正常的时候,图片是一个 ...
随机推荐
- 提高 MySQL查询效率的方法
当涉及到提高MySQL查询效率时,以下是一些重要的策略和技巧,可以帮助你优化数据库性能.无论你是一个Web开发者.数据工程师还是系统管理员,这些方法都可以帮助你确保你的MySQL数据库运行得更快.更有 ...
- SpringBoot拦截器和动态代理有什么区别?
在 Spring Boot 中,拦截器和动态代理都是用来实现功能增强的,所以在很多时候,有人会认为拦截器的底层是通过动态代理实现的,所以本文就来盘点一下他们两的区别,以及拦截器的底层实现. 1.拦截器 ...
- 文心一言 VS 讯飞星火 VS chatgpt (107)-- 算法导论10.1 5题
五.用go语言,栈插入和删除元素只能在同一端进行,队列的插入操作和删除操作分别在两端进行,与它们不同的,有一种双端队列(deque),其插入和删除操作都可以在两端进行.写出4个时间均为 O(1)的过程 ...
- 爬虫系列——selenium
文章目录 一 介绍 二 安装 三 基本使用 四 选择器 五 等待元素被加载 六 元素交互操作 七 其他 八 项目练习 一 介绍 selenium最初是一个自动化测试工具,而爬虫中使用它主要是为了解决r ...
- PostgreSQL学习笔记-1.基础知识:创建、删除数据库和表格
PostgreSQL 创建数据库 PostgreSQL 创建数据库可以用以下三种方式:1.使用 CREATE DATABASE SQL 语句来创建.2.使用 createdb 命令来创建.3.使用 p ...
- 小米手机抓取Log教程
当小米手机遇到任何系统下的较为严重的故障时(即此时系统还是基本正常运行的,只是某些功能实现出了问题),例如软件自动退出,SD卡自动卸载,电话无法拨出等等.可以请用户协助抓取log即系统运行日志,来发送 ...
- DevOps|研发效能解决的是企业效率问题
研发效能并不能解决企业效益问题 它不是利润中心,不能给你带来直接收入(研发效能相关工具厂商做咨询.出方案.卖工具除外).想要解决企业效益问题,依赖于企业战略.业务/产品.组织.运营.创新等其他方面. ...
- 【RcoketMQ】RcoketMQ 5.0新特性(一)- Proxy
为了向云原生演进,提高资源利用和弹性能力,RcoketMQ在5.0进行了架构的调整与升级,先来看新特性之一,增加了Proxy层. 增加Proxy代理层 计算存储分离 计算存储分离是一种分层架构,将计算 ...
- Java面向对象编程的三大特性:封装、继承、多态。
一.封装 封装的核心在于私有化(private),大部分情况下,来封装对象的属性,很少有封装方法的.通过将对象的属性封装,提供对外的公共方法来访问属性是最常见的方式. public static cl ...
- docker入门加实战—部署Java和前端项目
docker入门加实战-部署Java和前端项目 部署之前,先删除nginx,和自己创建的dd两个容器: docker rm -f nginx dd 部署Java项目 作为演示,我们的Java项目比较简 ...