Javascript .innerHtml与边缘浏览器上的外部源一起向控制台添加警告：

使用javascript将div的.innerHtml设置为使用Edge browser（85.0.564.51）的另一站点上的图像，会向控制台添加一条警告消息：

跟踪预防阻止了对存储的访问

如何设置div的innerhtml，使边缘浏览器不会抱怨潜在的不安全代码？Chrome对此代码没有问题

<div id="divTweets" class="col-md-8"></div>

---

const divTweets=document.querySelector（“divTweets”）；divTweets.innerHTML=''
我认为您在Edge上得到了警告，但在Chrome上没有，因为Edge的跟踪功能。这会阻止或警告它认为可能正在跟踪的图像。在Edge中，进入菜单（右上…）设置>隐私等，然后可以将跟踪设置为基本，几乎不做任何事情，平衡，默认，或严格。尝试设置这些，然后查看console.log中的内容

我不知道为什么那个特定的图像被认为是跟踪的（可能是跟踪，或者可能对源有怀疑），但是使用“正常”图像，即使跟踪设置为Strict，代码也可以正常工作，没有警告

例如：

<div id="divTweets" class="col-md-8"></div>
<button onclick="useimg('https://pbs.twimg.com/profile_images/1126815136352735233/dAGSYPXz_normal.png');">Click to get the twimg.com image</button>
<button onclick="useimg('https://rgspaces.org.uk/wp-content/uploads/may-morning-in-lockdown.jpg');">Click to get the rgspaces.org.uk image</button>

<script>
const divTweets = document.querySelector("#divTweets");

divTweets.innerHTML = '<img id="img" src="https://rgspaces.org.uk/wp-content/uploads/may-morning-in-lockdown-100x100.jpg" alt="WoonzorgNL" />';

function useimg(img) {
  document.getElementById('img').src=img;
  document.getElementById('img').style.width='20vw';//just so we can see the image
}
</script>


单击以获取twimg.com图像
单击以获取rgspaces.org.uk图像
const divTweets=document.querySelector（“divTweets”）；
divTweets.innerHTML=''；
功能使用img（img）{
document.getElementById（'img'）。src=img；
document.getElementById（'img'）.style.width='20vw'；//这样我们就可以看到图像了
}
我认为您在Edge上得到了警告，但在Chrome上没有，因为Edge的跟踪功能。这会阻止或警告它认为可能正在跟踪的图像。在Edge中，进入菜单（右上…）设置>隐私等，然后可以将跟踪设置为基本，几乎不做任何事情，平衡，默认，或严格。尝试设置这些，然后查看console.log中的内容

我不知道为什么那个特定的图像被认为是跟踪的（可能是跟踪，或者可能对源有怀疑），但是使用“正常”图像，即使跟踪设置为Strict，代码也可以正常工作，没有警告

例如：

<div id="divTweets" class="col-md-8"></div>
<button onclick="useimg('https://pbs.twimg.com/profile_images/1126815136352735233/dAGSYPXz_normal.png');">Click to get the twimg.com image</button>
<button onclick="useimg('https://rgspaces.org.uk/wp-content/uploads/may-morning-in-lockdown.jpg');">Click to get the rgspaces.org.uk image</button>

<script>
const divTweets = document.querySelector("#divTweets");

divTweets.innerHTML = '<img id="img" src="https://rgspaces.org.uk/wp-content/uploads/may-morning-in-lockdown-100x100.jpg" alt="WoonzorgNL" />';

function useimg(img) {
  document.getElementById('img').src=img;
  document.getElementById('img').style.width='20vw';//just so we can see the image
}
</script>


单击以获取twimg.com图像
单击以获取rgspaces.org.uk图像
const divTweets=document.querySelector（“divTweets”）；
divTweets.innerHTML=''；
功能使用img（img）{
document.getElementById（'img'）。src=img；
document.getElementById（'img'）.style.width='20vw'；//这样我们就可以看到图像了
}
我使用aspnet Core为图像创建了一个“代理”。这样，图像由与网页相同的服务器提供

<img src="/Twitter/Proxy?externalUri=https://pbs.twimg.com/profile_images/1126815136352735233/dAGSYPXz_normal.png" alt="WoonzorgNL">

public async Task<IActionResult> Proxy(Uri externalUri)
{
    using (HttpClient client = new HttpClient()) {
        var file = await client.GetAsync(externalUri);
        return new FileContentResult(await file.Content.ReadAsByteArrayAsync(), file.Content.Headers.ContentType.MediaType);
    }
}


公共异步任务代理（Uri externalUri）
{
使用（HttpClient=new HttpClient（））{
var file=await client.GetAsync（externalUri）；
返回新的FileContentResult（等待file.Content.ReadAsByteArrayAsync（），file.Content.Headers.ContentType.MediaType）；
}
}
我使用aspnet Core为图像创建了一个“代理”。这样，图像由与网页相同的服务器提供

<img src="/Twitter/Proxy?externalUri=https://pbs.twimg.com/profile_images/1126815136352735233/dAGSYPXz_normal.png" alt="WoonzorgNL">

public async Task<IActionResult> Proxy(Uri externalUri)
{
    using (HttpClient client = new HttpClient()) {
        var file = await client.GetAsync(externalUri);
        return new FileContentResult(await file.Content.ReadAsByteArrayAsync(), file.Content.Headers.ContentType.MediaType);
    }
}


公共异步任务代理（Uri externalUri）
{
使用（HttpClient=new HttpClient（））{
var file=await client.GetAsync（externalUri）；
返回新的FileContentResult（等待file.Content.ReadAsByteArrayAsync（），file.Content.Headers.ContentType.MediaType）；
}
}
我赞成霍沃斯的观点。我测试了其他图像，例如，它不会在边缘显示跟踪预防。此外，如果我关闭Edge上的跟踪预防功能，警告也不会显示。我认为问题在于图片的url而不是代码。Edge认为url正在被跟踪。url来自一个twitter API调用，我不知道它是否在跟踪，但我只是在寻找一个无法跟踪的解决方法。关闭跟踪预防不是一个选项，我不想在用户网站上看到这条消息。我支持Haworth的观点。我测试了其他图像，例如，它不会在边缘显示跟踪预防。此外，如果我关闭Edge上的跟踪预防功能，警告也不会显示。我认为问题在于图片的url而不是代码。Edge认为url正在被跟踪。url来自一个twitter API调用，我不知道它是否在跟踪，但我只是在寻找一个无法跟踪的解决方法。关闭跟踪预防不是一个选项，我不想在用户站点上看到此消息。