我的编程空间,编程开发者的网络收藏夹
学习永远不晚

flask和vue前后端分离项目部署的示例代码

短信预约 -IT技能 免费直播动态提醒
省份

北京

  • 北京
  • 上海
  • 天津
  • 重庆
  • 河北
  • 山东
  • 辽宁
  • 黑龙江
  • 吉林
  • 甘肃
  • 青海
  • 河南
  • 江苏
  • 湖北
  • 湖南
  • 江西
  • 浙江
  • 广东
  • 云南
  • 福建
  • 海南
  • 山西
  • 四川
  • 陕西
  • 贵州
  • 安徽
  • 广西
  • 内蒙
  • 西藏
  • 新疆
  • 宁夏
  • 兵团
手机号立即预约

请填写图片验证码后获取短信验证码

看不清楚,换张图片

免费获取短信验证码

flask和vue前后端分离项目部署的示例代码

前段时间开发了一个项目, 我后端用的是flask框架写接口,前端用的是vue框架,项目前后端完全分离,部署的时候遇到一点问题,记录一下.

部署环境:centos6.5Python3.6.3flask0.12.0 vue

部署方式:uwsgi+nginx

步骤:

​ 1.首先安装python运行环境,正常
​ 2.安装uswsgi运行,正常(使用pip安装,pip install uwsgi):

新建config.ini文件


[uwsgi]

# uwsgi 启动时所使用的地址与端口,nginx代理的时候需要转发到该地址
socket = x.x.x.x:xxxx    
#python环境目录 
#home = /usr/local/python/bin
#指向网站根目录
chdir = /root/www
#python项目启动程序文件
wsgi-file = /root/www/run.py
#python程序内用于启动的application变量名
callable = app
#处理器数
processes = 3
#线程数
threads = 3
#状态监测地址
stats = 127.0.0.1:5000
#设置uwsgi包解析的内部缓存区大小。默认4k
buffer-size = 32768

uwsgi启动命令:


uwsgi config.ini   #该命令直接启动
uwsgi -d --ini config.ini  #该命令后台运行,常用

3.安装nginx,正常,我们是运维安装的,过程不表,请百度一下

问题来了:

​ 我们在同时代理vue和flask 的时候,不管怎么折腾,前端都无法访问到flask的地址

解决办法:

​ 使用了两个不同 的域名分别代理了vue和flask,vue指向flask的代理域名


user  nginx;
worker_processes  1;

error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;

pid        logs/nginx.pid;


events {
    worker_connections  xx;
    use epoll;
}


http {
    include       mime.types;
    default_type  application/octet-stream;

    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    #access_log  logs/access.log  main;
    server_tokens off;
    sendfile        on;
    #tcp_nopush     on;

    #keepalive_timeout  0;
    keepalive_timeout  xx;

    #gzip  on;
        server {
                listen xx;
                server_name  hqfund.com www.hqfund.com;
                return 301 https://$host$request_uri;
  }
 
 server {
  listen 443 ssl;
  server_name   xxx.com1;
         ssl_certificate     /xxxx;
         ssl_certificate_key /xxxx;


  
  location / {
              root /xxxx;
   index index.html index.htm;
  }
 }

    server {
                listen xx;
                server_name  xxx.com2;
                return 301 https://$host$request_uri;
  }
  
 server {
  listen xxx ssl;
  server_name  xxx.com2;
  ssl_certificate     /xxxx;
         ssl_certificate_key /xxxx;
  
  location / {
              include uwsgi_params;
   uwsgi_pass x.x.x.x:xx;
   proxy_http_version 1.1;
   proxy_set_header Upgrade $http_upgrade;
   proxy_set_header Connection "upgrade";
  }
 }
}

到此这篇关于flask和vue前后端分离项目部署的示例代码的文章就介绍到这了,更多相关flask和vue前后端分离内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

flask和vue前后端分离项目部署的示例代码

下载Word文档到电脑,方便收藏和打印~

下载Word文档

猜你喜欢

flask和vue前后端分离项目部署的代码怎么写

本篇文章为大家展示了flask和vue前后端分离项目部署的代码怎么写,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。前段时间开发了一个项目, 我后端用的是flask框架写接口,前端用的是vue框架,项
2023-06-25

使用Docker部署前后端分离项目的完整步骤

刚刚接触基础的运维工作,采用的是docker部署的方式,下面这篇文章主要给大家介绍了关于使用Docker部署前后端分离项目的相关资料,文中通过图文介绍的非常详细,需要的朋友可以参考下
2023-01-09

es+flask搜索小项目实现分页和高亮的示例代码怎么写

这篇文章的内容主要围绕es+flask搜索小项目实现分页和高亮的示例代码怎么写进行讲述,文章内容清晰易懂,条理清晰,非常适合新手学习,值得大家去阅读。感兴趣的朋友可以跟随小编一起阅读吧。希望大家通过这篇文章有所收获!环境前端:html,cs
2023-06-26

编程热搜

目录