使用vue + fastapi在heroku上搭建线报网站

爬取即时线报，通过vue.js和axios.js调用fastapi相关数据到html页面进行展示。

效果展示：最新线报

Heroku

注册heroku
安装heroku cli

mkdir haoyangmao && cd haoyangmao
git init
heroku git:remote -a haoyangmao

线报采集

用python写一个简单的爬虫，大致代码如下，四个目标网站，利用requests+lxml库获取目标网站线报的url和title并写入数据库，如果采集频率比较高的话可以使用代理IP www.xhuosoft.cn，requests.get添加一个proxies就可以。

headers = {"User-Agent":"Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/63.0.3239.132 Safari/537.36"}class Spider(object):def __init__(self,url=None):if url!=None:self.url = urlself.res = requests.get(url,headers=headers)#self.res.encoding = "utf-8"self.soup = etree.HTML(self.res.text)def spider_kxd(self):soup = Spider(kxd_api).soupfor soup_a in soup.xpath('//a[@class="s xst"]'):title = soup_a.textlink = soup_a.get('href')if Message.get_or_none(Message.link==link):passelse:Message.create(title=title,link=link)

如果需要采集之后推送到微信群使用wxpy库即可。

fastapi

fastapi字面意思是一个快的api库，通过fastapi将线报信息转换为api接口，通过网页进行调用。
大致代码如下：

@app.get("/xb/")
def xb(request: Request):p = Message.select(Message.title,Message.link).order_by(Message.pubtime.desc()).limit(10)data = []for q in p:msg = {'title':q.title,'link':q.link}data.append(msg)return data

Vue.js

前端使用vue.js和axios.js与fastapi进行数据交互。

部署

创建一个Procfile，内容如下：

web: gunicorn -w 3 -k uvicorn.workers.UvicornWorker main:app

创建一个requirements.txt，内容为你所项目所使用的各类依赖库。
创建一个runtime.txt，内容写python的版本即可。

具体最终效果看这里

使用vue + fastapi在heroku上搭建线报网站相关推荐

Linux常用命令下，以及再CentOS7下搭建apache网站服务，以及同一服务器上搭建第二个网站
Linux常用命令下,以及再CentOS7下搭建apache网站服务,以及同一服务器上搭建第二个网站 Linux 常用命令ls -l 以长格式显示-a 显示.. 和 .-A 不显示 . 和 ..-d ...
Linux上搭建Magento电子商务网站
一.简介 Magento是一款开源电商网站框架,其丰富的模块化架构体系及拓展功能可为大中型站点提供解决方案.它使用PHP开发,支持版本范围从PHP 5.6到PHP 7.1,并使用MySQL存储数据.本 ...
在一台服务器上搭建多个网站的方法（Apache版）
Apache的配置文件一般放置在/etc/httpd/conf文件夹下,httpd.conf是它的主配置文件,在进行配置时可以将虚拟主机的配置文件单独配置,如取名为vhost.conf,然后再http ...
heroku搭建邮件服务器,在Heroku上搭建简单的Python Web 应用
开发一个小应用放在互联网上给大家使用是一件成就感很高的事情,不过支持Python的免费空间不是很多,虽然GAE支持Python,不过由于众所周知的原因,在国内是很难打开GAE,这篇文章为大家介绍一下H ...
Windows环境下使用Internet Information Service（ IIS）管理器上搭建Web资源网站
一.业务需求在项目的开发过程中,需要将指定文件夹发布称为一个网站,可以通过网页查看该文件夹下的内容和子目录(及其子目录内容):同时也可以将内容上传到该文件夹中,方便他人使用,如下图所示: 二.思路分 ...
Vue+Openlayers实现地图上绘制线
场景 Vue+Openlayers实现显示图片并分优先级多图层加载: Vue+Openlayers实现显示图片并分优先级多图层加载_BADAO_LIUMANG_QIZHI的博客-CSDN博客上面是添 ...
个人建设网站流程解说，手把手教你如何在阿里云上搭建自己的网站
现如今信息化时代,很多企业甚至是个人都有自己搭建网站的需求,目前建站有两方式,第一:找网络公司全程负责搭建:第二:自己建设:找网络公司建设网站市场价格不一,网络公司的实力技术也不一样,所以会有很多的建 ...
在群晖NAS上搭建WordPress动态网站并实现外网访问
目录一.安装套件 1. 安装Web Station套件 2. 安装MariaDB 10数据库套件 3.安装服务套件 4.我为什么要用WordPress? 5.建站的其它方法二.访问WordPres ...
搭建Magento电子商务网站
搭建Magento电子商务网站 https://help.aliyun.com/document_detail/50704.html 更新时间:2020-05-08 18:34:32 编辑我的收藏本 ...
使用freekan源码搭建本地视频网站，并发布公网访问
文章目录 1.前言 2.本地网页搭建 1.1 环境使用 1.2 支持组件和环境设置 1.3 支持组件选和环境设置 1.4 网页安装 1.5 测试和使用 1.6 问题解决 3.本地网页发布 3.1 Cp ...