Когда я получаю данные JSON через AJAX, где хранятся данные?

Question

Я хочу знать, где хранятся определенные данные JSON при их отправке с сервера на клиент, которые существуют в другом каталоге.

Я пытаюсь создать простой 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 с именем 'result' будут присоединены к заголовку или телу HTTP, но это не так. Когда я проверял необработанные данные http body на консоли, это был просто HTML-контент. Это содержимое отображается в браузере:

{"id": 1, "Name": "jay", "Password": "1004", "Content": "Это текст с сервера"}

Как я уже писал в коде, я хочу, чтобы эти данные на консоли отсутствовали на странице просмотра браузера.

Answer 1

Потратив много времени на выяснение того, что произошло, и общих ресурсов, касающихся запроса AJAX, я заметил, что Google не поддерживает от localhost до localhost CORS. Я думаю, именно поэтому кажется, что это не сработало, хотя я включил все параметры COURS в ConfigureServices и использовал их.

Итак, я попробовал тот же AJAX-запрос на Postman после отключения опции SSL-сертификации в настройках, и я наконец получил ожидаемый результат.

Answer 2

Кажется, вы получили ошибку, возвращаемую со стороны сервера.Сначала вам нужно включить запросы кросс-происхождения (CORS) в ASP.NET Core

Добавить CORS к вашему веб-интерфейсу в ConfigureServices:

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

и включитьчто в Configure function:

app.UseCors("MyPolicy");

Если у вас есть промежуточное ПО для изменения ответа в вашем веб-интерфейсе:

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>