Leaflet 1.9.3加载Mapbox瓦片时出现403错误求助

问题根源 #

你的代码存在两个关键错误：

• 瓦片URL使用的是OpenStreetMap的地址，但配置参数里却指定了Mapbox的样式ID，两者完全不匹配
• 加载Mapbox瓦片必须携带有效的access_token参数，你的代码里未配置这个必填项

修正后的代码 #

将L.tileLayer的URL替换为Mapbox官方瓦片地址，并补充必填的access_token配置：

var mymap = L.map('mapid').setView([-37.6050,-62.3923], 15);

L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
    maxZoom: 18,
    attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, ' +
        'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
    id: 'mapbox/streets-v11',
    tileSize: 512,
    zoomOffset: -1,
    accessToken: '你的Mapbox access_token'
}).addTo(mymap);

额外排查点 #

• 确认你的access_token处于有效状态，且拥有对应Mapbox样式的使用权限，过期或权限不足都会返回403
• 检查Mapbox账号的使用额度，超出免费配额也会触发403错误
• Leaflet版本升级不会自动修复配置类错误，核心问题是瓦片服务参数不匹配

内容的提问来源于stack exchange，提问作者Ulises Nicolini