Can't use in Chrome Extension because of dynamically fetched Maps js API

[laugri]

Hello,

I am building a Chrome extension.
It has a content script UI that fetches customer data from an API. I want to display a map of the customer address but can't.

Problem:

When I try to use the react-google-maps library, I get the following error:

content.js:53503
Refused to load the script 'https://maps.googleapis.com/maps/api/js?key=<mykey>&solution_channel=GMP_visgl_rgmlibrary_v1_default&loading=async&callback=__googleMapsCallback__' because it violates the following Content Security Policy directive: "script-src 'self' 'wasm-unsafe-eval' 'inline-speculation-rules' http://localhost:* http://127.0.0.1:*". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

content.js:28424
<ApiProvider> failed to load the Google Maps JavaScript API Error: The Google Maps JavaScript API could not load.

Cause:

Chrome extensions aren't allowed to dynamically load scripts. See the doc:

In Manifest V3, all of your extension's logic must be part of the extension package. You can no longer load and execute remotely hosted files according to Chrome Web Store policy. Examples include:

• JavaScript files pulled from the developer's server.
• Any library hosted on a CDN.
• Bundled third-party libraries that dynamically fetch remote hosted code.

Solution:

Is there any way to pre-package the API ? I have found that it is purposely not distributed via NPM. Any other idea or suggestion would be very welcome !

Thank you :)

[usefulthink]

I have to say, I have no experience with the new extension APIs, so maybe there are ways to make this work that I am missing at the moment. As far as I can tell from a brief look into the documentation, this isn't going to work.

Is there any way to pre-package the API?

As far as I know, this isn't going to happen.

At this point I'd recommend you use something like maplibre or mapbox with react-map-gl. Those allow you to bundle the entire codebase and will only request configuration data and vector-tiles from the server.

[laugri]

Thanks! I'll check it out, thanks for the suggestions.