Question

我想知道将某些JSON数据从服务器发送到客户端时存储在不同目录中的位置。

我正在尝试构建简单的API，该API将JSON数据从服务器端（端口号：5001）发送到客户端（端口号：3000）。

我在做这个项目时注意到，http标头和正文不是要包含JSON的地方。

如果是，JSON数据如何传递到客户端？我想知道代码隐藏中会发生什么。

以下是我编写的用于构建简单API的代码：

客户端代码：

componentDidMount() {
    axios.get('localhost:5001')
      .then((result) => console.log(result))
      .catch((err)  =>  console.log('Error ocurred'));
}

服务器端代码（ASP.NET Core 2.0）：

UserPosts result = new UserPosts();
                result.id = 1;
                result.Name = "jay";
                result.Password = "1004";
                result.Content = "This is text from the server";
                string json = JsonConvert.SerializeObject(result);
                context.Response.ContentType = "application/json; 
charset=utf-8";

                await context.Response.WriteAsync(json);

我希望将名为“结果”的JSON数据附加到HTTP标头或正文中，但没有。当我在控制台上检查http正文的原始数据时，它只是html内容。这是浏览器上显示的内容：

{“ id”：1，“名称”：“杰伊”，“密码”：“ 1004”，“内容”：“这是来自服务器的文本”}

正如我在代码中编写的那样，我希望在控制台上而不是在浏览器视图页面上获得此数据。

Answer 1

似乎您从服务器端返回错误。您首先应该Enable Cross-Origin Requests (CORS) in ASP.NET Core

在ConfigureServices中将CORS添加到您的Web api：

services.AddCors(o => o.AddPolicy("MyPolicy", builder =>
{
    builder.AllowAnyOrigin()
          .AllowAnyMethod()
          .AllowAnyHeader();
}));

并在Configure函数中启用它：

app.UseCors("MyPolicy");

如果您有中间件来修改Web API中的响应：

app.Run(async (context) =>
{

    UserPosts result = new UserPosts();
    result.id = 1;
    result.Name = "jay";
    result.Password = "1004";
    result.Content = "This is text from the server";
    string json = JsonConvert.SerializeObject(result);
    context.Response.ContentType = "application/json; charset = utf - 8";          
    await context.Response.WriteAsync(json);
});

在客户端中，您可以通过响应访问.data来获得结果：

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script>
    function test(){
        axios.get('http://localhost:5001/api/values')
            .then(
                (result) => console.log(result.data)
            )
            .catch(
                (err) => console.log('Error ocurred')
            );
    }

</script>

Answer 2

花了很长时间弄清楚发生了什么情况以及有关AJAX请求的一般资源后，我注意到Google不支持从 localhost到localhost 的CORS。我认为这就是为什么即使我将每个COURS选项都放在ConfigureServices中并使用了它也似乎不起作用的原因。

因此，在设置中关闭SSL认证选项后，我在Postman上尝试了相同的AJAX请求，最终得到了预期的结果。

当我通过AJAX获取JSON数据时，该数据存储在哪里？

2 个答案: