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请求另一个网站提供的图片,正常的时候,图片是一个 ...
随机推荐
- 深入理解RocketMQ 广播消费
这篇文章我们聊聊广播消费,因为广播消费在某些场景下真的有奇效.笔者会从基础概念.实现机制.实战案例.注意事项四个方面一一展开,希望能帮助到大家. 1 基础概念 RocketMQ 支持两种消息模式:集群 ...
- Vue2系列(lqz)——Vue介绍
文章目录 Vue入门 零:前端目前形势 前端的发展史 一:Vue介绍 和 基本使用 1.Vue介绍 渐进式框架 网站 2.Vue特点 易用 灵活 高效 3.M-V-VM思想 ① MVVM介绍 ② MV ...
- 自己把源码生成jar,在android项目中调用
项目源码下载地址 看了很多,找了很多,都是没有自己想要的效果的,不容易啊,备注下吧. 1.自己的源码 ,java文件,里边有各种方法,生成jar,可以分享给别人使用. 2.目前主要验证在android ...
- Jmeter将响应数据的结果保存到本地的一个文件(xls和csv)
打印excel和csv文件的区别?? 第一种:打印excel 第二种:打印csv文件 创建beanshell后置处理器 import org.json.*;import java.io.*; Str ...
- 从输入URL到页面加载完都发生了什么
1.浏览器的地址栏输入URL并按下回车. 2.浏览器查找当前URL是否存在缓存,并比较缓存是否过期. 3.DNS解析URL对应的IP. 4.根据IP建立TCP连接(三次握手). 5.HTTP发起请求. ...
- Java替换RequestBody和RequestParam参数的属性
Java替换RequstBody和RequestParam参数的属性 本文主要讲解在Java环境中如何替换RequestBody和RequestParam参数中的属性 背景 近期由于接手的老项目中存在 ...
- 拒绝恶意IP登录服务器
拒绝恶意IP登录服务器,并加入防火墙黑名单 #!/bin/bash #2020-03-20 16:39 #auto refuse ip dlu #By Precious ############### ...
- 使用 Appilot 部署 Llama2,会聊天就行!
Walrus 是一款基于平台工程理念的应用管理平台,致力于解决应用交付领域的深切痛点.借助 Walrus 将云原生的能力和最佳实践扩展到非容器化环境,并支持任意应用形态统一编排部署,降低使用基础设施的 ...
- JUC并发编程学习笔记(十二)Stream流式计算
Stream流式计算 什么是Stream流式计算 大数据:存储+计算 集合.MySql这些的本质都是存储东西的: 计算都应该交给流来操作! 一个案例说明:函数式接口.lambda表达式.链式编程.St ...
- Android反编译之修改应用包名
前言 近期看B站数码区这条视频 [大米]破处理器,它能行吗?K50电竞版评测_哔哩哔哩_bilibili 时,发现了UP主的一个比较骚的操作: 嗯?apk文件可以直接拿来使用修改包名的?作为 Andr ...