数字旗手

电气化、自动化、数字化、智能化、智慧化

0%

使用Heroku云平台免费托管web应用

简介

当开发了一款web应用后,需要使用服务器将其托管以供用户进行访问。服务器的选择多种多样,可以选择自己搭建服务器,也可以选择如今大火的各种云服务器。
虽说现在云服务器的价格已经非常亲民(尤其是对于新用户的各种优惠政策),但毕竟还是需要真金白银的付出,尤其是考虑自己开发的应用可能只是为了大家尝试的情形下,此时可以选择一些提供免费部署的云平台。
Heroku是一个非常优秀的PaaS(Platform as a Service)云平台,它有如下几个优点:
(1)自动软件部署:当软件的代码变动后,通过git进行代码追踪后,就可以自动触发软件的部署交付;
(2)无需关心背后的基础设施:因为Heroku是一个PaaS平台,而不是IaaS(Infrastructure as a Service)平台,所以它屏蔽了很多的细节,比如使用的操作系统、运行环境等。用户写好配置文件后,自动搭建应用程序所需的环境;
(3)免费额度:对于小型应用来说,免费版已足够,但是有不少限制,比如应用在30分钟内无访问的话会自动休眠,再次有访问时会被唤醒,可能会有10多秒的延迟;每个月限制在550小时的免费运行时长;提供给用户的Postgres数据库存储的数据不能超过10000行等。

注册

登录heroku网站注册一个账号。

下载并安装Heroku工具

注意,需要电脑上提前安装git。

下载

Heroku工具的下载地址

验证

安装后进行验证:

1
heroku --version

登录

登录账号:

1
heroku login

创建或使用已有git仓库

在项目中创建git仓库,或使用已有的git仓库:

1
2
cd my-project/
git init

创建Heroku App

新建或连接Heroku App

在命令行中新建Heroku App:

1
heroku create my-project-test

或者在Heroku网站上已创建了App,此时连接即可:
1
heroku git:remote -a my-project-test

操作git仓库

对于项目文件的更新,使用常规的git命令即可:

1
2
git add .
git commit -am "make it better"

部署到Heroku

1
git push heroku master

如果涉及到master分支更名为main分支,可以查看该教程

Vue项目部署

特别地,对于Vue.js开发的项目,要注意以下几点:
教程1, 教程2

文件打包

1
npm run build

git加入dist路径

.gitignore文件中删除/dist条目,使得该路径可以被git监控。

新增文件

新建static.json文件:

1
2
3
4
5
6
7
{
"root": "dist",
"clean_urls": true,
"routes": {
"/**": "index.html"
}
}

注意将上述改动都通过git addgit commit提交。

新增Heroku指令

1
2
heroku buildpacks:add heroku/nodejs
heroku buildpacks:add https://github.com/heroku/heroku-buildpack-static

部署

1
git push heroku master

Python项目部署

添加python版本指定文件

新建runtime.txt文件,然后在里面写上python版本,如:

1
python-3.7.13

不过python版本与heroku的版本需要对应,具体查看这里的说明

添加依赖需求文件

1
pip freeze > requirements.txt

添加Procfile

新建Procfile文件,里面包含的是Web应用服务器启动时执行的命令,比如:

1
web: uvicorn main:app --host=0.0.0.0 --port=${PORT:-5000}

一篇很好的教程见这里

问题汇总

(1)遇到Your account has reached its concurrent build limit这个错误,可以:

1
heroku restart

参考这个问题
(2)项目不能太大,免费版实测压缩后最大是500M
(3)如果用到opencv,需要这样配置:
首先添加指令:
1
heroku buildpacks:add --index 1 heroku-community/apt

然后新建Aptfile,内容为:
1
2
3
4
libsm6
libxrender1
libfontconfig1
libice6

参考该教程

启动App

Heroku网站上的该Appsettings中找到该App的网站url
或者通过以下命令:

1
heroku open

即可直接打开App。
以后即可通过该网址访问该App