Flask Vue.js全栈开发|最新完整代码

  • 原创
  • Madman
  • /
  • /
  • 43
  • 36540 次阅读

flask vuejs 全栈开发-min.png

Synopsis: Flask + Vue.js 全栈开发系列的 [最新代码] 会定时更新到本文的 [附件] 中,Github 上的代码只包含前面的部分

点击 [阅读全文],最新代码在本文末尾的 [附件] 中。一次购买,持久更新

如何下载完整代码.png

测试地址: http://120.77.33.143

Python Vue.js vue-router axios Bootstrap4 webpack

pic 01 pic 02 pic 03

1. Flask Vue.js全栈开发教程系列

2. 如何使用

建议使用 Docker 容器运行,参考第 21 章节

2.1 下载最新代码

注意: 最新完整的代码在本文末尾的附件中,Github 上只包含部分代码

2.2 Backend

需要先安装 Elasticsearch 和 Redis

(1)提供 .env 文件

复制 back-end/.env.example,并重命名为 back-end/.env,然后修改里面的邮箱配置,具体参考:

  • howard
  • ganwencui
  • yu-xuan-cosine
  • hzh123456
  • sigma
  • kkkkm
  • 86449824
  • llleo-li
  • jhin97
  • duanyu
  • hpywh
  • 1057713732-qq-com
  • apchwin
  • artyom
  • geraint-2679168954
  • deng0525
  • figuretom
  • 48662575
  • 28696494
  • 32436086
  • zhenqu
  • deadliner
  • maizesty
  • jackcia
未经允许不得转载: LIFE & SHARE - 王颜公子 » Flask Vue.js全栈开发|最新完整代码

分享

作者

作者头像

Madman

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

43 条评论

Leuan12
Leuan12

我想知道买这个课程是多少钱呢

Leuan12
Leuan12

我想知道买这个课程是多少钱呢

Madman
Madman Leuan12 Author

全系列21章加上最新完整代码,一共90左右,现在充值有优惠哦。代码和配套教程都是我一行行敲的,码字不易多谢理解

heavenkiller2018
heavenkiller2018 Madman

全买是多少钱来着?有会员什么的没,可以全看的,不用一个个充值的

Madman
Madman heavenkiller2018 Author

本系列是90左右,五一假期可以活动充80送20。 会员 是一对一指导前后端分离开发,包含整个网站免费阅读,价格私信或者微信详聊

tuanyuan xiao
tuanyuan xiao

能不能发个.ENV 完整的~ 有些参数没有

tuanyuan xiao
tuanyuan xiao tuanyuan xiao

app.config['LOG_TO_STDOUT']

这个值没找到

tuanyuan xiao
tuanyuan xiao tuanyuan xiao

找到了

JAYqq
JAYqq

怎样购买全部课程,只能一章一章买吗

Madman
Madman JAYqq Author

已经支持一次性购买整个系列了😁 https://madmalls.com/pay/buy-series-request/vuejs/

Madman
Madman JAYqq Author

一次性充值指定金额后,会赠送您部分金额。然后在网站浏览您喜欢的文章,点击文章尾部的 [阅读全文] 按钮进行购买即可,整个过程也就几秒钟时间啊

x7home
x7home

这套课程会增加实现文章购买和会员购买功能的章节吗?

Madman
Madman x7home Author

这个系列应该不会(因为是微型博客项目,主要目的是介绍Flask如何设计RESTful API,以及前端Vue.js交互),付费阅读只在我自己的网站代码有实现

cuojue
cuojue

大佬,考虑增加上传图片和更换头像功能不

chenyou
chenyou

sqlalchemy.exc.InvalidRequestError sqlalchemy.exc.InvalidRequestError: Table 'followers' is already defined for this MetaData instance. Specify 'extend_existing=True' to redefine options and columns on an existing Table object.

间隔性出现这个问题怎么解决? 翻了很多评论和google也没找到对应的解决办法

shishijia
shishijia

执行flask db upgrade,报错

File "h:\python-code\code-20190813\back-end\venv\lib\site-packages\dotenv\main.py", line 81, in parse for line in f: UnicodeDecodeError: 'gbk' codec can't decode byte 0x80 in position 166: illegal multibyte sequence

Madman
Madman shishijia Author

可能是你的 .env 文件中有中文等注释字符,需要修改 back-end/config.py:

load_dotenv(os.path.join(basedir, '.env'), encoding='utf-8')
Madman
Madman shishijia Author

检查 Python 版本,不是 Python 2.x

shishijia
shishijia Madman

必须要安装python2.x吗,不能使用python3吗?

shishijia
shishijia Madman

python是3.7的

Ryan0v0
Ryan0v0

请问这个网址还可以访问吗 https://madblog.ga

Ryan0v0
Ryan0v0 Ryan0v0

似乎打不开

Madman
Madman Ryan0v0 Author

这个免费域名过期了,测试地址为: http://120.77.33.143

yushoujun
yushoujun

附件在哪,代码在哪

Madman
Madman yushoujun Author

点击 [阅读全文],最新代码在本文末尾的 [附件] 中。一次购买,持久更新

bykoala
bykoala

测试一下评论是否可删除

NathanZhang1104
NathanZhang1104

除了rq worker没有成功,其他都照着做了,为啥打开http://localhost:8080是空白界面呢

Madman
Madman NathanZhang1104 Author

或者你可以阅读第20章或21章,有更详细的部署文档

chrisyuuuuu
chrisyuuuuu

阅读全文在哪呢

鸡排不进80不改名
鸡排不进80不改名

已配置config.py的ADMINS、已注册管理员账号、已登录管理员账号,但是怎么激活账户呢?

Madman
Madman 鸡排不进80不改名 Author

按照本文说明操作先修改config中admin邮箱,再启动应用并使用此邮箱注册的话,自动激活并设置为管理员角色。如果你不是这么操作的,也可以直接修改数据库

鸡排不进80不改名
鸡排不进80不改名 Madman

我将config.py中修改为ADMINS = ['我的邮箱@qq.com'],然后复制了.env并修改为

FLASK_APP=madblog.py
FLASK_DEBUG=1
FLASK_COVERAGE=1
ADMINS='我的邮箱@qq.com'
MAIL_SERVER='smtp.qq.com'
MAIL_PORT=465
MAIL_USE_SSL=1
MAIL_USERNAME='我的邮箱@qq.com'
MAIL_PASSWORD='我的授权码'
MAIL_SENDER='admin'
REDIS_URL='redis://127.0.0.1:6379/0'
ELASTICSEARCH_URL='127.0.0.1:9200'

请问除此以外我还需要进行什么修改吗?为什么注册新账户也无法收到确认邮件呢?

Madman
Madman 鸡排不进80不改名 Author

14章

牛奶python
牛奶python

代码是2019年的,不是最新的。没有上传图片功能。

wuleiyzu
wuleiyzu

你好: 在本地测试时,迁移数据的时候flask db update,出现错误KeyError: 'REDIS_URL',我的配置是REDIS_URL='redis://127.0.0.1:6379/0'没有修改。 本地已经安装了Redis是数据库,端口号6379没有错误,请问是出了什么问题呢?

Madman
Madman wuleiyzu Author

应该是 back-end/app/init.py 第 37 行报错了:

# 整合RQ任务队列
app.redis = Redis.from_url(app.config['REDIS_URL'])

没读到配置项,看一下 .env 配置文件的文件名是不是没有点号,python-dotenv 包有没有安装?

wuleiyzu
wuleiyzu Madman

文件名是.env.example,通过pip list查看python-dotenv已经安装了。

另外: 在配置 back-end/app/config.py 中, redis的url是REDIS_URL = os.environ.get('REDIS_URL') or 'redis://'。 在构造文件 back-end/app/init.py 中,配置函数是这样:

def configure_app(app, config_class):
    app.config.from_object(config_class)
    # 不检查路由中最后是否有斜杠/
    app.url_map.strict_slashes = False
    # 整合RQ任务队列
    app.redis = Redis.from_url(app.config['REDIS_URL'])
    app.task_queue = rq.Queue('madblog-tasks', connection=app.redis, default_timeout=3600)  # 设置任务队列中各任务的执行最大超时时间为 1 小时
    # Elasticsearch全文检索
    app.elasticsearch = Elasticsearch([app.config['ELASTICSEARCH_URL']]) \
        if app.config['ELASTICSEARCH_URL'] else None
Madman
Madman wuleiyzu Author

这篇文章 2.2 (1) 有说明,你没做吧:复制 back-end/.env.example,并重命名为 back-end/.env,然后修改里面的邮箱配置...

wuleiyzu
wuleiyzu Madman

抱歉抱歉,匆匆看了一下就直接使用了,改完就可以运行了,我去仔细看一下。谢谢博主。

wuleiyzu
wuleiyzu

你好,博主: 提交博客时,request 无法发送到 Flask API,出现错误:

Access to XMLHttpRequest at 'http://127.0.0.1:5000/api/posts' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

显示没有Access-Control-Allow-Origin请求头,是什么原因呢?

Madman
Madman wuleiyzu Author

建议按顺序阅读本系列文章,跨域问题在第2章:https://madmalls.com/blog/post/axios-use-flask-api/#3-axios-api

flask-cros 默认允许所有跨域访问:https://flask-cors.corydolphin.com/en/latest/configuration.html#cors-default-values

最新代码我重新部署过很多次一切正常,你可以启用 DEBUG 日志:https://flask-cors.corydolphin.com/en/latest/#troubleshooting

或者试试将 front-end/src/http.jsaxios.defaults.baseURL = 'http://127.0.0.1:5000';127.0.0.1 替换为你服务器 IP

wuleiyzu
wuleiyzu Madman

已经部署完成,并可以运行了,谢谢博主。

alex_
alex_

<button class="btn btn-block u-btn-outline-red g-rounded-50 g-py-12 g-mb-10" v-if="user.is_following && $route.params.id != sharedState.user_id" v-on:click="onUnfollowUser($route.params.id)"> Unfollow </button>

专题系列