有这么一个场景：服务端处理数据，响应比较慢，为了不让用户体会到网页没有反应，服务端需要把处理的每一步操作返回给前端，前端实时进行打印。

1.ajax 轮询

<script>

    setInterval("test()",2000);

    function test() {

        $.ajax({

            url: '/new_window_url/',

            async:false,

            type: 'get',

            success: function (data) {

                console.log(data)

            }

        })

    }

</script>

2.EventSource 长链接

前端代码：

<!doctype html>

<html lang="en">

<head>

    <title>Sse测试文档</title>

    <meta charset="utf-8">

    <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>

     <script src="https://cdn.bootcss.com/event-source-polyfill/0.0.9/eventsource.min.js"></script>

</head>

<body>

    <div></div>

</body>

</html>

<script>

    var source = new EventSource('http://127.0.0.1:8080/event/query');

    //只要和服务器连接，就会触发open事件

        source.addEventListener("open",function(){

           console.log("和服务器建立连接");

        });

        //处理服务器响应报文中的load事件

        source.addEventListener("load",function(e){

            console.log("服务器发送给客户端的数据为:" + e.data);

        });

        //如果服务器响应报文中没有指明事件，默认触发message事件

        source.addEventListener("message",function(e){

            console.log("服务器发送给客户端的数据为:" + e.data);

        });

        //发生错误，则会触发error事件

        source.addEventListener("error",function(e){

            console.log("服务器发送给客户端的数据为:" + e.data);

        });

</script>

服务端代码：

package com.example.demo;

import org.springframework.boot.SpringApplication;

import org.springframework.boot.autoconfigure.SpringBootApplication;

import org.springframework.web.bind.annotation.CrossOrigin;

import org.springframework.web.bind.annotation.RequestMapping;

import org.springframework.web.bind.annotation.ResponseBody;

import org.springframework.web.bind.annotation.RestController;

import javax.servlet.http.HttpServletResponse;

import java.io.IOException;

import java.io.PrintWriter;

import java.util.Date;

@SpringBootApplication

@RestController

@RequestMapping("event")

public class DemoApplication {

    public static void main(String[] args) {

        SpringApplication.run(DemoApplication.class, args);

    }

    @ResponseBody

    @CrossOrigin

    @RequestMapping(value="query")

    public void query(HttpServletResponse response) throws IOException, InterruptedException {

        response.setHeader("Content-Type","text/event-stream");

        response.setContentType("text/event-stream;charset=utf-8");

        PrintWriter out = response.getWriter();

        out.println("data:Hello World");

        out.println("event:load");

        out.println("id:140312");

        out.println();

        out.flush();

        out.close();

    }

}

js EventSource 长链接的更多相关文章

  1. http长链接

    之前说过http的请求是再tcp连接上面进行发送的,那么tcp连接就分为长连接 和 短连接这样的概念,那么什么是长链接呢?http请求发送的时候要先去创建一个tcp的连接,然后在tcp的连接上面发送h ...

  2. python+uwsgi导致redis无法长链接引起性能下降问题记录

    今天在部署python代码到预生产环境时,web站老是出现redis链接未初始化,无法连接到服务的提示,比对了一下开发环境与测试环境代码,完全一致,然后就是查看各种日志,排查了半天也没有查明是什么原因 ...

  3. PHP实现新浪长链接转化成短链接API

    我们经常收到类似于这样的短信(如下图),发现其中的链接并不是常规的网址链接,而是个短小精悍的短链接,产品中经常需要这样的需求,如果在给用户下发的短信中是一个很长的连接,用户体验肯定很差,因此我们需要实 ...

  4. 长链接转换成短链接（iOS版本）

    首先需要将字符串使用md5加密,添加NSString的md5的类别方法如下 .h文件 #import <CommonCrypto/CommonDigest.h> @interface NS ...

  5. android 实现与服务器的长链接 方式

    http://blog.csdn.net/coffeeco/article/details/13276437  这边文章主要看服务端,使用tomcat7以上实现服务端的接收消息以及消息发送 http: ...

  6. mariadb 长链接时间限制导致队列消费进程崩溃

    项目是一个数据同步项目,线下Android客户端把本地sqllite数据提交到云端队列,php做守护进程消费队列,以同步数据.初测没有问题,可是时不时出现诡异的崩溃,因为设置了错误邮件报警,发现错误代 ...

  7. 纯Socket(BIO)长链接编程的常见的坑和填坑套路

    本文章纯属个人经验总结,伪代码也是写文章的时候顺便白板编码的,可能有逻辑问题,请帮忙指正,谢谢. Internet(全球互联网)是无数台机器基于TCP/IP协议族相互通信产生的.TCP/IP协议族分了 ...

  8. 微信公众号开发C#系列-10、长链接转短链接

    1.概述 短网址的好处众多,便于记忆,占用字符少等,现在市面上出现了众多的将长网址转变为短网址的方法,但是由于他们都是小的公司在幕后运营,所以很不靠谱,面对随时关闭服务的可能,这样也导致我们将转换好了 ...

  9. django模型层优化(关联对象) 懒加载和预加载 +长链接

    懒加载 存在于外键和多对多关系不检索关联对象的数据调用关联对象会再次查询数据库 问题根源 查看django orm的数据加载,两次. 查询user,查询menu 预加载的方法 预加载单个关联对象--s ...

随机推荐

  1. RepVGG

    RepVGG: Making VGG-style ConvNets Great Again 作者:elfin   资料来源:RepVGG论文解析 目录 1.摘要 2.背景介绍 3.相关工作 3.1 单 ...

  2. Python爬虫系列之爬取美团美食板块商家数据（二）

    今天为大家重写一个美团美食板块小爬虫,说不定哪天做旅游攻略的时候也可以用下呢.废话不多说,让我们愉快地开始吧~ 开发工具 Python版本:3.6.4 相关模块: requests模块: argpar ...

  3. java例题_14 该日期一年中的第几天问题

    1 /*14 [程序 14 求日期] 2 题目:输入某年某月某日,判断这一天是这一年的第几天? 3 程序分析:以 3 月 5 日为例,应该先把前两个月的加起来,然后再加上 5 天即本年的第几天,特殊情 ...

  4. 热更新基础--AssetBundle学习笔记

    一.简介 AssetBundle简称AB包,特定平台的资产压缩包(包括模型.贴图.预设体.音效.材质球等资产). 作用:Resources下的资源只读且打包后不可修改,而AB包存储位置自定,后期可以动 ...

  5. 去空格的四则运算表达式求值-Java

    笔记 package com.daidai.day4.demo1; import java.util.ArrayList; import java.util.Arrays; import java.u ...

  6. redis常用数据类型对应的数据结构

    redis的数据类型都是通过多种数据结构来实现,主要是出于时间和空间的考虑,当数据量小的时候通过数组下标访问最快,占用内存最小[压缩列表是数组的变种,允许存储的数据大小不同] 因为数组需要占用连续的内 ...

  7. OOJML系列总结

    目录 0x0 JML理论相关 0.0 概念及作用 0.1 JML语法学习 0x1 使用openJml以及JMLUnitNG 1.0 使用openjml 1.1使用JMLUnitNG 0x2 作业架构设 ...

  8. [开源]制作docker镜像不依赖linux和Docker环境

    背景 最近群友们经常反馈docker镜像制作起来有点麻烦,我开源的antdeploy工具虽然可以制作镜像但是必须有一个提前:有一台安装好docker的linux服务器.因为大家开发环境基本上都是win ...

  9. 次小生成树 详解及模板 （仅kruskal）

    思路 关于次小生成树,首先求出最小生成树,然后枚举每条不在最小生成树上的边(在原本的节点上添加一个vis属性进行判断即可),并把这条边放到最小生成树上面,然后就一定会形成环,那么我们在这条环路中取出一 ...

  10. matlab结构体、数组和单元数组类型的创建

    matlab结构体.数组和单元数组类型的创建 @ 目录 matlab结构体.数组和单元数组类型的创建 matlab结构体类型 数组类型 单元数组类型 matlab结构体类型 通过字段赋值创建结构体 创 ...