用flask和长轮询实现对帅哥投票和实时查看票数
flask中的代码
- from flask import Flask,request,render_template,redirect,session,jsonify
- import uuid
- import queue
- app = Flask(__name__)
- app.secret_key = 'asdfasdf'
- #定义一个字典,用于存放用户的queue 键为uuid
- USER_QUEUE = {
- }
- #在用户访问之前判断是否登录,注意这里的before_request没有括号
- @app.before_request
- def check_login():
- #如果用户访问login则直接让访问
- if request.path == '/login':
- return None
- user = session.get('user_info')
- if not user:
- return redirect('/login')
- @app.route('/login',methods=['GET',"POST"])
- def login():
- if request.method == "GET":
- return render_template('login.html')
- else:
- user = request.form.get('user')
- pwd = request.form.get('pwd')
- uid = str(uuid.uuid4()) #生成一个uuid
- USER_QUEUE[uid] = queue.Queue()
- #把用户登录信息放入到session 中去
- session['user_info'] = {'uid':uid,'name':user}
- return redirect('/index')
- #假装这是数据库,里边有数据
- GENTILEMAN = {
- '':{'name':'向龙','count':0},
- '':{'name':'霄汉','count':0},
- }
- @app.route('/index')
- def index():
- #从数据库中取出数据,返回给前端
- return render_template('index.html',gg=GENTILEMAN)
- @app.route('/get_new_count')
- def get_new_count():
- """
- 获取用户session中的uid
- 根据uid获取当前登录用的队列
- :return:
- """
- #定义一个字典,里边放着从queue中取出的数据,status为False的时候代表里边没有值,让前端继续过来 长轮询
- ret = {'status':True,'data':None }
- uid = session['user_info']['uid']
- q = USER_QUEUE[uid] #在字典中取出用户的queue
- try:
- #视图从queue中取出数据,最多等10秒 长轮询之 夯住操作,一直在等queue中是否能取出数据,取出去之后直接返回,或是10秒之后没有的话返回数据,
- data = q.get(timeout=10)
- ret['data'] = data
- #如果queue中被取空的话,报错
- except queue.Empty as e:
- ret['status'] = False
- return jsonify(ret)
- @app.route('/vote',methods=['POST'])
- def vote():
- """
- 接收用户请求,对帅哥进行投票
- :return:
- """
- gid = request.form.get('gid')
- old = GENTILEMAN[gid]['count']
- new = old + 1
- GENTILEMAN[gid]['count'] = new
- data = {'gid':gid,'count':new}
- for q in USER_QUEUE.values():
- q.put(data)
- return 'OK'
- if __name__ == '__main__':
- app.run(host='0.0.0.0',threaded=True)
index.html的代码
- <!DOCTYPE html>
- <html lang="zh-cn">
- <head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <title>Title</title>
- </head>
- <body>
- <h1>请选出最帅的男人</h1>
- <ul>
- {% for k,v in gg.items() %}
- <li style="cursor: pointer" id="user_{{ k }}" ondblclick="vote({{ k }});">ID:{{ k }}, 姓名:{{ v.name }} ,票数:<span>{{ v.count }}</span></li>
- {% endfor %}
- </ul>
- <script src="/static/jquery-3.3.1.min.js"></script>
- <script>
- #一放问网页就执行此函数
- $(function () {
- get_new_count();
- });
- function get_new_count() {
- $.ajax({
- url: '/get_new_count',
- type:'GET',
- dataType:'JSON',
- success:function (arg) {
- if (arg.status){
- // 更新票数
- var gid = "#user_" + arg.data.gid;
- $(gid).find('span').text(arg.data.count);
- }else{
- // 10s内没有人投票
- }
- #这里于后端的 夯住实现了长轮询
- get_new_count();
- }
- })
- }
- function vote(gid) {
- $.ajax({
- url: '/vote',
- type:'POST',
- data:{gid:gid},
- dataType:"JSON",
- success:function (arg) {
- }
- })
- }
- </script>
- </body>
- </html>
使用redis
brpop() 方法取不出数据的话返回的是None 不会报错
用flask和长轮询实现对帅哥投票和实时查看票数的更多相关文章
- http长轮询&短轮询
http 协议介绍: http 协议是请求/响应范式的, 每一个 http 响应都是由一个对应的 http 请求产生的; http 协议是无状态的, 多个 http 请求之间是没有关系的. http ...
- HTTP长轮询和短轮询
http 协议介绍: http 协议是请求/响应范式的, 每一个 http 响应都是由一个对应的 http 请求产生的; http 协议是无状态的, 多个 http 请求之间是没有关系的. http ...
- 10分钟学会web通讯的四种方式,短轮询、长轮询(comet)、长连接(SSE)、WebSocket
一般看到标题我们一般会产生下面几个问题??? 什么是短轮询? 什么是长轮询? 长连接又是什么? wensocket怎么实现呢? 他们都能实现web通讯,区别在哪呢,哪个好用呢? 接下来我们就一个个来了 ...
- 轮询、长轮询和websocket
一.轮询 在一些需要进行实时查询的场景下应用比如投票系统: 大家一起在一个页面上投票 在不刷新页面的情况下,实时查看投票结果 1.后端代码 from flask import Flask, rende ...
- 轮询、长轮询、websock
引入 Web端即时通讯技术:即时通讯技术简单的说就是实现这样一种功能:服务器端可以即时地将数据的更新或变化反应到客户端,例如消息即时推送等功能都是通过这种技术实现的.但是在Web中,由于浏览器的限制, ...
- python之轮询、长轮询、websocket
轮询 ajax轮询 ,ajax轮询 的原理非常简单,让浏览器隔个几秒就发送一次请求,询问服务器是否有新信息. 1.后端代码 from flask import Flask,render_templat ...
- 你想了解的轮询、长轮询和websocket都在这里了
日常生活中,有很多需要数据的实时更新,比如群聊信息的实时更新,还有投票系统的实时刷新等 实现的方式有很多种,比如轮询.长轮询.websocket 轮询 轮询是通过设置页面的刷新频率(设置多长时间自动刷 ...
- WebSocket知识、轮询、长轮询、长连接
一.WebSocket理论知识 1.什么是websocket WebSocket是HTML5新增的协议,它的目的是在浏览器和服务器之间建立一个不受限的双向通信的通道,比如说,服务器可以在任意时刻发送消 ...
- python 轮询,长轮询
轮询相关 用于消息和投票等 轮询 1.采用js 定时请求. html <!DOCTYPE html> <html lang="zh-CN"> <hea ...
随机推荐
- java的类class 和对象object
java 语言的源代码是以类为单位存放在文件中,已public修饰的类名须和存放这个类的源文件名一样.而 一个源文件中只能有一个public的类,类名的首字母通常为大写. 使用public修饰的类可以 ...
- [Leetcode 100]判断二叉树相同 Same Tree
[题目] 判断二叉树是否相同. [思路] check函数. p==null并且q==null,返回true;(两边完全匹配) p==null或q==null,返回false;(p.q其中一方更短) p ...
- core net 2 nuget的数据源包
基本都是 在 obj里面 debug里面 porgect.assetc.json
- python笔记7-if中的is ;in ;not搭配用法
names="111 222 333" print("111" in names)#返回的是True,用in返回的是布尔值in在里面 print("1 ...
- string使用方法
转载自:https://blog.csdn.net/tengfei461807914/article/details/52203202 使用场合: string是C++标准库的一个重要的部分,主要用于 ...
- 给定两个数组,这两个数组是排序好的,让你求这两个数组合到一起之后第K大的数。
题目:给定两个数组,这两个数组是排序好的,让你求这两个数组合到一起之后第K大的数. 解题思路: 首先取得数组a的中位数a[aMid],然后在b中二分查找a[aMid],得到b[bMid],b[bSt] ...
- nginx的日志切割
nginx日志默认情况下统统写入到一个文件中,文件会变的越来越大,非常不方便查看分析.以日期来作为日志的切割是比较好的,通常我们是以每日来做统计的.下面来说说nginx日志切割. 如果我们使用的是yu ...
- Homebrew&Mongod
Homebrew官网:http://brew.sh Homebrew installs the stuff you need that Apple didn't Homebrew的安装非常简单,打开终 ...
- Fatal error: Call to undefined function mb_strlen()
php配置的时候出现:Fatal error: Call to undefined function mb_strlen() 表示php不能加载mbstring模块,在php 的配置文件php.in ...
- 一种安装openslide的简易方法
直接百度谷歌搜索可能需要手动编译安装,能不能用通过一两句命令行的方式安装openslide?网上给出的教程确实都是通过源安装python-openslide,实际上这样安装,即使安装很多依赖库之后仍然 ...