inocan-group / vue3-google-map

A set of composable components for easy use of Google Maps in your Vue 3 projects.
https://vue3-google-map.com
MIT License
264 stars 50 forks source link

Pass nonce property to js-api-loader #203

Closed Diogomrol closed 3 months ago

Diogomrol commented 3 months ago

Hi everyone,

I was trying to use the vue3-google-map wrapper, but actually having some issues with Content Security Policies (CSP) violations.

Some of those could be solved by whitelisting some google-related addresses, but a final one has to do with the implementation of this wrapper.

So, while the js-api-loader supports receiving a nonce, the vue3-google-map wrapper doesn't have any property/option for the user to pass this property.

Having said that, the issue here is to add support for using a nonce in vue3-google-map and pass it to the js-api-loader.

PS: I'll work on this and open a PR soon, but wanted to have the issue raised first.

HusamElbashir commented 3 months ago

FYI you could load the script externally using the apiPromise option and have access to the full @googlemaps/js-api-loader API. See: https://github.com/inocan-group/vue3-google-map?tab=readme-ov-file#loading-the-google-maps-api-script-externally