如何動態(tài)配置靜態(tài)文件夾 static
問題
默認的Flask項目文件結(jié)構(gòu)是這樣的:
/app.py
/static
/js
/css
/img
/templates
/index.html
然后则酝,你的前端訪問后臺靜態(tài)資源鳖枕,是通過這個/static/file.name
url:
<link as=style href=/static/css/app.697eaad8.css rel=preload>
<img src="/static/img/mylogo.jpg" />
問題來了惠奸,在有些前端應用中梅誓,資源文件必須要使用根路徑/
!
比如PWA的manifest文件:
<link rel=manifest href=/manifest.json>
如何讓Flask訪問到這些根路徑的文件呢佛南?
解決
文檔:http://flask.pocoo.org/docs/1.0/api/#configuration
class flask.Flask(import_name, static_url_path=None, static_folder='static', static_host=None, host_matching=False, subdomain_matching=False, template_folder='templates', instance_path=None, instance_relative_config=False, root_path=None)
配置一下static_url_path
梗掰、static_folder
就可以了。
- static_url_path:
前端訪問資源文件的前綴目錄嗅回。默認是/static
及穗,就是前端必須這樣訪問:<img src="/static/img/mylogo.jpg" />
我們改成 '',就可以這樣訪問了:<img src="/img/mylogo.jpg" />
妈拌。就達到前端從根目錄訪問的目的了拥坛。 - static_folder:
后端存儲資源文件的目錄。默認是/static
尘分,就是指明你后端的資源文件猜惋,是放在<your project>/static/
目錄下,一般不需要改動培愁。
一個粟子:
from flask import Flask, render_template
app = Flask(__name__, static_url_path='')
@app.route('/')
def index():
return render_template('index.html')
源碼:https://github.com/kevinqqnj/flask-vue-pwa
PWA演示:https://flask-vue-pwa.herokuapp.com/