Flask：如何在同一渲染页面展示API调用返回的指定字段

你当前的核心问题是：仅在后端日志打印了接口响应文本，没有将结构化的响应数据传入Flask模板的渲染上下文，同时也没有正确使用Jinja2模板的动态输出语法，按照以下步骤修改即可实现需求：

1. 后端路由改造（app.py） #

• 先修复原代码的语法错误：原headers定义中Authorization字段的字符串缺失闭合引号，会直接触发Python语法报错，需补上。
• 利用requests库自带的response.json()方法，直接将响应文本转为合法的Python字典，无需手动调用json.loads处理，该方法会自动适配响应编码、格式，健壮性更高，是官方推荐的最优解析方式。
• 将需要渲染的id字段注入模板渲染上下文，保证页面能获取到对应值。

import requests
from flask import request, render_template
# 省略你已有的Flask初始化、ReusableForm 类定义代码

@app.route('/alert', methods=['GET', 'POST'])
def alert():
    form = ReusableForm(request.form)
    resp_id = None  # 初始化变量，避免非GET请求场景下模板引用未定义变量报错
     
    if request.method == 'GET': 
        url = "https://xxxxxxxxxxxxxxxxxxxxx.com/api/v1"
        payload = "{}"
        headers = {
            'Content-Type': 'application/json',
            'Accept': 'application/json, application/xml',
            # 修复原代码缺失的闭合引号
            'Authorization': 'Bearer xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx'
        }
        response = requests.request("POST", url, headers=headers, data=payload)
        # 保留原有日志输出
        print(response.text)
        # 解析响应为结构化字典，加异常捕获避免非JSON格式导致页面崩溃
        try:
            resp_data = response.json()
            # 用get方法提取id，避免字段缺失时抛出KeyError
            resp_id = resp_data.get('id')
        except Exception as e:
            print(f"接口响应解析失败，错误信息：{str(e)}")
    
    # 将解析得到的resp_id传入模板渲染上下文
    return render_template('index.html', form=form, resp_id=resp_id)

2. 前端模板改造（index.html） #

Flask 默认使用的Jinja2模板引擎，动态变量的输出语法为{{ 变量名 }}，你原代码中写的单花括号占位符会被当成普通静态文本输出，无法渲染动态值。修改后的模板代码如下：

<html>
<body>
接口返回的ID值：{{ resp_id }}
</body>
</html>

补充说明 #

• 若需要对id为空的场景做兜底展示，可直接在模板中写判断逻辑：{{ resp_id if resp_id else "暂无有效返回" }}
• 不需要将整个response对象传入模板，仅传递需要渲染的字段即可，减少不必要的上下文冗余。
• response.json() 会自动处理JSON字符串中的转义字符，无需手动做字符串替换。

内容的提问来源于stack exchange，提问作者Luke To