title: Content Security Policy directive: "frame-ancestors 'self'
body: <p>I am embedding an iFrame in my web page, something like this:</p>
  
  <pre><code>var iframeProps = {
          'data-type': self.props.type,
          allowTransparency: self.props.allowTransparency,
          className: self.props.className,
          frameBorder: self.props.frameBorder,
          height: self.props.height,
          key: url,
          onLoad: self.props.onLoad.bind(self),
          scrolling: self.props.scrolling,
          src: self.state.isActive ? url : '',
          style: self.props.styles,
          width: self.props.width
      };
  &lt;iframe {...iframeProps} /&gt;
  </code></pre>
  
  <p>This is throwing an error in the console </p>
  
  <blockquote>
    <p>Refused to display '<a href="https://twitter.com/" rel="noreferrer">https://twitter.com/</a>.... in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'self'".</p>
  </blockquote>
  
  <p>Could anyone please tell me how can I make this work?</p>