Сетевое приложение, которые выдает описание растения - C# ASP.NET Core - Ответ 17128770

@Vanya0809 · 27.11.2023, 15:06 **[ТС]**

Я делала по этой инструкции::

1. Создайте новый проект в Visual Studio 2022 Enterprise выбрав шаблон "ASP.NET Core Web Application".
2. В появившемся окне выберите шаблон "Empty" и убедитесь, что включена опция "Enable Docker Support" (если вы не планируете использовать Docker, можно не включать эту опцию).
3. Нажмите "Create" и дождитесь завершения процесса создания проекта.
4. В Solution Explorer щелкните правой кнопкой мыши на проекте, выберите "Add" и затем "New Folder". Назовите новую папку "Models".
5. Щелкните правой кнопкой мыши на папке "Models", выберите "Add" и затем "Class". Назовите новый класс "Name".
6. Откройте класс "Name.cs" и добавьте следующий код:

C#

public class Name
{
    public string FirstName { get; set; }
    public string Description { get; set; }
    public string Meaning { get; set; }
}

7. В Solution Explorer щелкните правой кнопкой мыши на папке "Controllers", выберите "Add" и затем "Controller". Выберите шаблон "API Controller - Empty".
8. Назовите новый контроллер "NamesController.cs" и добавьте следующий код:

C#

using Microsoft.AspNetCore.Mvc;
using System.Collections.Generic;
 
namespace YourAppName.Controllers
{
    [Route("api/[controller]")]
    [ApiController]
    public class NamesController : ControllerBase
    {
        private static List<Name> names = new List<Name>
        {
            new Name { FirstName = "John", Description = "Desc1", Meaning = "Meaning1" },
            new Name { FirstName = "Jane", Description = "Desc2", Meaning = "Meaning2" }
        };
 
        [HttpGet("{firstName}")]
        public ActionResult<Name> Get(string firstName)
        {
            var name = names.Find(n => n.FirstName.ToLower() == firstName.ToLower());
            
            if (name == null)
            {
                return NotFound();
            }
            
            return name;
        }
 
        [HttpPost]
        public ActionResult Post(Name name)
        {
            names.Add(name);
            return Ok();
        }
    }
}

9. В Solution Explorer щелкните правой кнопкой мыши на проекте, выберите "Add" и затем "New Folder". Назовите новую папку "wwwroot".
10. В папке "wwwroot" создайте новый файл "index.html" и добавьте следующий код:

HTML5

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Имя</title>
</head>
<body>
    <h1>Введите имя:</h1>
    <input type="text" id="firstNameInput" />
    <button onclick="getName()">Получить описание и значение</button>
    <div id="result"></div>
 
    <script>
        async function getName() {
            const firstName = document.getElementById('firstNameInput').value;
            const response = await fetch(`/api/names/${firstName}`);
            
            if (response.ok) {
                const name = await response.json();
                document.getElementById('result').innerText = `
                    Имя: ${name.firstName}
                    Описание: ${name.description}
                    Значение: ${name.meaning}
                `;
            } else {
                document.getElementById('result').innerText = 'Имя не найдено';
            }
        }
    </script>
</body>
</html>

11. В Solution Explorer щелкните правой кнопкой мыши на файле "index.html", выберите "Properties" и установите значение "Copy to Output Directory" в "Copy if newer".
12. Запустите приложение, нажав клавишу F5 или выбрав "Start Debugging" из меню "Debug". Приложение должно быть запущено в браузере.
13. Введите имя в поле ввода и нажмите кнопку "Получить описание и значение". Приложение должно отправить запрос на сервер, получить описание и значение имени и отобразить их на странице.

Но эта программа вроде как выдает значение имени, но даже это не работает.

Вернуться к обсуждению:
Сетевое приложение, которые выдает описание растения C# ASP.NET Core

Следующий ответ