燈廊圖片下載問題

Question

當我使用lightgallery打開圖像時，我嘗試下載它。 它可以在本地服務器上運行，但是當我嘗試在生產環境中執行相同操作時。 圖像在新選項卡中打開。

• 使用https安全的產品服務器
• 圖片網址來自Amazon S3服務器

HTML ：

<div class="col-lg-offset-3 col-lg-9 col-md-offset-2 col-md-10 col-sm-10" style="padding-left:10px">
  <div id="customPreviews" style="border: 1px dashed rgba(0, 0, 0, 0.3);padding: 40px 40px;">
    <ul id="lightgallery" class="list-unstyled row"></ul>
  </div>
</div>

Javascript ：

var lg = $('#lightgallery').lightGallery({
  iframeMaxWidth: '80%'
});

function reinitGallery() {
  lg.data('lightGallery').destroy(true);
  lg = $('#lightgallery').lightGallery({
    iframeMaxWidth: '80%'
  });
}

function renderAllImage() {
  $('#lightgallery').html("");
  setTimeout(function() {
    reinitGallery();
  }, 500);
  for (i = 0; i < fileArr.length; i++) {
    addFileToPreviewContainer(fileArr[i]);
  }
}

function addFileToPreviewContainer(data, reInit, append) {
  if (isThumb == true) {
    var newTemplate = templateText + '</ul></div></li>';
  } else {
    var newTemplate = templateListText;
  }
  var templateObj = $($.parseHTML(newTemplate));
  if (data.file_type == 'jpg' || data.file_type == 'JPG' || data.file_type == 'jpeg' || data.file_type == 'JPEG' || data.file_type == 'png' || data.file_type == 'PNG' || data.file_type == 'gif' || data.file_type == 'GIF')
    templateObj.attr('data-iframe', false);

  var date;
  if (data.created_at.date) {
    date = data.created_at.date;
  } else {
    date = data.created_at;
  }
  templateObj.attr('data-src', data.data_src);
  templateObj.attr('data-sub-html', '<h4>' + data.original_filename + '</h4>');
  templateObj.find('.a-thumb').attr('src', data.path_thumbnail);
  templateObj.find('.a-thumb').attr('alt', (data.file_name) ? data.file_name : data.filename);
  templateObj.find('.a-link-filename').text(data.original_filename);
  templateObj.find('.a-info').text(date + " - " + data.size + ' kb');
  templateObj.find('.a-id').val(data.original_filename);
  if (append == false) {
    $('#lightgallery').html('');
    $('#lightgallery').append(templateObj);
  } else {
    $('#lightgallery').append(templateObj);
  }


  if (reInit) {
    setTimeout(function() {
      reinitGallery();
    }, 500);
  }
}

這是屏幕截圖，可讓您更好地理解

Answer 1

您需要在將圖像上傳到s3服務器時添加元數據

添加此元數據

['ContentDisposition' => 'attachment']