我收到此错误消息：
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
这是 /etc/nginx/sites-available/default 配置：
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;
}
这就是
/srv/myworldmap/html folderroot@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/[email protected]/dist/maplibre-gl.css" crossorigin="anonymous">
<script src="https://unpkg.com/[email protected]/dist/maplibre-gl.js" crossorigin="anonymous"></script>
<script src="https://unpkg.com/[email protected]/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>
如何发出这些错误消息：
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
消失并使地图可见？
拉菲
由于这些迹象，我解决了这个问题： https://github.com/smellman/pmtiles-example?tab=readme-ov-file#cors-settings-in-nginx
/etc/nginx/sites-enabled/default：
##
# You should look at the following URL's in order to grasp a solid understanding
# of Nginx configuration files in order to fully unleash the power of Nginx.
# https://www.nginx.com/resources/wiki/start/
# https://www.nginx.com/resources/wiki/start/topics/tutorials/config_pitfalls/
# https://wiki.debian.org/Nginx/DirectoryStructure
#
# In most cases, administrators will remove this file from sites-enabled/ and
# leave it as reference inside of sites-available where it will continue to be
# updated by the nginx packaging team.
#
# This file will automatically load configuration files provided by other
# applications, such as Drupal or Wordpress. These applications will be made
# available underneath a path with that package name, such as /drupal8.
#
# Please see /usr/share/doc/nginx-doc/examples/ for more detailed examples.
##
# Default server 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;
autoindex on;
autoindex_exact_size off;
autoindex_localtime on;
add_header 'Access-Control-Allow-Origin' "$http_origin" always;
add_header 'Access-Control-Allow-Credentials' 'true' always;
add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS' always;
add_header 'Access-Control-Allow-Headers' 'Accept,Authorization,Cache-Control,Content-Type,DNT,If-Modified-Since,Keep-Alive,Origin,Range,User-Agent,X-Requested-With' always;
if ($request_method = 'OPTIONS') {
# Tell client that this pre-flight info is valid for 20 days
add_header 'Access-Control-Allow-Origin' "$http_origin" always;
add_header 'Access-Control-Allow-Headers' 'Accept,Authorization,Cache-Control,Content-Type,DNT,If-Modified-Since,Keep-Alive,Origin,Range,User-Agent,X-Requested-With' always;
add_header 'Access-Control-Max-Age' 1728000;
add_header 'Content-Type' 'text/plain charset=UTF-8';
add_header 'Content-Length' 0;
return 204;
}
}
# 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;
#}
}
# Virtual Host configuration for example.com
#
# You can move that to a different file under sites-available/ and symlink that
# to sites-enabled/ to enable it.
#
#server {
# listen 80;
# listen [::]:80;
#
# server_name example.com;
#
# root /var/www/example.com;
# index index.html;
#
# location / {
# try_files $uri $uri/ =404;
# }
#}