JavascriptのフェッチでFlaskファイルが更新されない

Question

Flaskサーバーがシンプルです。私のサーバーがこのファイルを処理し、新しい結果ファイル（MusicXML）を作成した後、そのファイルをブラウザにレンダリングすると、ユーザーはまず自分のサーバー（mp3）に音楽ファイルをアップロードします。だからここ

@app.route('/', methods=['GET', 'POST']) 
def index(): 
    if request.method == "GET": 
    return render_template('index.html', request="GET") 
    else: 
    file = request.files['file'] 
    handle_file(file) 
    return render_template('index.html', request="POST") 

@app.route('/mxl') 
def mxl(): 
    return send_from_directory(UPLOAD_FOLDER, 'piece.mxl') 

def handle_file(file): 
    filename = secure_filename(file.filename) 
    filepath = os.path.join(app.config['UPLOAD_FOLDER'], filename) 
    file.save(filepath) 
    pitches = mir.transcribe(filepath) 
    os.remove(filepath) 

我々はまず見ることができ、'/'でユーザーの訪問：

は、ここに私のフラスコルーティングです。その後、音楽ファイルがアップロードされ（POSTメソッド）、handle_file()が呼び出されます。これは、ファイルを処理し、 "result" musicXMLファイルを作成するmir.transcribeを呼び出します。

MusicXMLファイルは、Music21モジュールを使用して静的フォルダに作成され、保存されます。だから、パッケージmirに我々はしている：

def transcribe(filename): 
    ... 
    note_stream.write("musicxml", "static/piece.mxl") 

ときhandle_file()戻り、我々はrequest='POST'でrender_templateを呼び出します。ここに私のindex.htmlですので

{%- extends "base.html" %} 

{% import "bootstrap/utils.html" as utils %} 

{% block content %} 
    {% if request == "GET": %} 

    <!-- uploading file form --> 

    {% else: %} 

    <script> 
    // This is the important part, where we call fetch to obtain the 
    // MusicXML file we created on the server. 
    fetch('http://localhost:5000/mxl') 
     .then(function (response) { 
     return response.text(); 
     }) 
     .then(function (mxl) { 
     console.log(mxl); 
     return embed.loadMusicXML(mxl); 
     }) 
     .then(function() { 
     console.log("Score loaded in the embed!"); 
     }) 
     .catch(function (error) { 
     console.log("Unable to load the score!"); 
     }); 
    </script> 

    {% endif %} 
{% endblock %} 

{% block scripts %} 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script> 
    <!--<script src="static/js/record.js"></script>--> 
{% endblock %} 

、あなたが見ることができるように、我々render_template後、fetchが呼び出されます。

フェッチは、新しく作成されたMusicXMLファイルではなく、以前のバージョンを返すことがあります。しかし、私がstaticフォルダに行った場合、そこに含まれているMusicXMLファイルは新しいものです！

どうしてですか？

Answer 1

したい場合は、すべてのあなたの要求、のようなもののためにキャッシュを無効にすることを強制することができます。

@app.after_request 
def add_header(response): 
    response.cache_control.max_age = 300 
    if 'Cache-Control' not in response.headers: 
     response.headers['Cache-Control'] = 'no-store' 
    return response 

か、あなたのapp内のすべての静的ファイルのデフォルト値を設定することができます。

app = Flask(__name___) 
app.config['SEND_FILE_MAX_AGE_DEFAULT'] = 60