ASP.NET Web Forms调用外部API并展示响应的问题排查

我找到了许多关于ASP.NET Web API的文章，但完全没有关于经典Web Forms的内容。我想要调用一个外部API并将其结果显示在网页的文本框中，不过尽管API调用成功，响应却未在页面上显示。

C#后台代码：

protected void btnOptimize_Click(object sender, EventArgs e) {
  Optimize();
}

public async Task Optimize() {
  string URI = "https://EXTERNAL_API_BASE_URL/POST";
  string auth = "Bearer XXXX";

  var client = new HttpClient();

  MyData data = new MyData();
  data.text = "Hello world";

  string requestBody = JsonConvert.SerializeObject(data);

  var stringContent = new StringContent(requestBody);

  client.DefaultRequestHeaders.Add("Content-Type", "application/json");
  client.DefaultRequestHeaders.Add("Authorization", auth);

  var response = await client.PostAsync(URI, stringContent);

  //display on page's text field
  txtResponse.Value = response.Content.ToString();
}

ASP.NET页面：

<body>
    <form id="form1" runat="server">
        <div>
            <textarea runat="server" id="txtInput"></textarea>
            <asp:Button ID="btnOptimize" runat="server" OnClick="btnOptimize_Click" Text="Generate" />
            <textarea runat="server" id="txtResponse"></textarea>
        </div>
    </form>
</body>

我应该做出哪些修改？是否需要在ASP.NET页面中添加UpdatePanel？

1. 修复异步方法调用逻辑 #

当前按钮点击事件直接调用Optimize()但未等待异步操作完成，页面回发会提前结束，导致赋值操作无法生效。需要将按钮事件改为异步方法并等待Optimize()：

protected async void btnOptimize_Click(object sender, EventArgs e) {
  await Optimize();
}

2. 正确读取API响应内容 #

response.Content.ToString()获取的是HttpContent对象的类型名称，而非实际响应内容。需要用异步方法读取响应字符串，同时建议添加响应状态检查：

// 替换原赋值代码
if (response.IsSuccessStatusCode)
{
    string responseText = await response.Content.ReadAsStringAsync();
    txtResponse.Value = responseText;
}
else
{
    txtResponse.Value = $"API调用失败：{(int)response.StatusCode} {response.ReasonPhrase}";
}

3. 优化HttpClient使用（可选但推荐） #

HttpClient不应每次请求都实例化，建议复用单例避免资源浪费：

private static readonly HttpClient _client = new HttpClient();

public async Task Optimize() {
  string URI = "https://EXTERNAL_API_BASE_URL/POST";
  string auth = "Bearer XXXX";

  MyData data = new MyData();
  data.text = "Hello world";

  string requestBody = JsonConvert.SerializeObject(data);
  // 直接在StringContent中指定编码和内容类型，避免重复添加请求头
  var stringContent = new StringContent(requestBody, Encoding.UTF8, "application/json");

  _client.DefaultRequestHeaders.Authorization = new AuthenticationHeaderValue("Bearer", auth);

  var response = await _client.PostAsync(URI, stringContent);

  // 读取响应代码同上
}

关于UpdatePanel的选择 #

UpdatePanel不是必须的，但如果想避免整页回发、实现局部刷新，可以添加：

<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <div>
                    <textarea runat="server" id="txtInput"></textarea>
                    <asp:Button ID="btnOptimize" runat="server" OnClick="btnOptimize_Click" Text="Generate" />
                    <textarea runat="server" id="txtResponse"></textarea>
                </div>
            </ContentTemplate>
        </asp:UpdatePanel>
    </form>
</body>

注意必须添加ScriptManager控件，UpdatePanel才能正常工作。

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