Python-S9-Day123——爬蟲兩示例

時間 2019-11-30

標籤 python s9 day123 day 爬蟲示例欄目 Python 简体版

原文原文鏈接

01 今日內容回顧
02 內容回顧和補充:面向對象約束
03 爬蟲之抽屜新熱榜
04 爬蟲之抽屜自動登陸(一)
05 爬蟲之抽屜自動登陸(二)
06 爬蟲之登陸github(一)
07 爬蟲之登陸github(二)
08 爬蟲之登陸拉鉤
09 上述內容總結
10 requests模塊詳解(一)
11 requests模塊詳解(二)
12 requests模塊詳解(三)
13 bs4模塊簡述
14 9期最醜的男人：輪詢
15 9期最醜的男人：長輪詢
16 今日總結

01 今日內容回顧

1.1 requests；

1.2 bs4（必定是bs4版本）；

1.3 輪詢/長輪詢（消息隊列相關知識）；

02 內容回顧和補充:面向對象約束

2.1 Flask上下文管理機制;

2.2 爲何要使用上下文管理機制呢？

2.3 爲何要用Local呢？

2.4 LocalStack維護成棧

2.5 視圖函數中使用:request/session/g/current_app

2.6 請求上下文和應用上下文要先放到local中才能使用；

2.7 離線腳本;

2.8 面向對象的認知；

　　2.8.1編程範式——面向對象和麪向過程；

2.9 約束;

　　2.9.1 Java和C#中的接口：約定子類中必須包含某個方法；

　　2.9.2 抽象方法/抽象類:約束子類中必須包含某個方法；

　　2.9.3 Python沒有接口，可是有抽象方法、抽象類（ABC實現）；

　　2.9.4 Python中類的約束是以類的繼承+raise NotImplementedError來僞造抽象類；

　　2.9.5 告知他人如何使用，本身開發時候，如何使用呢？約束別人寫代碼的時候，遵循規範標準;

03 爬蟲之抽屜新熱榜

3.1 博文參考;

https://www.cnblogs.com/wupeiqi/articles/6283017.htmlcss

3.2 requests模擬瀏覽器請求，bs4解析字符串;

3.3 爬取抽屜新熱榜；

import requests
from bs4 import BeautifulSoup

###########################示例1：爬出數據(攜帶請求頭)################################
r1 = requests.get(
    url="https://dig.chouti.com/",
    headers={
        'user-agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.81 Safari/537.36'
    }
)
soup = BeautifulSoup(r1.text, 'html.parser')
# 標籤對象;
content_list = soup.find(name='div', id='content-list')
# [標籤對象，標籤對象]
item_list = content_list.find_all(name='div', attrs={'class': 'item'})
for item in item_list:
    a = item.find(name='a', attrs={'class': 'show-content color-chag'})
    print(a.text.strip())

/Users/cuixiaozhao/PycharmProjects/s9/s9day123/venv/bin/python /Users/cuixiaozhao/PycharmProjects/s9/s9day123/爬取抽屜新熱榜.py
【段子】    
                                                    
                                                                                                        
                                                    感人
《只狼 影逝二度》公佈主視覺圖（圖5），明年3月22日，是朋友就來跟我死兩次！
馬雲明年交棒張勇，阿里巴巴低開2.3%
兩部門：增強網約車和順風車平臺駕駛員背景覈查；整改完成前，滴滴等平臺無限期中止順風車服務
是個狠人！
@金融圈女神經：在房產羣裏看到一個拷問靈魂的問題：假設你在上海中環內有套90平米的老破小，夫妻二人35-40歲，稅後合計三四萬（月薪），家有幼兒，父母在外地，你會選擇:1.吃好喝好穿好，小孩上私立，偶爾出趟國？仍是2.節衣縮食，置換一套大房子或者買二套？不討論2016年，也不討論2020年，只討論此時此刻。
【目睹者還原網紅毆打孕婦：她說這種孕婦生下來的小孩也不是什麼好種】9月7日，浙江杭州，楊女士稱，本身懷孕32周被網紅@Saya一（陳某伊）打罵致先兆早產，打人者在微博上擁有300多萬粉絲。楊女士稱，當晚她看到一隻沒牽繩的法鬥犬朝本身撲來，丈夫用腳推了狗一下，陳某伊便與本身和丈夫發生爭執，期間還辱罵本身並動手。
肉肉女孩，ins：juasicko
那些遊戲報錯畫面中隱藏的「遊戲」
房企銷售宣傳的慣用套路，目瞪口呆！
【高盛解讀：如何看待中國消費放緩】高盛認爲，非官方統計的中國消費數據相對官方口徑更加悲觀，是由於前者並未考慮到消費者的消費習慣正由線下轉向線上。在高盛看來，中國商品消費疲軟的「罪魁禍首」是消費信貸增加放緩和債務負擔進一步走高。
騰訊投資併購部迴應「投資子彈短信」：未說起投資事宜，只曾在微信上有簡短溝通
2018維密名單公佈：何穗、陳瑜複試經過，奚夢瑤免試保送
【全球首個海洋垃圾系統下海，背後的 Ocean Cleanup 創始人僅24歲】Boyan Slat 是荷蘭人，16歲在希臘潛水的時候，發現海洋裏的塑料比魚多，回國後就開始研究海洋垃圾。17歲在TEDx演講，講述本身創新的洋流垃圾收集系統。19歲便成立公司，專一實現本身清理海洋垃圾的夢想。
【段子】    
                                                    
                                                                                                        
                                                    看了一個神劇的劇本，看到一半就看不下去了，女主要過檢查站傳遞絕密信息，既要帶信息過去又不能被鬼子看出來，特工隊領導教她密碼技術，在竹籃那編不一樣色塊的竹篾，勞資一看媽的這不就是二維碼技術嗎，這已經不是神劇的問題了，這是瞎幾把亂編的問題，萬一鬼子同時摸出條碼槍怎麼辦，很氣憤，亂寫(@神嘛事兒)
北京高校化糞池爆炸污染水源致學生腹瀉？校方否定
2018年的俄羅斯產共黨
【網秦創始人林宇發文稱遭董事長史文勇綁架 受到非人折磨】今日，網秦發佈公告，任命網秦創始人林宇接任網秦CEO，並擔任聯席董事長。林宇還在朋友圈曬出《立案告知書》照片，併發文稱本身遭原網秦董事長史文勇綁架，期間受到非人折磨，九死一輩子。
韓春雨被曝早年自稱代筆博士論文收費七千，還欲讓學生買論文
生日快樂鴨！兩隻鴨鴨迎來了它們的2歲生日，鏟屎官劈了半個大西瓜，用青瓜當蠟燭，用蘋果作了個「2」給它們慶生
【91歲教師守候留守兒童：只要我有口氣，不會讓他們念不起書】91歲的葉老師教英語已經40年了，退休後他自費辦「留守兒童之家」，爲留守兒童無償補課18年，至今仍堅持上課、批改做業。他說：」我願意個人最後一口氣，是在講臺上呼出去的。」
沒學歷的男友送外賣我該不應和他分手？
當我試圖幫助別人……
【百度迴應「搜索品牌官網、公立醫院問題」】當網民使用百度搜索時，如遭遇搜索推廣結果中因假冒、釣魚欺詐等網站受到損失，只要提供相關證據，百度將不設上限進行「全額」先行保障。
【侍魂歸來、名越稔洋帶來新做，Playstation直播活動信息彙總】索尼Playstation LineUp Tour已經結束，活動上出現了不少使人激動的新遊戲。《侍魂》新做、名越稔洋的《Judge Eyes 死神遺言》、《銃墓》新做、《噬神者3》等等。

Process finished with exit code

04 爬蟲之抽屜自動登陸(一)

2.1 登陸爬取；

import requests
from bs4 import BeautifulSoup

###########################示例1：爬出數據(攜帶請求頭)################################
r1 = requests.get(
    url="https://dig.chouti.com/",
    headers={
        'user-agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.81 Safari/537.36'
    }
)
soup = BeautifulSoup(r1.text, 'html.parser')
# 標籤對象;
content_list = soup.find(name='div', id='content-list')
# [標籤對象，標籤對象]
item_list = content_list.find_all(name='div', attrs={'class': 'item'})
for item in item_list:
    a = item.find(name='a', attrs={'class': 'show-content color-chag'})
    print(a.text.strip())

2.2 點贊（反爬蟲驗證）;

###########################示例2：點贊(攜帶請求頭)################################
# 1. 查看首頁；
import requests

r1 = requests.get(
    url='https://dig.chouti.com/',
    headers={
        'user-agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.81 Safari/537.36'
    }
)
print(r1.cookies)
# 2. 提交用戶名和密碼, 發送post請求;
r2 = requests.post(
    url='https://dig.chouti.com/login',
    headers={
        'user-agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.81 Safari/537.36'
    },
    data={
        'phone': '8613811221893 ',
        'password': '19930911cxs.',
        'oneMonth': 1
    },
    cookies=r1.cookies.get_dict()
)
print(r2.text)  # {"result":{"code":"9999", "message":"", "data":{"complateReg":"0","destJid":"ctu_52518370025"}}}
print("拿到抽屜網站返回的cookies",
      r2.cookies.get_dict())  # 拿到抽屜網站返回的cookies {'gpsd': '4f535c2cce5ff030aeb4a2d2e94816b1', 'puid': 'a5308883c2de1e61b40dc7ddb850d385', 'JSESSIONID': 'aaajHz9vNpOEMdfzWjYww'}

# 3. 進行點贊;
r3 = requests.post(
    url='https://dig.chouti.com/link/vote?linksId=22010751',
    headers={
        'user-agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.81 Safari/537.36'
    },
    cookies=r1.cookies.get_dict()
)
print(r3.text)  # {"result":{"code":"30010", "message":"你已經推薦過了", "data":""}}

05 爬蟲之抽屜自動登陸(二)

06 爬蟲之登陸github(一)

#######################示例三:自動登陸github#########################################
# 一、GET:登陸訪問頁面;
""
'''
- 去HTML中找到隱藏的input標籤，獲取相似於csrf_token;
- 獲取cookie;
'''
# 二、發送post請求，用戶名和密碼;
'''
- 發送數據;
    -csrf；
    -用戶名；
    -密碼；
- 攜帶cookie
'''

# 三、GET，訪問https://github.com/settings/emails
'''
- 攜帶cookie
'''

07 爬蟲之登陸github(二)

08 爬蟲之登陸拉鉤

8.1 Referer頭，是上一次請求的地址，可用於作圖片防盜鏈;

import requests
import re

r1 = requests.get(
    url='https://passport.lagou.com/login/login.html',
    headers={
        'User-Agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.81 Safari/537.36',

    },
)
X_Anti_Forge_Token = re.findall("X_Anti_Forge_Token = '(.*?)'", r1.text, re.S)[0]
X_Anti_Forge_Code = re.findall("X_Anti_Forge_Code = '(.*?)'", r1.text, re.S)[0]
#print(X_Anti_Forge_Token, X_Anti_Forge_Code)
# print(r1.text)

r2 = requests.post(
    url='https://passport.lagou.com/login/login.json',
    headers={
        'User-Agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.81 Safari/537.36',
        'X-Anit-Forge-Code': X_Anti_Forge_Code,
        'X-Anit-Forge-Token': X_Anti_Forge_Token,
        'X-Request-With': 'XMLHttpRequest',
        'Referer': 'https://passport.lagou.com/login/login.html',
    },
    data={
        'isValidate': True,
        'username': '13811221893',
        'password': '69de96af1d1ed394c2b9dafc5f441a60',
        'request_form_verifyCode': ' ',
        'submit': '',
    },
    cookies = r1.cookies.get_dict()
)
print(r2.text)
'''
{"content":{"rows":[]},"message":"操做成功","state":1,"submitCode":87998714,"submitToken":"6dc215ff-4476-42b2-b3aa-e84e5a14cae5"}
'''

09 上述內容總結

s9day123 

內容回顧：
    第一部分：Flask
        1. flask上下文管理機制

            切記：不要說詳細
        2. Local的做用？
        
        3. LocalStack維護成棧
        
        4. 視圖函數中使用：request/session/g/current_app
            
            注意：請求上下文和應用上下文須要先放入Local中，才能獲取到。
                # by luffycity.com

                from flask import Flask,current_app,request,session,g


                app = Flask(__name__)

                # 錯誤
                # print(current_app.config)

                @app.route('/index')
                def index():
                    # 正確
                    print(current_app.config)
                    
                    return "Index"

                if __name__ == '__main__':
                    app.run()

        5. 離線腳本
        
            from chun import db,create_app
            from flask import current_app

            # 錯誤
            # print(current_app.config)

            # app = create_app()
            # app_ctx = app.app_context()
            # with app_ctx:
            #     # 正確
            #     print(current_app.config)
    
    第二部分：面向對象
        1. 談談你對面向對象的認識。
        
        2. 約束 
            Java: 
                - 接口，約子類中必須包含某個方法（約束）。
                    Interface IMessage:
                        def func1(self):
                            pass 
                        def func2(self):
                            pass 
                            
                    class Msg(IMessage):
                        def func1(self):
                            print('func1') 
                        def func2(self):
                            print('func1') 
                
                - 抽象方法/抽象類，約子類中必須包含某個方法。(約束+繼承)
                    class abstract IMessage:
                        def abstract func1(self):
                            pass 
                        def abstract func2(self):
                            pass 
                        
                        def func3(self):
                            print('asdfasdf') 
                            
                    class Msg(IMessage):
                        def func1(self):
                            print('func1') 
                        def func2(self):
                            print('func1') 
            
            Python：
                - 接口（無）
                - 抽象方法/抽象類（有，ABC）
                
                - 類繼承+異常
                    
                    class IMessage(object):

                        def func1(self):
                            raise NotImplementedError('子類沒有實現func1方法')


                    class Msg(IMessage):
                        def func1(self):
                            print('123')


                    obj = Msg()
                    obj.func1()
                    
            有什麼用？用於告知其餘人之後繼承時，須要實現那個方法，如：
                
                class BaseAuthentication(object):
                    """
                    All authentication classes should extend BaseAuthentication.
                    """

                    def authenticate(self, request):
                        """
                        Authenticate the request and return a two-tuple of (user, token).
                        """
                        raise NotImplementedError(".authenticate() must be overridden.")

                    def authenticate_header(self, request):
                        """
                        Return a string to be used as the value of the `WWW-Authenticate`
                        header in a `401 Unauthenticated` response, or `None` if the
                        authentication scheme should return `403 Permission Denied` responses.
                        """
                        pass

            
            之後本身開發時，如何使用？
                需求：
                    class BaseMessage(object):

                        def send(self):
                            raise NotImplementedError('必須實現send方法')


                    class Msg(BaseMessage):
                        def send(self):
                            print('發送短信')


                    class Wechat(BaseMessage):
                        def send(self):
                            print('發送微信')


                    class Email(BaseMessage):
                        def send(self):
                            print('發送郵件')



                    class DingDing(BaseMessage):
                        def send(self):
                            print('發送釘釘提醒')
                
            
        3. __dict__
        
        4. metaclass 
    
            
            
            
    整理面試題（今天交給我）
        
            
            
今日內容：
    - 爬蟲
        - requests
        - bs4
    - 長輪詢/輪詢
    
    
內容詳細：
    參考博客：https://www.cnblogs.com/wupeiqi/articles/6283017.html
    
    需求： 
        1. 爬取汽車之家新聞諮詢
            - 什麼都不帶
        2. 爬抽屜新熱榜
            - 帶請求頭
            - 帶cookie
            - 登陸：
                - 獲取cookie
                - 登陸：攜帶cookie作受權
                - 帶cookie去訪問
        3. 爬取GitHub
            - 帶請求頭
            - 帶cookie
            - 請求體中：
                commit:Sign in
                utf8:✓
                authenticity_token:hmGj4oS9ryOrcwoxK83raFqKR4sFG1yC09NxnDJg3B/ycUvCNZFPs4AxTsd8yPbm1F3i38WlPHPcRGQtyR0mmw==
                login:asdfasdfasdf
                password:woshiniba8
        
        4. 登陸拉勾網 
            - 密碼加密
                - 找js，經過python實現加密方式
                - 找密文，密碼<=>密文
            
            - Referer頭， 上一次請求地址，能夠用於作防盜鏈。
        
    總結：
        請求頭：
            user-agent
            referer
            host
            cookie
            特殊請起頭，查看上一次請求獲取內容。
                'X-Anit-Forge-Code':...
                'X-Anit-Forge-Token':...
        請求體：
            - 原始數據
            - 原始數據 + token
            - 密文
                - 找算法 
                - 使用密文
                
        套路：
            - post登陸獲取cookie，之後攜帶cookie 
            - get獲取未受權cookie，post登陸攜帶cookie去受權，之後攜帶cookie 
        
                
    
    1. requests模塊 
        - 方法
            requests.get
            requests.post 
            requests.put 
            requests.delete 
            ...
            requests.request(method='POST')
        
        - 參數
        
        - session 
            session = requests.Session()
            
            session.get()
            session.post()
            
            ...
    
        
    2. BeautifulSoup
    
    3. 輪詢/長輪詢(跟爬蟲沒有關係)
        在線投票：最醜的男人
        
        - 輪詢：每2秒鐘發送請求。
        - 長輪詢：最多hang住30s（兼容性好）
            - 實時
            - 在線 
        - websocket實現（兼容性不太好）

10 requests模塊詳解(一)

10.1 方法：

requests.get
requests.post
requests.put
requests.delete

10.2 參數；

requests.get = html

url = 'https://www.cuixiaozhao.com'
headers = {}
cookies = {}
params = {'k1':'v1','k2':'v2'} #https://www.cuixiaozhao.com?k1=v1&k2=v2

requests.post = python

url = 'https://www.cuixiaozhao.com'
headers = {}
cookies = {}
params = {'k1':'v1','k2':'v2'} #https://www.cuixiaozhao.com?k1=v1&k2=v2
data = {}

10.3 參數；

10.3.1 url;

10.3.2 headers;

10.3.3 cookies;

10.3.4 params;

10.3.5 data;

10.3.6 data傳請求體;

10.3.7 json傳請求體;

10.3.8 代理，代理池;

10.3.9 文件上傳;

10.3.10 用戶認證auth;

內部用戶名和密碼，用戶名和密碼加密後，放在請求頭中傳給後臺；
"用戶名:密碼"
base64("用戶名:密碼")
"Basic base64(「用戶名:密碼」)"
請求頭：Authorzation：「basic base64(「用戶名:密碼」)」

from requests.auth import HTTPBasicAuth, HTTPDigestAuth

ret = requests.get(
    'https://api.github.com/user', auth=HTTPBasicAuth('admin', 'admin')
)
print(ret.text)

11 requests模塊詳解(二)jquery

12 requests模塊詳解(三)

12.1 超時（timeout）；

12.2 容許重定向allow_redirects；

12.3 大文件下載stream，一點一點去下載，防止佔滿內存空間；

12.4 證書cert——百度、騰訊不用攜帶證書（系統幫咱們作了）；

12.5 確認verify；相似於yum install 中的-y參數；

13 bs4模塊簡述

13.1 方法；

13.2 參數；

13.3 session，可是推薦本身帶上session；

13.4 長輪詢；

14 9期最醜的男人：輪詢

14.1 輪詢/長輪詢（跟爬蟲沒有關係）

輪詢：每隔固定時間發送一次請求，好比每隔2秒鐘；
長輪詢：夯住一段時間，間隔較長時間進行發送請求，好比1分鐘；省去了socket鏈接的時間；在線實時，通常就是長輪詢好！

app.py

from flask import Flask, render_template, request, jsonify

app = Flask(__name__)

USERS = {
    '1': {'name': '貝貝', 'count': 1},
    '2': {'name': '小東北', 'count': 0},
    '3': {'name': '何偉明', 'count': 0},
}


@app.route('/user/list')
def user_list():
    import time
    # time.sleep(120)
    return render_template('user_list.html', users=USERS)


@app.route('/vote', methods=['POST'])
def vote():
    uid = request.form.get('uid')
    USERS[uid]['count'] += 1
    return '投票成功！'

    
@app.route('/get/vote')
def get_vote():
    return jsonify(USERS)


if __name__ == '__main__':
    app.run(host="192.168.1.49", threaded=True)

app1.py

from flask import Flask, render_template, request, jsonify

app = Flask(__name__)
import queue

q = queue.Queue()


@app.route('/get/vote')
def get_vote():
    try:
        val = q.get(timeout=5)
    except queue.Empty:
        val = "已超時"
    return val


@app.route('/vote')
def vote():
    q.put('10')
    return "投票成功！"


if __name__ == '__main__':
    app.run(threaded=True)

user_list.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="https://cdn.bootcss.com/jquery/3.3.0/jquery.min.js"></script>
    <style>
        li {
            cursor: pointer;
        }
    </style>
</head>
<body>
<ul id="userlist">
    {% for key,val in users.items() %}
    <li uid="{{key}}">{{val.name}} ({{val.count}})</li>
    {% endfor %}
</ul>

<script>
    $(function () {
        $('#userlist').on('dblclick', 'li', function () {
            var uid = $(this).attr('uid');
            $.ajax({
                url: '/vote',
                type: 'POST',
                data: {uid: uid},
                success: function (arg) {
                    console.log(arg);
                }
            });
        });
    });

    /*
    獲取投票信息;
    */
    function get_vote() {
        $.ajax({
            url: '/get/vote',
            type: 'GET',
            dataType: 'JSON',
            success: function (arg) {
                console.log(arg);
                $('#userlist').empty();
                $.each(arg, function (k, v) {
                    console.log(k, v);
                    var li = document.createElement('li');
                    li.setAttribute('uid', k);
                    li.innerText = v.name + "(" + v.count + ")";
                    $('#userlist').append(li);
                })
            }
        })
    }

    //設置定時器，2000ms = 2s;
    setInterval(get_vote, 2000)
</script>
</body>
</html>

15 9期最醜的男人：長輪詢git

app.py;

from flask import Flask, render_template, request, jsonify, session
import uuid
import queue

app = Flask(__name__)
app.secret_key = 'asdfasdfasd'

USERS = {
    '1': {'name': '貝貝', 'count': 1},
    '2': {'name': '小東北', 'count': 0},
    '3': {'name': '何偉明', 'count': 0},
}

QUEQUE_DICT = {
    # 'asdfasdfasdfasdf':Queue()
}


@app.route('/user/list')
def user_list():
    user_uuid = str(uuid.uuid4())
    QUEQUE_DICT[user_uuid] = queue.Queue()

    session['current_user_uuid'] = user_uuid
    return render_template('user_list.html', users=USERS)


@app.route('/vote', methods=['POST'])
def vote():
    uid = request.form.get('uid')
    USERS[uid]['count'] += 1
    for q in QUEQUE_DICT.values():
        q.put(USERS)
    return "投票成功"


@app.route('/get/vote', methods=['GET'])
def get_vote():
    user_uuid = session['current_user_uuid']
    q = QUEQUE_DICT[user_uuid]

    ret = {'status': True, 'data': None}
    try:
        users = q.get(timeout=5)
        ret['data'] = users
    except queue.Empty:
        ret['status'] = False

    return jsonify(ret)


if __name__ == '__main__':
    app.run(threaded=True)
    # app.run(threaded=True)

user_list.html

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style>
        li {
            cursor: pointer;
        }
    </style>
</head>
<body>
<ul id="userList">
    {% for key,val in users.items() %}
    <li uid="{{key}}">{{val.name}} ({{val.count}})</li>
    {% endfor %}
</ul>

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

    $(function () {
        $('#userList').on('click', 'li', function () {
            var uid = $(this).attr('uid');
            $.ajax({
                url: '/vote',
                type: 'POST',
                data: {uid: uid},
                success: function (arg) {
                    console.log(arg);
                }
            })
        });
        get_vote();
    });

    /*
    獲取投票信息
     */
    function get_vote() {
        $.ajax({
            url: '/get/vote',
            type: "GET",
            dataType: 'JSON',
            success: function (arg) {
                if (arg.status) {
                    $('#userList').empty();
                    $.each(arg.data, function (k, v) {
                        var li = document.createElement('li');
                        li.setAttribute('uid', k);
                        li.innerText = v.name + "(" + v.count + ')';
                        $('#userList').append(li);
                    })
                }
                get_vote();

            }
        })
    }

</script>
</body>
</html>