Logo - LIFE & SHARE - 王颜公子
Loading... RSS

Flask Vue.js全栈开发｜第1章：创建第一个Flask RESTful API

  • 原创
  • Madman
  • /
  • /
  • 33
  • 58857 次阅读
flask vuejs 全栈开发-min.png

Synopsis: 本文是Flask+Vue.js全栈开发的第一篇，主要是以比较优化的结构搭建Flask应用，并提供一个测试的API，客户端访问 /ping 后会返回 Pong! 响应，用于下一篇前端Vue.js测试与后端的连通性

代码已上传到 https://github.com/wangy8961/flask-vuejs-madblog/tree/v0.1 ，欢迎star

1. 代码管理

1.1 安装 git

使用 Win10 系统开发，先安装 Git for Windows，请移步

1.2 创建 Github 仓库

登录你的 Github 账户，创建个人项目，我的命名为 flask-vuejs-madblog。在你的 Github 账户中添加该电脑的 SSH keys，请移步

1.3 git clone

克隆到本地，打开 Git Bash：

$ cd /d/python-code/
$ git clone git@github.com:wangy8961/flask-vuejs-madblog.git

1.4 init commit

添加 MIT License，然后第一次提交：

$ cd flask-vuejs-madblog/
$ git status
On branch master
Your branch is up-to-date with 'origin/master'.
Untracked files:
  (use "git add <file>..." to include in what will be committed)

        LICENSE

nothing added to commit but untracked files present (use "git add" to track)
$ git add .
$ git commit -m "init"
$ git push

1.5 分支管理

创建 dev 开发分支：

$ git checkout -b dev
$ git branch
* dev
  master

2. 配置 Flask

安装 Python 3，请前往 官方网站 下载 Windows 对应版本

请确保有 Flask 基础，阅读官方文档

打开 cmd ，切换到项目目录，创建 back-end 目录，这是我们的后端API应用所在位置：

Microsoft Windows [版本 10.0.14393]
(c) 2016 Microsoft Corporation。保留所有权利。

C:\Users\wangy>D:

D:\>cd python-code\flask-vuejs-madblog

D:\python-code\flask-vuejs-madblog>mkdir back-end

D:\python-code\flask-vuejs-madblog>cd back-end

D:\python-code\flask-vuejs-madblog\back-end>python -m venv venv

D:\python-code\flask-vuejs-madblog\back-end>venv\Scripts\activate
(venv) D:\python-code\flask-vuejs-madblog\back-end>pip install flask
(venv) D:\python-code\flask-vuejs-madblog\back-end>pip freeze > requirements.txt

使用 Visual Studio Code 打开项目，提供 .gitignore 文件：

.idea/
__pycache__/
venv/
.env
分类: Vue.js Flask
标签: RESTful API vuejs flask
  • 115161561
  • 113479570
  • serendipity-800
  • 126039858
  • zhuyulin
  • ygren
  • wulvtutu
  • 141385287
  • 99857443
  • 73322100
  • sunny
  • nickzxhfjsm
  • que-ai2023
  • anthony-577518830
  • 32609641
  • team12
  • 110100941
  • tttker
  • kasbar
  • reinxd
  • 11757580
  • 61450478
  • qiu-chen-100
  • 49550734
未经允许不得转载: LIFE & SHARE - 王颜公子 » Flask Vue.js全栈开发｜第1章：创建第一个Flask RESTful API

分享

相关推荐

作者

作者头像

Madman

如需 Linux / Python 相关问题付费解答，请按如下方式联系我

33 条评论

小神龙
小神龙

文章内容很丰富，期待完整的Flask + Vue.js项目系列，感谢:)

Madman
Madman 小神龙 Author

谢谢😜，喜欢就好，最近工作忙，争取下个月写完整个系列

charming
charming

希望能够更新

Madman
Madman charming Author

已经更新到第16章了

shijl0925
shijl0925 Madman

赞👍🏻

tuanyuan xiao
tuanyuan xiao

希望能有全买的~优惠一点的~ 一个一个买有点承受不住

Madman
Madman tuanyuan xiao Author

联系我的微信，优惠可以谈

sinodrop
sinodrop

在 "app/init.py" 中

from flask import Flask
from config import Config


...
...

目录结构是 "backend/app/init.py" 那么是如何 "from config import Config" 的呢 config.py的路径是 "backend/config.py" 还是我目录结构理解错误了

Madman
Madman sinodrop Author

你说的是 app/__init__.py 吧，首先 app/ 是一个 Python 包，所以它里面必须有 __init__.py 文件，可以是空的

应用入口文件是 madblog.py，其他文件要导入额外模块时都是相对于它来查找的。所以 app/__init__.py 要从与应用入口文件同级的 config.py 导入 Config 类的话，使用 from config import Config

sinodrop
sinodrop Madman

从你所说的内容切入，去仔细看了python引用导入，现在明白了。你的解答非常准确易懂，非常感谢~

slinzhang007
slinzhang007

不错

novolei
novolei

`````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````adsad asd

asdasdasd asd asd asd

novolei
novolei

1212121212

Xi Cheng
Xi Cheng

为什么我已经pip install python-dotenv 之后仍旧出现了 ModuleNotFoundError: No module named 'dotenv'？请问有什么解决办法吗？

Madman
Madman Xi Cheng Author

加我微信，发截图

diyun
diyun

每篇都要付费莫

草样wyh
草样wyh diyun

我也想知道

Madman
Madman 草样wyh Author

可以批量购买 https://madmalls.com/pay/buy-series-request/flask/

Bili认真
Bili认真

刚入门flask，请问如何打包后的dist文件如何使用flask打开呢

Bili认真
Bili认真 Bili认真

昨天已经解决了，不过还是要感谢！！

Tiffany疯孩子
Tiffany疯孩子

从知乎慕名过来~跟着大佬已经学完了Flask这一整个系列~还好自己有些基础~学起来也轻松一点~博主写的教程真的很棒~之前也找了很多资料~但是还是这里的最完整最高效~~感谢大佬！！！希望大佬能继续更新新的系列！！支持！！！

__豆约翰__
__豆约翰__

不错 谢谢分享

bill19920920
bill19920920

没法白嫖不开心······· 不过为知识花一些钱也是值，省却自己采坑

Madman
Madman bill19920920 Author

😁

hongshao123
hongshao123

我刚开始第一章的学习，项目起来了，但打开网址前端不显示任何东西，怎么开启前端呢

dongjie110
dongjie110

可不可以一次付费，每篇一次。难受

leoduan
leoduan

github拉的代码，可以运行不报错，本地自己写的，完全一样，就报错，ModuleNotFoundError: No module named 'config',什么问题呢？

leoduan
leoduan leoduan

config是导入问题，已修改；重新运行后github的代码也报错了，都是404，

Not Found
The requested URL was not found on the server. If you entered the URL manually please check your spelling and try again.
mingkai
mingkai leoduan

url 写的有问题吧? 我刚开始叶碰到这个问题，仔细一看浏览里输入的是http://127.0.0.1:5000， 而不是http://127.0.0.1:5000/api/ping。 写成这样就没问题了。

Madman
Madman leoduan Author

跟着教程仔细点，理解了后自己能手写出来就差不多了。这一章就是搭个项目结构，一个最简单的路由处理函数而已，404说明路由没配置对

用户7206094097
用户7206094097

File "C:\Users\David.virtualenvs\pythonProject1-cSVtTpg4\lib\site-packages\flask_sqlalchemy\extension.py", line 629, in engines return self._app_engines[app] File "C:\Program Files\WindowsApps\PythonSoftwareFoundation.Python.3.10_3.10.2032.0_x64__qbz5n2kfra8p0\lib\weakref.py", line 416, in getitem return self.data[ref(key)] KeyError: <weakref 'flask'="" 0x0000016d2e2f1630="" 0x0000016d2e965d00;="" at="" to=""></weakref>

进行数据库迁移flask db migrate,报错看不太明白为什么

用户7206094097
用户7206094097 用户7206094097

忘记db = SQLAlchemy(app)l

专题系列

热门文章

归档

随机文章

热门标签

文章目录