Firefox浏览器阻止react-leaflet加载地图瓦片的原因是什么？

这个问题同时涉及Firefox 78 ESR版本的特性和React-Leaflet的配置遗漏，可按以下步骤排查修复：

• 补充导入Leaflet原生样式
  你当前的代码没有引入Leaflet的核心样式文件，旧版Firefox对样式缺失的关联资源请求会偶发拦截，在app.js顶部添加导入语句即可：

import 'leaflet/dist/leaflet.css'

• 调整瓦片层配置适配旧版浏览器规则
  Firefox 78 ESR的缓存策略、请求头校验逻辑和新版本浏览器存在差异，可给TileLayer组件添加适配参数，修改后的配置如下：

<TileLayer
  attribution='&copy; OpenStreetMap contributors'
  url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
  keepBuffer={20}
  maxNativeZoom={19}
  referrerPolicy="no-referrer-when-downgrade"
/>

• 确认浏览器拦截规则
  Firefox 78 ESR的增强跟踪保护会将批量瓦片请求误判为跟踪行为，你可以在地址栏左侧的盾牌控件中关闭当前站点的跟踪保护测试，如果关闭后瓦片加载恢复正常，即为浏览器拦截机制导致，可更换为其他公共瓦片源规避该问题。

内容的提问来源于stack exchange，提问作者A.Wob