ajax 图像加载破坏完整的 SSL答案

【问题标题】：ajax image loading breaking full SSLajax 图像加载破坏完整的 SSL
【发布时间】：2016-06-12 08:15:56
【问题描述】：

除了从 ajax 调用中提取的图像之外，我的网站是完整的 SSL

    $.ajax({
        url : 'index.php?route=taobao/taobao/related_products&product_id=<?php echo $product_id;?>&cid=<?php echo $cid;?>&tm=<?php echo $tm;?>',
        dataType : 'html',
        beforeSend : function(){
            $('#related_products').append('<div class="loading_related" style="margin:15px auto;text-align:center"><img src="public/image/load5.gif" /></div>');
        },
        complete : function(){
            $('.loading_related').remove();

            $('#related_products img').each(function() {
                var src = this.src.replace(/(http\:\/\/img\d\.tbcdn\.cn)/, "https://img.alicdn.com");
                $(this).attr('src', src);
            });
        },
        success : function(html){
            $('#related_products').html(html);
        }
    });

我无法访问模板文件来更改网址，所以我改为通过

更改网址

$('#related_products img').each(function() {
    var src = this.src.replace(/(http\:\/\/img\d\.tbcdn\.cn)/, "https://img.alicdn.com"); 
    $(this).attr('src', src);
});

这很好用，整个网站都是 ssl，但我遇到了混合内容错误（我猜是因为不安全请求的闪存？）无论如何我可以让我的网站完全 ssl 没有mixed-content 错误？

【问题讨论】：

为什么不改变 uri 协议 before 将图像附加到 DOM 中？？？
@A.Wolff 我已经尝试将函数移动到 beforesend 但它似乎没有做任何事情

标签： javascript jquery ajax ssl

【解决方案1】：

在将它们附加到 DOM 之前，尝试为这些图像设置 URI 协议。这是一个例子：

$.ajax({
  url: 'index.php?route=taobao/taobao/related_products&product_id=<?php echo $product_id;?>&cid=<?php echo $cid;?>&tm=<?php echo $tm;?>',
  dataType: 'html',
  beforeSend: function() {
    $('#related_products').append('<div class="loading_related" style="margin:15px auto;text-align:center"><img src="public/image/load5.gif" /></div>');
  },
  success: function(html) {
    var newHTML = $('<div/>', {
      html: html
    }).find('img').prop('src', function() {
      return this.src.replace(/(http\:\/\/img\d\.tbcdn\.cn)/, "https://img.alicdn.com");
    }).end().html();

    $('#related_products').html(newHTML);
  }
});

顺便说一句，如果一次只有一个元素.loading_related，那么你的完整回调在这里变得毫无用处。

【讨论】：