Google Maps error on Content Security Policy-CodePudding

I have the following line on the layout loading the google maps script:

<script src="https://maps.googleapis.com/maps/api/js?key=MY_KEY" async defer></script>

On the web.config, Content Security Policy is enabled allowing only self scripts and the *.googleapis.com

<content-Security-Policy enabled="true">
      <script-src self="true">
        <add source="*.googleapis.com"/>            
      </script-src>
    </content-Security-Policy>

When I open the page, google maps plugin is working fine. But I'm getting this error on the JavaScript console:

js?key=MY_KEY:318 Refused to connect to 'https://maps.googleapis.com/maps/api/mapsjs/gen_204?csp_test=true' because it violates the following Content Security Policy directive: "connect-src 'self'".

It seems like the google script is loading a second call to that other script. (And what's that csp_test=true means??) Even though the gmaps is working, I would like to get rid of that exception, and I'm not able to... Any help?

Thanks in advance!

CodePudding user response：

The script attempts to send data to maps.googleapis.com, but that is not allowed as you have restricted connect-src to 'self' only. You would likely need to add modify your configuration to this:

<content-Security-Policy enabled="true">
  <script-src self="true">
    <add source="*.googleapis.com"/>            
  </script-src>
  <connect-src self="true">
    <add source="*.googleapis.com"/>            
  </connect-src>
</content-Security-Policy>

You could also be more restrictive on the subdomain (maps.googleapis.com) or use the default-src directive instead.