CSRF 令牌始终为空（Flask-WTF、Jinja、Axios、JavaScript）

Question

我一直在尝试将 CSRF 集成到我的 Flask 应用程序中。它由一堆 Python 代码、一些 HTML 和一些 JavaScript 文件组成。

初始设置很顺利 (init.py)：

from flask_wtf.csrf import CSRFProtect
csrf = CSRFProtect()
csrf.init_app(app)

这是它应该做的，请求是 blocked/require CSRF 令牌。

但是，当我进入 JavaScript 文件相应地调整它们时，像这样引用 csrf 令牌：

content= "{{ csrf_token() }}"

只有 returns "csrf_token()" 作为标记，而不是实际值。

我认为这是 Jinja 的问题（好像我必须告诉它一些东西，所以方法 returns 是一个合适的值，但我缺乏这方面的知识）。

Answer 1

您提到您在其中一个 JavaScript 文件中添加了 {{ csrf_token() }} 行；然而，Jinja 在解析这些类型的参数 时实际考虑的是显式 HTML 文件的内容 ，因此不会访问外部 JavaScript 文件，即使您将它们导入您的 HTML 文件。

因此，如果您尝试在 HTML 的隐式脚本中使用它，它应该可以工作：

main.py:

from flask import Flask, render_template
from flask_wtf import CSRFProtect

csrf = CSRFProtect()
app = Flask(__name__)
app.config.update(
SECRET_KEY='flask_rocks'
)
csrf.init_app(app)

@app.route("/")
def index():
    return render_template("index.html")

if __name__ == "__main__":
    app.run(debug=True, port=8080)

static/script.js:

var mytoken = "{{ csrf_token() }}"

templates/index.html:

<html>
        <head>
                <title>Whatever</title>
        </head>
        <body>
                <script src="{{ url_for('static',filename='script.js') }}"></script>
                <script>
                var myactualtoken = "{{ csrf_token() }}";
                console.log("This will work: " + myactualtoken);
                console.log("This won't work: " + mytoken);
                </script>
        </body>
</html>

控制台输出：

This will work: ImZhYWFlMDY5MTEyNzZkODRlNWQ1Y2MyZjAwY2QxZDY2MzJmOTQ1ZDEi.YNnSlQ.MI8T3MbsFAROy81IFCrdESF85rA
This won't work: {{ csrf_token() }}

我建议查看 official docs 以获得更多见解。

CSRF 令牌始终为空（Flask-WTF、Jinja、Axios、JavaScript）

CSRF Token always empty (Flask-WTF, Jinja, Axios, JavaScript)

javascript

python

jinja2

flask

flask-wtforms