Выводится undefined вместо текста c# ASP.NET Core
Начал изучать 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 в текст превращать, но до этого вроде выводил объекты разные правильно на экран. Объясните пожалуйста в чем дело.
Источник: Stack Overflow на русском