欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

flask和vue前后端分離項(xiàng)目部署的示例代碼

 更新時(shí)間:2021年12月12日 15:37:48   作者:Ben·Chen  
本文主要介紹了flask和vue前后端分離項(xiàng)目部署的示例代碼,文中通過(guò)示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下

前段時(shí)間開(kāi)發(fā)了一個(gè)項(xiàng)目, 我后端用的是flask框架寫(xiě)接口,前端用的是vue框架,項(xiàng)目前后端完全分離,部署的時(shí)候遇到一點(diǎn)問(wèn)題,記錄一下.

部署環(huán)境:centos6.5、Python3.6.3 、flask0.12.0 vue

部署方式:uwsgi+nginx

步驟:

? 1.首先安裝python運(yùn)行環(huán)境,正常
? 2.安裝uswsgi運(yùn)行,正常(使用pip安裝,pip install uwsgi):

新建config.ini文件

[uwsgi]

# uwsgi 啟動(dòng)時(shí)所使用的地址與端口,nginx代理的時(shí)候需要轉(zhuǎn)發(fā)到該地址
socket = x.x.x.x:xxxx    
#python環(huán)境目錄 
#home = /usr/local/python/bin
#指向網(wǎng)站根目錄
chdir = /root/www
#python項(xiàng)目啟動(dòng)程序文件
wsgi-file = /root/www/run.py
#python程序內(nèi)用于啟動(dòng)的application變量名
callable = app
#處理器數(shù)
processes = 3
#線程數(shù)
threads = 3
#狀態(tài)監(jiān)測(cè)地址
stats = 127.0.0.1:5000
#設(shè)置uwsgi包解析的內(nèi)部緩存區(qū)大小。默認(rèn)4k
buffer-size = 32768

uwsgi啟動(dòng)命令:

uwsgi config.ini   #該命令直接啟動(dòng)
uwsgi -d --ini config.ini  #該命令后臺(tái)運(yùn)行,常用

3.安裝nginx,正常,我們是運(yùn)維安裝的,過(guò)程不表,請(qǐng)百度一下

問(wèn)題來(lái)了:

? 我們?cè)谕瑫r(shí)代理vue和flask 的時(shí)候,不管怎么折騰,前端都無(wú)法訪問(wèn)到flask的地址

解決辦法:

? 使用了兩個(gè)不同 的域名分別代理了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";
  }
 }
}

到此這篇關(guān)于flask和vue前后端分離項(xiàng)目部署的示例代碼的文章就介紹到這了,更多相關(guān)flask和vue前后端分離內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

  • 新手簡(jiǎn)單了解vue

    新手簡(jiǎn)單了解vue

    Vue.js是一個(gè)構(gòu)建數(shù)據(jù)驅(qū)動(dòng)的 web 界面的漸進(jìn)式框架。Vue.js 的目標(biāo)是通過(guò)盡可能簡(jiǎn)單的 API 實(shí)現(xiàn)響應(yīng)的數(shù)據(jù)綁定和組合的視圖組件。下面我們來(lái)簡(jiǎn)單了解下吧
    2019-05-05
  • 從0到1搭建element后臺(tái)框架優(yōu)化篇(打包優(yōu)化)

    從0到1搭建element后臺(tái)框架優(yōu)化篇(打包優(yōu)化)

    這篇文章主要介紹了從0到1搭建element后臺(tái)框架優(yōu)化篇(打包優(yōu)化),小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2019-05-05
  • vue3動(dòng)態(tài)路由刷新出現(xiàn)空白頁(yè)的原因與最優(yōu)解

    vue3動(dòng)態(tài)路由刷新出現(xiàn)空白頁(yè)的原因與最優(yōu)解

    頁(yè)面刷新白屏其實(shí)是因?yàn)関uex引起的,由于刷新頁(yè)面vuex數(shù)據(jù)會(huì)丟失,這篇文章主要給大家介紹了關(guān)于vue3動(dòng)態(tài)路由刷新出現(xiàn)空白頁(yè)的原因與最優(yōu)解的相關(guān)資料,需要的朋友可以參考下
    2023-11-11
  • 詳解Vue CLI3配置解析之css.extract

    詳解Vue CLI3配置解析之css.extract

    這篇文章主要介紹了詳解Vue CLI3配置解析之css.extract,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2018-09-09
  • Vue3學(xué)習(xí)之事件處理詳解

    Vue3學(xué)習(xí)之事件處理詳解

    Vue事件處理是每個(gè)Vue項(xiàng)目的必要方面。 它用于捕獲用戶輸入,共享數(shù)據(jù)以及許多其他創(chuàng)造性方式。本文將通過(guò)簡(jiǎn)單的示例為大家講解了Vue3中事件處理的使用,需要的可以參考一下
    2022-12-12
  • vue2.0實(shí)戰(zhàn)之使用vue-cli搭建項(xiàng)目(2)

    vue2.0實(shí)戰(zhàn)之使用vue-cli搭建項(xiàng)目(2)

    這篇文章主要為大家詳細(xì)介紹了vue2.0實(shí)戰(zhàn)第二篇使用vue-cli搭建項(xiàng)目,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2017-03-03
  • Vue封裝--如何將數(shù)字轉(zhuǎn)換成萬(wàn)

    Vue封裝--如何將數(shù)字轉(zhuǎn)換成萬(wàn)

    這篇文章主要介紹了Vue封裝--將數(shù)字轉(zhuǎn)換成萬(wàn)的實(shí)現(xiàn)方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
    2022-07-07
  • vue.js多頁(yè)面開(kāi)發(fā)環(huán)境搭建過(guò)程

    vue.js多頁(yè)面開(kāi)發(fā)環(huán)境搭建過(guò)程

    利用 vue-cli 搭建的項(xiàng)目大都是單頁(yè)面應(yīng)用項(xiàng)目,對(duì)于簡(jiǎn)單的項(xiàng)目,單頁(yè)面就能滿足要求。這篇文章主要介紹了vue.js多頁(yè)面開(kāi)發(fā)環(huán)境搭建 ,需要的朋友可以參考下
    2019-04-04
  • vue3如何使用provide實(shí)現(xiàn)狀態(tài)管理詳解

    vue3如何使用provide實(shí)現(xiàn)狀態(tài)管理詳解

    Vue3中有一對(duì)新增的api,provide和inject,熟悉Vue2的朋友應(yīng)該明,這篇文章主要給大家介紹了關(guān)于vue3如何使用provide實(shí)現(xiàn)狀態(tài)管理的相關(guān)資料,需要的朋友可以參考下
    2021-10-10
  • 如何使用VUE+faceApi.js實(shí)現(xiàn)攝像頭拍攝人臉識(shí)別

    如何使用VUE+faceApi.js實(shí)現(xiàn)攝像頭拍攝人臉識(shí)別

    Face-api.js是一個(gè)JavaScript API,是基于tensorflow.js核心API 的人臉檢測(cè)和人臉識(shí)別的瀏覽器實(shí)現(xiàn),這篇文章主要給大家介紹了關(guān)于如何使用VUE+faceApi.js實(shí)現(xiàn)攝像頭拍攝人臉識(shí)別的相關(guān)資料,需要的朋友可以參考下
    2023-05-05

最新評(píng)論