Accessing iframe after page loaded

I was trying to add a iframe and connect to google maps after the page loaded like below

<iframe width="100%" height="600" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?width=100%25&amp;height=600&amp;hl=en&amp;q=1%20Grafton%20Street,%20Dublin,%20Ireland+(My%20Business%20Name)&amp;t=&amp;z=14&amp;ie=UTF8&amp;iwloc=B&amp;output=embed"></iframe>

but I got this message from the console

Refused to frame 'https://www.google.com/' because it violates the following Content Security Policy directive: "frame-src 'self' blob: data:".

I tried adding

<meta http-equiv="Content-Security-Policy" content="frame-src 'self' blob: data:">

to the hearder which should grant the content that the console told me, but it didn't work.

Then I took a look at the header of the page response

Content-Security-Policy:  default-src 'self';   connect-src 'self';   font-src 'self' data:;   frame-src 'self' blob: data:;   img-src 'self' blob: data:;   media-src 'self';   object-src 'self' blob: data:;   script-src 'self' blob: data: 'unsafe-inline''unsafe-eval' https://accounts.google.com/;   style-src 'self''unsafe-inline';  frame-ancestors 'self' ;

but I found the policy frame-src 'self' blob: data: on the 4th line.

I don't really why it's still saying the same error. Does anyone know how to solve this problem? Thanks.