网络爬虫之金融数据前后端实现

基金监控项目实战

一 设计思想

爬虫

采集基金公司的数据

        单线程爬虫，用requests进行处理

web开发

前端

        负责页面的设计的设计

        HTML+CSS+JavaScript+echarts

后端

        负责调用爬虫获取数据，传输给前端

        Flask框架

流程思维导图：

        

二 前端设计

样式里面 .表示class #表示ID

    
    


基金可视化！
//设置css属性
//css样式中.表示class,#表示ID 


//class为w和box的搜索框模块

    
//按钮
    搜索

三 后端设计

1. document.getElementById('data'): 这是一个 DOM (Document Object Model) 方法，它返回一个在 HTML 文档中具有 ID 属性为 data 的元素。这意味着你应该在你的 HTML 中有一个元素类似于

   。

2. echarts.init(...): 这是 ECharts 库的方法，它初始化一个图表实例。它接受一个 DOM 元素作为参数（在这里，是上一步获取的元素），并在该元素中创建一个图表。

3. var ff = ...: 这部分代码创建了一个新的变量 ff，并将初始化的 ECharts 实例赋值给它。随后，你可以使用这个变量 ff 来调用图表实例的方法，比如设置图表的选项 (setOption)、更新数据等。

四 爬虫程序设计

crawl.py

import requests
import re
def get_data(id):
    # 确保 id 是字符串格式
    id = str(id)
    try:
        resp = requests.get(url='https://fund.eastmoney.com/js/fundcode_search.js?v=20220325212048').text
        # 改进正则表达式以匹配整个赋值语句
        ff = re.findall('var r = (.*?);', resp)
        if not ff:
            raise ValueError("No data found with the provided regex pattern.")

        # 使用 eval 来解析数据
        params_data = eval(ff[0])
        title = ''

        # 寻找匹配的基金名称
        for i in params_data:
            if id == i[0]:
                title = i[2]
                break
        else:
            return {'error': 'No matching fund found for the given ID.'}

        url = f"https://danjuanfunds.com/djapi/fund/growth/{id}?day=3m"
        header = {
            'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36'
        }
        res = requests.get(url, headers=header)

        if res.status_code == 200:
            items = res.json()
            times = []
            zf = []
            for item in items.get('data')['fund_nav_growth']:
                date = item.get('date')
                percentage = item.get('percentage')
                params_data = date.replace(date.split('-')[0] + '-', '')
                times.append(params_data)
                zf.append(percentage)
            return {'time': times, 'price': zf, 'title': title}

        return {'error': f"HTTP request failed with status code {res.status_code}."}
    except Exception as e:
        print(e)
        return {'error': str(e)}

五 可视化图表设计

index.html

    
    


基金可视化！





    
    搜索

六 后台编写

mains.py

from flask import Flask,render_template,jsonify,request
import crawl
app = Flask(__name__)

@app.route('/')
def index():
    # 渲染页面
    return render_template('index.html')

@app.route('/api')
def api_data():
    # 获取前端参数
    id = request.args.get('data')
    # 给爬虫传参
    data = crawl.get_data(id)
    #响应数据传参给前端
    return jsonify({'data':data})
if __name__ == '__main__':
    # 框架入口
    app.run()