Welcome! Log In Create A New Profile

Advanced

CORS Issue : Fetch API cannot load http://mymapserveraddress/protomaps.pmtiles due to access control checks

August 30, 2024 11:19AM
Hi!

I'm getting this errors message:

Access-Control-Allow-Origin cannot contain more than one origin.
Fetch API cannot load http://mymapservername/protomaps.pmtiles due to access control checks.
Failed to load resource: Access-Control-Allow-Origin cannot contain more than one origin.
Unhandled Promise Rejection: TypeError: Load failed

This is /etc/nginx/sites-available/default configuration :

server {
listen 80 default_server;
listen [::]:80 default_server;

server_name myservername;

# SSL configuration
#
# listen 443 ssl default_server;
# listen [::]:443 ssl default_server;
#
# Note: You should disable gzip for SSL traffic.
# See: https://bugs.debian.org/773332
#
# Read up on ssl_ciphers to ensure a secure configuration.
# See: https://bugs.debian.org/765782
#
# Self signed certs generated by the ssl-cert package
# Don't use them in a production server!
#
# include snippets/snakeoil.conf;

#root /var/www/html;

root /srv/myworldmap/html;

# Add index.php to the list if you are using PHP
#index index.html index.htm index.nginx-debian.html;

index index.html;

#server_name _;

location / {
# First attempt to serve request as file, then
# as directory, then fall back to displaying a 404.
try_files $uri $uri/ =404;
}

# pass PHP scripts to FastCGI server
#
#location ~ \.php$ {
# include snippets/fastcgi-php.conf;
#
# # With php-fpm (or other unix sockets):
# fastcgi_pass unix:/run/php/php7.4-fpm.sock;
# # With php-cgi (or other tcp sockets):
# fastcgi_pass 127.0.0.1:9000;
#}

# deny access to .htaccess files, if Apache's document root
# concurs with nginx's one
#
#location ~ /\.ht {
# deny all;
#}

add_header "Access-Control-Allow-Origin" "*" always;
}

This is the content of /srv/myworldmap/html folder :

root@vmi1102187:~# ls -lah /srv/myworldmap/html/
total 115G
drwxr-xr-x 3 root root 4.0K Aug 30 16:37 .
drwxr-xr-x 3 root root 4.0K Aug 27 18:54 ..
-rw-r--r-- 1 root root 1.5K Aug 27 23:09 index.html
drwxr-xr-x 5 root root 4.0K Aug 27 23:03 node_modules
-rw-r--r-- 1 root root 1.5K Aug 27 23:03 package-lock.json
-rw-r--r-- 1 root root 52 Aug 27 23:03 package.json
-rw-r--r-- 1 root root 115G Aug 28 01:11 protomaps.pmtiles
-rw-r--r-- 1 root root 82K Aug 27 19:30 style.json

/srv/myworldmap/html/index.html :

<html>
<head>
<title>PMTiles MapLibre Example</title>
<meta charset="utf-8"/>
<link rel="stylesheet" href="https://unpkg.com/maplibre-gl@4.5.0/dist/maplibre-gl.css" crossorigin="anonymous">
<script src="https://unpkg.com/maplibre-gl@4.5.0/dist/maplibre-gl.js" crossorigin="anonymous"></script>
<script src="https://unpkg.com/pmtiles@3.0.6/dist/pmtiles.js"></script>
<style>
body {
margin: 0;
}
#map {
height:100%; width:100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script type="text/javascript">
// add the PMTiles plugin to the maplibregl global.
let protocol = new pmtiles.Protocol();
maplibregl.addProtocol("pmtiles", protocol.tile);

let PMTILES_URL = "protomaps.pmtiles";

const p = new pmtiles.PMTiles(PMTILES_URL);

// this is so we share one instance across the JS code and the map renderer
protocol.add(p);

// we first fetch the header so we can get the center lon, lat of the map.
p.getHeader().then(h => {
const map = new maplibregl.Map({
container: 'map',
zoom: h.maxZoom-13,
center: [h.centerLon, h.centerLat],
style: 'style.json'
});
})
</script>
</body>
</html>


How to make these errors message:

Access-Control-Allow-Origin cannot contain more than one origin.
Fetch API cannot load http://mymapserveraddress/protomaps.pmtiles due to access control checks.
Failed to load resource: Access-Control-Allow-Origin cannot contain more than one origin.
Unhandled Promise Rejection: TypeError: Load failed

disappear and make the map visible?

Raphy
Subject Author Posted

CORS Issue : Fetch API cannot load http://mymapserveraddress/protomaps.pmtiles due to access control checks

raphy August 30, 2024 11:19AM

Re: CORS Issue : Fetch API cannot load http://mymapserveraddress/protomaps.pmtiles due to access control checks

raphy August 31, 2024 10:17AM



Sorry, only registered users may post in this forum.

Click here to login

Online Users

Guests: 136
Record Number of Users: 8 on April 13, 2023
Record Number of Guests: 500 on July 15, 2024
Powered by nginx      Powered by FreeBSD      PHP Powered      Powered by MariaDB      ipv6 ready