javascript - CORS政策已阻止从来源 'null'访问图像

我在OpenLayers 3中有JavaScript应用程序，并且我的基础层是从本 map 块创建的。我只能在计算机上工作，所以我不知道为什么会有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
    })
});

来自控制台的错误消息:



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

最佳答案

您遇到了CORS错误。

在这种情况下，尝试使用本地文件系统访问文件不起作用。
Origin为空，因为它是您的本地文件系统。您可以托管此png文件吗？

建议:

而是将这些文件托管到AWS S3存储桶。然后，您可以使用http协议(protocol)而不是file协议(protocol)。或在本地系统上设置一些http服务器，如果您想将所有内容都保留在本地，请使用http到localhost来提供文件。

更多阅读:

How CORS Works