Изображение не загружается через AJAX запрос ASP MVC core 3.0 - PullRequest
1 голос
/ 02 февраля 2020

Я получаю данные из контроллера API через AJAX, запрашиваю все данные, загруженные правильно, включая источник изображения, но я не уверен, почему имя контроллера добавляется к источнику изображения и приводит к неработающей ссылке. Вот мой код для AJAX request

$.ajax({
    type: 'GET',
    url: '/api/PieData',
    dataType: 'json',
    success: function (jsonData) {
         if (jsonData == null) {
              alert('no data returned');
              return;
          }

          $.each(jsonData, function (index, pie) {
             var pieSummaryString = '<div class="col-lg-4 col-sm-6 mb-4"> ' +
                        '  <div class="card h-100" style="width: 17rem;">' +
                        '     <img class="card-img-top" src=' + pie.imageThumbnailUrl + ' alt="Image Not Found">' +
                        '      <div class="card-body">' +
                        '         <h3 class="card-title">' + pie.price + '</h3>' +
                        '         <h3>' +
                        '             <a href=/Pie/Details/' + pie.pieId + '>' + pie.name + '</a>' +
                        '         </h3>' +
                        '         <p class="card-text">' + pie.shortDescription + '</p>' +
                        '    </div>' +
                        '    <div class="addToCart">' +
                        '        <p class="button">' +
                        '             <a class="btn btn-primary" href=/ShoppingCart/AddToShoppingCart?pieId=' + pie.pieId + '>Add to cart</a>' +
                        '         </p>' +
                        '     </div>' +
                        '  </div>' +
                        '</div>';
                    $('#pieDiv').append(pieSummaryString);
                });
            },
            error: function (ex) {
                alert(ex);
            }
        });

Источник, возвращаемый базой данных, "Images / PieImages / applepiesmall.jpg", а источник изображения, сгенерированный на странице, https://localhost: 44365 / Pie / Images /PieImages/applepiesmall.jpg. Почему «P ie» добавляется к источнику? JSON возврат по API

{"pieId":1,"name":"Apple Pie","shortDescription":"Our famous apple pies!","price":12.95,"imageThumbnailUrl":"Images/PieImages/applepiesmall.jpg"}

1 Ответ

0 голосов
/ 02 февраля 2020

Основная причина вставки 'P ie' в URL вашего изображения - из-за отсутствия передней стороны sh в вашем JSON пути к изображению.

"imageThumbnailUrl":"Images/PieImages/applepiesmall.jpg"

должно быть

"imageThumbnailUrl":"/Images/PieImages/applepiesmall.jpg"

Открытие / перед изображениями означает, что путь к изображению должен быть рассчитан из каталога root веб-сайта. Если ввод / отсутствует, путь к изображению рассчитывается из текущего веб-каталога, в данном случае, вашего контроллера p ie.

...