对于网页里引用微信公众号图片时出现的"此图片来自微信公众平台, 未经允许不可引用"的问题, 能搜索到的解决方案不多, 除去已经被和谐掉的, 大概可以分为两种:
第一种, 更改图片src, 例如
options.url = http + \'//cors-anywhere.herokuapp.com/\' + options.url;
但这种加跳板的方式受制于跳板的状态, 如果cores-anywhere.herokuapp.com停止服务了, 那么图片还是不能显示出来. 所以这种方法不予考虑.
第二种, 嵌套iframe
这里参考了https://www.cnblogs.com/ixysy/p/4983891.html 的解决方案, 但是这种方案并不能解决网页里有多张图片的情况, 会导致只有最后一张图片能正常显示.
不过既然第一步已经成功了, 后面就简单多了.
研究一下代码, 发现他给父页面window赋予了一个img属性, 然后把这个img显示进所有iframe里, 那我给每张图片都赋予一个不同的属性不就行了?
$(function () {
$(".xiangxi img").each(function (index, element) {
var img = $(this);
var img_src = img.attr("src");
if (img_src.indexOf("wxfrom") != -1) {
var frameid = \'frameimg\' + Math.random();
var atr = "wximg" + frameid;
var imgcode = \'<img id="\' + atr + \'" src=\\'\' + img_src + \'?\' + Math.random() + \'\\' /><script>window.onload = function() { parent.document.getElementById(\\'\' + frameid + \'\\').height = document.getElementById(\\'\' + atr + \'\\').height+\\'px\\'; }<\' + \'/script>\';
window.attr(atr, imgcode);
img.parent().append(\'<iframe id="\' + frameid + \'" src="javascript:parent.\' + atr + \';" frameBorder="0" scrolling="no" width="100%"></iframe>\');
img.remove();
}
});
})
Ok, 解决!