react google地图中的内容策略
react google地图中的内容策略
提问于 2020-12-04 19:08:43
日安。将react-google-maps与Streetview结合使用。
在本地，一切运行正常
Street view image on localhost
但在生产过程中我看到黑屏
控制台日志中有一个错误
Refused to load the image 'https://geo0.ggpht.com/cbk?cb_client=apiv3&panoid=FogDkTvJLazCtorobZljyA&output=tile&x=0&y=0&zoom=0&nbt&fover=2' because it violates the following Content Security Policy directive: "img-src 'self' blob: data: https://*.googleapis.com https://maps.gstatic.com https://raw.githubusercontent.com/googlemaps/".
我尝试将此内容策略添加到index.html中，如下所示：
<head>
...
<meta http-equiv="Content-Security-Policy" content="img-src 'self' blob: data: https://*.ggpht.com https://*.googleapis.com https://maps.gstatic.com https://raw.githubusercontent.com/googlemaps/">
...
</head>但仍然有与街景上的黑屏相同的错误。我错过了什么吗？或者也许应该以另一种方式设置内容策略？另外，https://content-security-policy.com/examples/google-maps/也测试过这个
回答 1
Stack Overflow用户
发布于 2020-12-04 20:41:51
使用Firefox插件获取所需的Content-security-policy
https://github.com/april/laboratory
default-src 'none'; connect-src 'self';
font-src https://fonts.gstatic.com https://use.fontawesome.com;
img-src 'self' data: https://geo0.ggpht.com https://geo1.ggpht.com https://geo2.ggpht.com https://geo3.ggpht.com https://maps.googleapis.com https://maps.gstatic.com;
script-src 'self' 'unsafe-inline' https://cdn.jsdelivr.net/chartist.js/latest/chartist.min.js https://maps.googleapis.com/maps-api-v3/api/js/42/9/common.js https://maps.googleapis.com/maps-api-v3/api/js/42/9/controls.js https://maps.googleapis.com/maps-api-v3/api/js/42/9/geometry.js https://maps.googleapis.com/maps-api-v3/api/js/42/9/imagery_viewer.js https://maps.googleapis.com/maps-api-v3/api/js/42/9/map.js https://maps.googleapis.com/maps-api-v3/api/js/42/9/marker.js https://maps.googleapis.com/maps-api-v3/api/js/42/9/onion.js https://maps.googleapis.com/maps-api-v3/api/js/42/9/streetview.js https://maps.googleapis.com/maps-api-v3/api/js/42/9/util.js https://maps.googleapis.com/maps/api/js https://maps.googleapis.com/maps/api/js/AuthenticationService.Authenticate https://maps.googleapis.com/maps/api/js/GeoPhotoService.GetMetadata https://maps.googleapis.com/maps/api/js/GeoPhotoService.SingleImageSearch https://maps.googleapis.com/maps/api/js/QuotaService.RecordEvent https://maps.googleapis.com/maps/api/js/ViewportInfoService.GetViewportInfo https://maps.googleapis.com/maps/vt;
style-src 'self' 'unsafe-inline' https://cdn.datatables.net/1.10.16/css/ https://cdn.jsdelivr.net/chartist.js/latest/ https://cdnjs.cloudflare.com/ajax/libs/jvectormap/2.0.4/ https://fonts.googleapis.com/ https://use.fontawesome.com/releases/v5.0.7/css/页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/65142481
复制相关文章
相似问题
腾讯云开发者
