CORS 策略已阻止从来源“null”访问图像

我在 OpenLayers 3 中有 JavaScript 应用程序，我的基础层是从本地图块创建的。我只在我的计算机上工作，所以我不知道为什么会出现 CORS 错误。

    var newLayer = new ol.layer.Tile({
    source: new ol.source.OSM({
        url: 'E:/Maperitive/Tiles/vychod/{z}/{x}/{y}.png'
    })
});
var schladming = [21.6187, 48.7327]; // longitude first, then latitude
// since we are using OSM, we have to transform the coordinates...
var schladmingWebMercator = ol.proj.fromLonLat(schladming);

var map = new ol.Map({
    layers: [
        newLayer
    ],
    controls: [],
    target: 'mapid',
    view: new ol.View({
        center: schladmingWebMercator,
        zoom: 10,
        minZoom: 10,
        maxZoom: 14
    })
});

来自控制台的错误消息：

访问图像：file:///E:/Maperitive/Tiles/vychod/10/573/352.png从原点null已被 CORS 策略阻止：响应无效。起源null因此不允许访问。

当我双击图像 URL 时，图像将被打开。任何想法有什么问题吗？我以前从未遇到过这个错误。

您遇到了 CORS 错误。

尝试使用本地文件系统访问您的文件在您的情况下不起作用。

Origin为空，因为它是你的本地文件系统。你能不能host这个png文件？

建议：

将这些文件托管到 AWS S3 存储桶。然后您可以使用http协议而不是file协议。或者在本地系统上设置一些 http 服务器并使用http给你的localhost如果您想将所有内容保留在本地，则可以从中提供文件。

更多阅读：

CORS 的工作原理