Выводится undefined вместо текста c# ASP.NET Core

Рейтинг: 1Ответов: 0Опубликовано: 19.05.2023

Начал изучать ASP.NET Core и столкнулся с небольшой проблемой. Пишу очень простое Web Api по metanit, вот код.

using Microsoft.AspNetCore.Http.Json;
using System.Text;
using System.Text.RegularExpressions;
using System.Text.Json;
using System.Text.Json.Serialization;
using System.Runtime.InteropServices;

List<Person> persons = new List<Person>()
{
    new Person(){ Id = Guid.NewGuid().ToString(), Name = "Andy", Age = 19},
    new Person(){ Id = Guid.NewGuid().ToString(), Name = "Sasha", Age = 20},
    new Person(){ Id = Guid.NewGuid().ToString(), Name = "Meliodas", Age = 3000},
};

var builder = WebApplication.CreateBuilder(args);
var app = builder.Build();


app.Run(async (context) =>
{
    var response = context.Response;
    var request = context.Request;
    string path = request.Path;

    string expressionForGuid = @"^/api/users/\w{8}-\w{4}-\w{4}-\w{4}-\w{12}$";

    if (path == "/api/users" && request.Method == "GET")
    {
        await GetAllPeople(response);
    }
    else if (Regex.IsMatch(path, expressionForGuid) && request.Method == "GET")
    {
        string? id = path.Split("/")[3];
        await GetPerson(id, response);
    }
    else if (path == "/api/users" && request.Method == "POST")
    {
        await CreatePerson(request, response);
    }
    else if (Regex.IsMatch(path, expressionForGuid) && request.Method == "PUT")
    {
        string? id = path.Split("/")[3];
        await PutPerson(id, response, request);
    }
    else if (Regex.IsMatch(path, expressionForGuid) && request.Method == "DELETE")
    {
        string? id = path.Split("/")[3];
        await DeletePerson(id, response);
    }
    else
    {
        response.ContentType = "text/html; charset=utf-8";
        await response.SendFileAsync("html/htmlpage.html");
    }
});

app.Run();

async Task GetAllPeople(HttpResponse response)
{
    await response.WriteAsJsonAsync(persons);
}

async Task GetPerson(string? id, HttpResponse response)
{
    Person? person = persons.FirstOrDefault<Person>((Person per) => per.Id == id);

    if (person != null)
    {
        await response.WriteAsJsonAsync(person);
    }
    else
    {
        response.StatusCode = 404;
        await response.WriteAsJsonAsync(new {message = "Человек не найден"});
    }
}

async Task CreatePerson(HttpRequest request,HttpResponse response)
{
    if (request.HasJsonContentType())
    {
        Person? person = await request.ReadFromJsonAsync<Person>();
        if (person != null)
        {
            person.Id = Guid.NewGuid().ToString();
            await response.WriteAsJsonAsync(person);
            persons.Add(person);
        }
        else
        {
            response.StatusCode = 400;
            await response.WriteAsJsonAsync(new { message = "Некорректные данные" });
        }
    }
    else
    {
        response.StatusCode = 400;
        await response.WriteAsJsonAsync(new {message = "Некорректные данные"});
    }
}

async Task PutPerson(string id, HttpResponse response, HttpRequest request)
{
    if (request.HasJsonContentType())
    {
        Person? userData = await request.ReadFromJsonAsync<Person>();
        if (userData != null)
        {
            Person? person = persons.FirstOrDefault<Person>((Person p) => p.Id == id);
            if (person != null)
            {
                person.Age = userData.Age;
                person.Name = userData.Name;
                await response.WriteAsJsonAsync(person);
            }
            else
            {
                response.StatusCode = 404;
                await response.WriteAsJsonAsync(new {message = "Пользователь не найден"});
            }
        }
        else
        {
            response.StatusCode = 400;
            await response.WriteAsJsonAsync(new {message = "Некорректные данные"});
        }
    }
}

async Task DeletePerson(string id, HttpResponse response)
{
    Person? person = persons.FirstOrDefault<Person>((Person p) => p.Id == id);
    if (person != null)
    {
        persons.Remove(person);
        await response.WriteAsJsonAsync(person);
    }
    else
    {
        response.StatusCode = 404;
        await response.WriteAsJsonAsync(new {message = "Пользователь не найден"});
    }
}

public class Person
{
    public string? Id { get; set; }
    public string? Name { get; set; }
    public int Age { get; set; }
}

Вот разметка страницы:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>METANIT.COM</title>
</head>
<body>
    <h2>User form</h2>
    <div id="message"></div>
    <div>
        <p>
            Name: <br />
            <input name="Name" id="userName" />
        </p>
        <p>
            Age: <br />
            <input name="Age" id="userAge" type="number" />
        </p>
        <button id="sendBtn">Send</button>
    </div>
    <script>document.getElementById("sendBtn").addEventListener("click", send);
        async function send() {
            const response = await fetch("/api/users", {
                method: "POST",
                headers: { "Accept": "application/json", "Content-Type": "application/json" },
                body: JSON.stringify({
                    Name: document.getElementById("userName").value,
                    Age: document.getElementById("userAge").value
                })
            });
            const message = await response.json();
            document.getElementById("message").innerText = message.text;
        }</script>
</body>
</html>

Я в принципе понимаю что и как здесь работает.(код страницы не дописан). Если я ввел в поля формы что-то, и нажал на кнопку, то отправляется POST запрос, по которому создается новый объект Person, помещается в List, и выводится. Объект то создается и помещается, вот только выводится почему-то undefined на экран. Я подозреваю что как то не так надо JSON в текст превращать, но до этого вроде выводил объекты разные правильно на экран. Объясните пожалуйста в чем дело. введите сюда описание изображения введите сюда описание изображения

Ответы

Ответов пока нет.