0

我在我的应用程序中使用 webGL earth，它正在工作，但现在当我尝试在本地 wamp 服务器或实时服务器上运行时遇到了 CORS 问题。

从源“https://mydomain.in”访问“https://www.webgearth.com/v2/SkyBox/mx.jpg”的图像已被 CORS 策略阻止：否“访问控制允许源” ' 请求的资源上存在标头。

<!DOCTYPE HTML>
<html>
  <head>
    <script src="v2/api.js"></script>
    <script>
      function initialize() {
       /* if (window.location.href.substr(0, 5) === 'file:')
          alert("This file must be accessed via http:// or https:// to run properly.");
        var earth = new WE.map('earth_div');
        earth.setView([46.8011, 8.2266], 2);
        WE.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
         tileSize: 256,
          bounds: [[-85, -180], [85, 180]], 
          minZoom: 0,
          maxZoom: 16,
          attribution: 'WebGLEarth example',
          tms: true  
        }).addTo(earth);    */
        var options = {
          sky: true,
          atmosphere: true,
          zooming: true,
        };
        var earth = new WE.map("earth_div", options);
        WE.tileLayer("http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
          //tileSize: 256,
          //tms: true
        }).addTo(earth);

        // Start a simple rotation animation
        var before = null;
        requestAnimationFrame(function animate(now) {
          var c = earth.getPosition();
          var elapsed = before ? now - before : 0;
          before = now;
          earth.setCenter([c[0], c[1] + 0.1 * (elapsed / 30)]);
          requestAnimationFrame(animate);
        });

       

        navigator.geolocation.getCurrentPosition(function (position) {
          var marker = WE.marker([
            position.coords.latitude,
            position.coords.longitude,
          ]).addTo(earth);
          marker
            .bindPopup("<b>Hello world!</b><br>My current location<br />", {
              maxWidth: 150,
              closeButton: true,
            })
            .openPopup();
        });
        // earth.setView([51.505, 0], 2.5);
      }

        
    
    </script>
    <style type="text/css">
      html, body{padding: 0; margin: 0;}
      #earth_div{top: 0; right: 0; bottom: 0; left: 0;
                 position: absolute !important;
                 background-image: -webkit-gradient(
                   linear,
                   left bottom,
                   left top,
                   color-stop(0, rgb(253,253,253)),
                   color-stop(0.15, rgb(253,253,253)),
                   color-stop(0.53, rgb(223,223,223)),
                   color-stop(0.56, rgb(255,255,255)),
                   color-stop(1, rgb(253,253,253))
                   );
                 background-image: -moz-linear-gradient(
                   center bottom,
                   rgb(253,253,253) 0%,
                   rgb(253,253,253) 15%,
                   rgb(223,223,223) 53%,
                   rgb(255,255,255) 56%,
                   rgb(253,253,253) 100%
                   );
      }
    </style>
    <title>WebGL Earth API: Custom Tiles</title>
  </head>
  <body onload="initialize()">
    <div id="earth_div"></div>
  </body>
</html>

我的 .htaccess 文件是

RewriteEngine on
RewriteCond %{REQUEST_URI} !/globenew/
RewriteRule ^/?(.*)$ /globenew/$1 [END,QSA]

<IfModule mod_headers.c>
  Header set Access-Control-Allow-Origin "*"
</IfModule>

非常感谢任何解决此问题的解决方案。

谢谢

4

0 回答 0