Блог

Главная - Вопросы по программированию - Изображения не отображаются в начальной загрузке 4.1

Изображения не отображаются в начальной загрузке 4.1

#asp.net-mvc #twitter-bootstrap #asp.net-core #c#-4.0 #bootstrap-4

#asp.net-mvc #twitter-bootstrap #asp.net-core #c #-4.0 #bootstrap-4

Вопрос:

Я не вижу изображений, которые загружаются в wwwroot. Изображения имеют разные размеры. Я работаю в asp.net ядро и Bootstrap 4.1. Я думаю, что эта проблема возникла в Bootstrap.

введите описание изображения здесь

Мой код:

 @model Product
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <div class="card" style="width: 18rem">
        <img class="card-img-top" src="~/img/@Model.ImageURl" />
        <div class="card-body">
            <h5 class="card-title">@Model.Name</h5>
            <small>
                <i class="fas fa-lira-sign"></i>@Model.Price
            </small>
          
        </div>
        <div class="card-footer text-centet">
            <a asp-controller="shop" asp-action="Details" asp-route-id="@Model.ProductID" class="btn btn-primary btn-sm">Details</a>
            <a asp-controller="shop" asp-action="addtocart" asp-route-id="@Model.ProductID" class="btn btn-primary btn-sm">Add to cart</a>

        </div>
    </div>
</body>
</html>

Комментарии:

1. Вы проверяли консоль браузера на наличие ошибок?

Ответ №1:

не могу видеть изображения, которые получают из образов wwrroot

Если вы храните файлы изображений в wwwroot/img папке в вашем проекте, как показано ниже.

введите описание изображения здесь

Чтобы отобразить изображение на странице просмотра, пожалуйста, проверьте, правильно ли вы присвоили значение (как показано ниже) ImageURl объекту продукта.

 new Product
{
    ProductID = 2,
    Name = "xxx",
    Price = 9.9m,
    ImageURl = "pic1.PNG" //image file name
}

Результат теста

введите описание изображения здесь

Кроме того, для устранения проблемы вы можете попытаться проверить фактические запросы к ресурсам изображений на вкладке «Сеть» браузера F12 developer tools и сравнить их с вашей фактической структурой папок и значением ImageURl , которое вы сохранили / присвоили.

И вы можете проверить этот документ, в котором говорится об обслуживании статических файлов в ASP.NET Ядро.

Рассмотрите возможность создания папки wwwroot /images и добавления wwwroot/images/MyImage.jpg досье. Формат URI для доступа к файлу в папке images является https://<hostname>/images/<image_file_name> .

Ответ №2:

Я думаю, вам следует проверить в браузере значение img src . Также какова ценность @Model.ImageURl ? Помните, что вы должны использовать только имя файла (и расширение) и удалить дополнительный путь из вашего @Model.ImageURl .