我在Flask中为inline-js配置CSP nonce的实现存在什么问题？

问题排查&修复方案 #

1. Nonce类型错误 #

base64.b64encode返回的是bytes类型，直接传入模板渲染会带上b'前缀，导致和CSP头里的nonce不匹配，需要转成utf-8字符串：

def GetCspNonce():
    """Returns a random nonce."""
    NONCE_LENGTH = 16
    # 新增decode转字符串
    return base64.b64encode(os.urandom(NONCE_LENGTH)).decode('utf-8')

2. CSP配置没有动态替换nonce且语法错误 #

你把CSP配置写死在create_app里是无效的，nonce需要每个请求动态生成，再动态写入响应的CSP头，同时你现有配置存在语法错误：

• 数组中https://www.goog....字符串未闭合
• 静态写死的nonce-{nonce}不会自动替换为当前请求生成的nonce值
• 显式声明script-src后，default-src的'self'规则不会自动继承，需手动添加到script-src中，否则同域静态脚本也会被拦截

修复方案：可以用Flask的请求钩子每个请求动态生成nonce并注入CSP头，示例如下：

# 在create_app中添加请求钩子
def create_app():
    app = Flask(__name__)
    # 其他初始化逻辑...

    @app.after_request
    def add_csp_header(response):
        # 每个请求生成新的nonce
        nonce = GetCspNonce()
        # 把nonce存入g对象，方便视图/模板调用
        g.csp_nonce = nonce
        # 动态拼接CSP规则
        csp = {
            'default-src': ["'self'"],
            'script-src': [
                "'self'",
                "https://www.goog...",
                f"'nonce-{nonce}'"
            ]
            # 其他CSP规则...
        }
        # 拼接成CSP头字符串
        csp_str = '; '.join([f"{k} {' '.join(v)}" for k, v in csp.items()])
        response.headers['Content-Security-Policy'] = csp_str
        return response
    
    return app

对应视图里不需要再单独生成nonce，直接从g对象取即可：

return render_template('base/timer.html', timer=timer, nonce=g.csp_nonce)

3. 模板变量插值语法错误 #

Jinja2模板的变量渲染需要用{{ 变量名 }}格式，你写的{nonce}不会被解析，会原样输出到页面，导致nonce属性不匹配：

<script type="text/javascript" src="../static/text/script.js" nonce="{{ nonce }}"></script>

4. 静态资源路径&规则校验 #

如果修改后script.js仍然被拦截，确认两点：

• 你显式配置的script-src已经添加了'self'或者静态资源对应的域名
• 建议把静态资源路径改成Flask标准的{{ url_for('static', filename='text/script.js') }}，避免相对路径引发的跨路径匹配问题

内容的提问来源于stack exchange，提问作者Karin Moe