怎么爬取ws实时数据python

转载

烟雨江南的秋 2024-09-24 10:21:49

文章标签 怎么爬取ws实时数据python Vue 数据 App 文章分类 Python 后端开发

1、爬取数据

爬取html页面代码如下：

url = "xxxxxxxxxxxxxxxxxxx"
resp = requests.get(url)
# 将HTML二进制文件进行'gbk转码成字符串文件
html = resp.content.decode('gbk')

正则表达式匹配代码如下：

date = {} 
date['日期'] = re.findall(r'<td ><b><a href=.*?>(.*?-.*?-.*?)</a> </b></td>',
                        html)
print(date)

以上代码用于匹配以下代码的日期：

<tr>
        <td ><b>杭州</b></td>
        <td ><b><a href='/lishi/hangzhou/20200827.html'>2020-08-27</a> </b></td>
        <td > 大到暴雨</td>
        <td>北风 3-4级</td>
        <td>33℃</td>
        <td>中雨</td>
        <td>北风 3-4级</td>
        <td> 25℃</td>
        </tr>

正则表达式的匹配规则：
. 代表可以匹配一个任意字符（不包括不可见的换行字符）
* 代表可以任意次（0\sim \propto）地匹配它前面的子表达式（即“贪婪匹配”）
*? 代表“非贪婪匹配”
() 代表子表达式，把指定的内容放入缓存并返回

以下是我爬取到的数据，以一个json对象的形式展现

{
	"date": ["2020-09-22", "2020-09-21", "2020-09-20(星期日)", "2020-09-19(星期六)", "2020-09-18", "2020-09-17", "2020-09-16", "2020-09-15", "2020-09-14", "2020-09-13(星期日)", "2020-09-12(星期六)", "2020-09-11", "2020-09-10", "2020-09-09", "2020-09-08", "2020-09-07", "2020-09-06(星期日)", "2020-09-05(星期六)", "2020-09-04", "2020-09-03", "2020-09-02", "2020-09-01", "2020-08-31", "2020-08-30(星期日)", "2020-08-29(星期六)", "2020-08-28", "2020-08-27", "2020-08-26", "2020-08-25", "2020-08-24"],
	"day_high_temp": ["24", "24", "24", "19", "19", "25", "25", "25", "26", "27", "28", "29", "32", "34", "35", "34", "32", "33", "34", "34", "32", "33", "34", "33", "32", "28", "33", "36", "38", "37"],
	"day_weather": ["小雨", "阴", "阴", "小雨", "小到中雨", "中雨", "小到中雨", "小雨", "小雨", "阴", "多云", "阴", "小雨", "阴", "晴", "晴", "晴", "多云", "多云", "晴", "小雨", "多云", "多云", "多云", "多云", "中雨", "大到暴雨", "多云", "小雨", "晴"],
	"day_wind": ["北风 1-2级", "北风 1-2级", "东风 1-2级", "北风 3-4级", "东北风 1-2级", "北风 4-5级", "北风 1-2级", "北风 1-2级", "北风 1-2级", "北风 1-2级", "西北风 3-4级", "北风 3-4级", "东北风 3-4级", "东北风 1-2级", "东南风 3-4级", "西北风 3-4级", "北风 4-5级", "东风 4-5级", "东风 3-4级", "西北风 1-2级", "西北风 4-5级", "北风 5-6级", "东风 3-4级", "东风 3-4级", "西北风 3-4级", "北风 3-4级", "北风 3-4级", "西北风 3-4级", "西北风 3-4级", "东风 3-4级"],
	"night_min_temp": ["20", "20", "18", "17", "17", "19", "23", "22", "22", "20", "21", "21", "25", "24", "23", "23", "24", "21", "23", "22", "22", "26", "26", "24", "24", "22", "25", "26", "27", "27"],
	"night_weather": ["小雨", "小雨", "阴", "阴", "小雨", "中雨", "中到大雨", "小雨", "小雨", "多云", "多云", "多云", "小雨", "多云", "晴", "晴", "晴", "晴", "多云", "晴", "晴", "多云", "多云", "晴", "多云", "阴", "中雨", "多云", "小雨", "多云"],
	"night_wind": ["北风 1-2级", "北风 1-2级", "东风 1-2级", "北风 3-4级", "东北风 1-2级", "北风 4-5级", "北风 1-2级", "北风 1-2级", "北风 1-2级", "北风 1-2级", "西北风 3-4级", "北风 3-4级", "东北风 3-4级", "东北风 1-2级", "东南风 3-4级", "西北风 3-4级", "北风 4-5级", "东风 4-5级", "东风 3-4级", "西北风 1-2级", "西北风 4-5级", "北风 5-6级", "东风 3-4级", "东风 3-4级", "西北风 3-4级", "北风 3-4级", "北风 3-4级", "西北风 3-4级", "西北风 3-4级", "东风 3-4级"]
}

2、数据的可视化展示

数据的可视化展示使用Vue+ElementUI+Echarts来做
实习结束后也没有再接触过Vue了，这里记录一下项目的创建过程
第一步创建项目
打开cmd 在父文件夹中输入vue init webpack weatherForecast（weatherForecast是项目名）

第二步 ElementUI的引入
在安装了Nodejs的前提下，打开cmd 相应文件夹中输入cnpm i element-ui --save 然后直接完整引入，在 main.js 中写入以下内容：

import Vue from 'vue';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import App from './App.vue';

Vue.use(ElementUI);

new Vue({
  el: '#app',
  render: h => h(App)
});

第三步启动Vue
cmd中输入npm run dev

python服务器的使用
因为数据是在python上爬取的，所以想用flask来做python端的服务器，究极方便，安装后仅仅需要以下代码即可使用

from flask import Flas 

app = Flask(__name__)
# 解决中文乱码问题
app.config['JSON_AS_ASCII'] = False
app.config['JSONIFY_MIMETYPE'] = "application/json;charset=utf-8"

# API
@app.route('/')
def hello_world():
    return 'Hello Flask!'