一、
在html里加
<meta name="referrer" content="no-referrer" />
是个办法 但是我们业务需要使用referer 所以我这里不能加。
二、
<div class="iframeLogo" v-if="logoFileSrc && logoFileSrc.includes('mmbiz_')" v-html="ImgFun(logoFileSrc, 'logo')"></div><img class="info_logo" v-else :src="logoFileSrc">
ImgFun (url, type) {let stylesif (type === 'logo') {styles = 'width:58px;height:58px;position:absolute;top:0;left:0;'} else if (type === 'bg') {styles = 'width:300px;height:200px;position:absolute;top:0;left:0'}var randomId = 'img' + urlwindow[`img${url}`] = '<img id="img" style=\'' + styles + '\' src=\'' + url + '?' + 'img' + '\'/><script>window.onload = function() { parent.document.getElementById(\'' + randomId + '\').height = 100+\'%\'; } <' + '/script>'var iframeStr = `<iframe id=${randomId} src="javascript:parent['img${url}']" frameBorder="0" scrolling="no" width="100%" ></iframe>`return iframeStr},
背景图：
<div class="iframeBG" v-if="bgFileSrc && bgFileSrc.includes('mmbiz_')" v-html="ImgFun(bgFileSrc, 'bg')"></div>
.iframeBG {width: 285px;height: 198px;position: absolute;border-radius: 5px;overflow: hidden;}
注意： 当一个页面里出现两张相同路径的图片时，会出现样式错乱问题，如下图。
但是两张不同的图片就不会有问题
分析iframe的代码得知，问题出在这行代码上window[img${url}]randomId
iframe嵌入的时候根据src="javascript:parent['img${url}']"randomId来决定嵌入的元素以及样式。
当两张图片一样时， 图片的url也是一模一样的。 虽然调用ImgFun方法的时候，进type的判断了。 但是由于id是相同的，在iframe进行渲染的时候，后面的样式代码会把前面的进行覆盖，所以会出现上面的问题。
解决办法： 既然是 “不唯一” 造成的问题，可以把id和img加参数 作为唯一标识。
ImgFun (url, type) {let styleslet imgif (type === 'logo') {img = 'imgLogo'styles = 'width:58px;height:58px;position:absolute;top:0;left:0;'} else if (type === 'bg') {img = 'imgBg'styles = 'width:300px;height:200px;position:absolute;top:0;left:0;'}var randomId = img + urlwindow[`${img}${url}`] = '<img id="img" style=\'' + styles + '\' src=\'' + url + '?' + 'img' + '\'/><script>window.onload = function() { parent.document.getElementById(\'' + randomId + '\').height = 100+\'%\'; } <' + '/script>'var iframeStr = `<iframe id=${randomId} src="javascript:parent['${img}${url}']" frameBorder="0" scrolling="no" width="100%" height="100%"></iframe>`return iframeStr},
可以看出 id唯一。 问题解决~
