Javascript Ajax总结——其他跨域技术之服务器发送事件SSE

SSE(server-Sent Events,服务器发送事件)是围绕只读Comet交互推出的API或者模式。

SSE API创建到服务器的单向连接,服务器通过这个连接可以发送任意数量的数据。服务器响应的MIME类型必须是text/event-stream,是浏览器中的JavascriptAPI能解析输出的格式。SSE支持短轮询、长轮询和HTTP流,能在断开连接时自动确定何时重新连接。
支持SSE的浏览器:Firefox6+、Safari5+、Opera11+、Chrome、iOS4+版Safari。

(1)SSE API创建一个EventSource事件,传进一个入口点:    var source = new EventSource("myevents.php");

传入的URL必须与创建对象的页面同源(相同的URL模式、域及端口)。

EventSource的实例有一个readyState属性:    0:表示正连接到服务器;    1:表示打开了连接;    2:表示关闭了连接。

三个事件:    * open:在建立连接时触发。    * message:在从服务器接收到新事件时触发。    * error:在无法建立连接时触发。

onmessage事件处理程序:

1 source.onmessage = function(){
2     var data = event.data;
3     //处理数据
4     //数据是字符串格式
5 }
默认情况下,EventSource对象会保持与服务器的活动连接。如果连接断开,还会重新连接。这意味着SSE适合长轮询和HTTP流。如果想强制立即断开连接并且不再重新连接,可以调用close()方法。

source.close();

(2)事件流所谓的服务器事件会通过一个持久的HTTP响应发送,这个响应的MIME类型为text/event-stream。响应的格式是纯文本,最简单的情况是每个数据项都带有前缀data:,如:

    data: foo

    data: bar

    data: foo    data: bar

事件流中的第一个message事件返回的event.data值为“foo”,第二个message事件返回的event.data值为“bar”,第三个message事件返回的event.data值为“foo\nbar”。对于多个连续的以data:开头的数据行,将作为多段数据解析,每个值之间以一个换行符分隔。只有在包含data:的数据行后面有空行时,才会触发message事件,因此在服务器上生成事件流时不能忘了多添加这一行。

通过id:前缀可以给特定的事件指定一个关联的ID,这个ID行位于data:行前面或后面皆可:

    data: foo    id: 1

设置ID后,EventSource对象会跟踪上一次触发的事件。如果连接断开,会向服务器发送一个包含名为Last-Event-ID的特殊HTTP头部的请求,以便服务器指定下一次该触发哪一个事件。在多次连接的事件流中,这种机制可以确保浏览器以正确的顺序收到连接的数据段。

原文地址:https://www.cnblogs.com/wuxxblog/p/11148334.html

时间: 2024-08-29 09:58:52

Javascript Ajax总结——其他跨域技术之服务器发送事件SSE的相关文章

一日一练-JS 了解几种跨域技术

子曰:了解几种跨域机制 简单介绍 首先简单了解一下同源策略相关知识点: 1.同源策略 限制了从一个源加载的文档或脚本如何与来自另一个源的资源进行交互.这是一个用于隔离潜在恶意文件的重要机制. 2.源的定义:如果两个页面的协议.端口和域名都相同,则两个页面具有相同的 源 3.同源策略规定,是XHR 实现Ajax 通信的一个主要限制.默认情况下,XHR 对象只能访问与包含它的页面位于同一个域中的资源.这种安全策略可以预防某些恶意行为.但是,实现合理的跨域请求对开发某些浏览器应用程序也是至关重要的.

同源策略与跨域技术

待整理:1-2参见<JavaScript高级程序设计>P586;3-5参见http://mp.weixin.qq.com/s/asmzA8a1HuYQxyx8K0q-9g 一.同源策略 https://developer.mozilla.org/zh-CN/docs/Web/Security/Same-origin_policy 浏览器的同源策略限制了 从一个源加载的文档或脚本与来自另一个源的资源的交互.它是隔离潜在恶意文档的关键安全机制. 具体限制: 不能通过ajax的方法去请求不同源的资源

js中ajax如何解决跨域请求

js中ajax如何解决跨域请求,在讲这个问题之前先解释几个名词 1.跨域请求 所有的浏览器都是同源策略,这个策略能保证页面脚本资源和cookie安全 ,浏览器隔离了来自不同源的请求,防上跨域不安全的操作. 跨域指的协议.域名.端口 有一个不同的情况下都是跨域 例:在本站点请求外站的数据是不允许的 //在本站点请求外站点的资源是不允许的 $(function () { $.ajax({ url: "http://127.0.0.1:14847/Web/jsonp.js", success

笔记-Ajax[4]-JSONP跨域获取数据。

JS的跨域:跨域名获取数据,a域名获取b域名中的数据. 解决跨域获取数据的方法也叫JSONP(JSON and Padding) JSONP方法: 1:服务器代理:XMLHttpRequest代理文件 2:script标签:jsonp(常用);//利用script标签的src引入外部文件的功能,src能够引入任何的文件的类型 3:location.hash方式:iframe 4:window.name方式 5:flash方式 6:html5的postMessage方式 例子:百度输入数据下拉框提

PHP AJAX JSONP实现跨域请求使用实例

在之前我写过“php返回json数据简单实例”,“php返回json数据中文显示的问题”和“在PHP语言中使用JSON和将json还原成数组”.有兴趣的童鞋可以看看 今天我写的是PHP AJAX JSONP使用的实例.不清楚jsonp是什么的请自己搜索 实例1 test.html <!doctype html> <html> <head> <meta charset="utf-8"> <title>test</title

mpls-vpn跨域技术-单跳MBGP

PE-ASBR对等体之间建立单跳的MP-EBGP邻接体,传递VPN-IPV4路由,不运行IGP和LDP. PE-ASBR对等体之间传递私网路由时,因为EBGP邻居关系,需要改变路由的下一跳,所以需要交换内层标签. 接收端PE-ASBR,可以使用next-hop-local命令,强制修改路由的下一跳,同时再次交换内层标签,通告给MP-IBGP邻居.如果没有配置next-hop-local命令,需要把direct路由重分布(import-route)到IGP中. PE-ASBR路由器上需要保存所有域

关于AJAX请求的跨域问题以及JSONP的示例

一般情况下出于安全考虑,ajax是不能跨域请求的,只能请求本服务器的数据,即同源请求,但完事皆有可能,处于对开发的要求越来越复杂,跨域请求这种事情当然是可以解决的,下面即是转载自一位大佬的随笔 链接:https://www.cnblogs.com/caijunjun/p/6665317.html 看了上篇文章后,肯定是还有点晕的,毕竟介绍的比较多,但是讲的还是比较简单的,下面这篇文章则是一位大佬写的关于JSONP的跨域请求的示例 链接:http://blog.csdn.net/u01460718

AJAX请求和跨域请求详解(原生JS、Jquery)

一.概述 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX = 异步 JavaScript 和 XML,是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新.传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面. 本博客实验环境: python:2.7.11 web框架:tonado jquery:2.1.1 二.“伪”AJAX 由于

Ajax请求WebService跨域问题

1.背景 用Jquery中Ajax方式在asp.net开发环境中WebService接口的调用 2.出现的问题 原因分析:浏览器同源策略的影响(即JavaScript或Cookie只能访问同域下的内容); 3.解决方案: (1) JSONP:只支持GET方式 (2) CROS:跨域资源共享 以下为CROS解决方案: a.在WebService接口加上响应头信息: b.在web.config文件中加上相关配置节信息: 运用a或者b的解决方案后,浏览器头信息中变动如下: 最终问题得以较好的解决,但对