79
<script async="" defer="" src="//survey.g.doubleclick.net/async_survey?site=vj2nngtlb7sbtnveaepk5so4ke"></script>

Screenshot of the error:

and I'm getting

Refused to display 'https://survey.g.doubleclick.net/gen204/d?zx=5cbpafvsv9le' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.

error with the google survey setup.

1
  • the title of this question should be changed. Because the title is describing a much wider problem Oct 22, 2020 at 11:20

8 Answers 8

110

I faced the same error when displaying YouTube links. For example: https://www.youtube.com/watch?v=8WkuChVeL0s

I replaced watch?v= with embed/ so the valid link will be: https://www.youtube.com/embed/8WkuChVeL0s

It works well.

Try to apply the same rule to your case.

Update: You may need to add ?enablejsapi=1 to the Url according to the comments guide below. Like https://www.youtube.com/embed/8WkuChVeL0s?enablejsapi=1

5
  • 1
    Yeahh this works, but how is to implement search for youtube and google ? Ionic 3
    – user9049996
    Apr 27, 2018 at 20:45
  • 1
    Simple solution.
    – Reza Mamun
    Nov 19, 2018 at 7:15
  • This is not working when the ? can't be replaced by / Feb 28, 2019 at 10:06
  • solution with vimeo url?
    – Jonathan
    May 24, 2020 at 15:34
  • 1
    you need appened '?enablejsapi=1' to url Dec 19, 2022 at 4:44
51

You cannot display a lot of websites inside an iFrame. Reason being that they send an "X-Frame-Options: SAMEORIGIN" response header. This option prevents the browser from displaying iFrames that are not hosted on the same domain as the parent page. This is a security feature to prevent click-jacking. Some details at How to show google.com in an iframe?

This could be of some help : https://www.maketecheasier.com/create-survey-form-with-google-docs/

3
  • 1
    there I haven't used any IFRAME, I have just put the script provided by google survey . as it is in the script section as it mentioned, just before closing the head tag and before closing body tag, Jan 7, 2017 at 14:57
  • 3
    @saikatchakrabortty — Then complain to Google for giving you a script that tries to do something forbidden.
    – Quentin
    Jan 7, 2017 at 15:01
  • @Anurag Sinha, i have checked this link before. I doest solved my problem. Jan 7, 2017 at 15:13
7

I was facing this issue in Grafana and all I had to do was go to the config file and change allow_embedding to true and restart the server :)

3

I think You are trying to use the normal URL of video Like this :

Copying Direct URL from YouTube

That doesn't let you display the content on other domains.To Tackle this up , You should use the Copy Embed Code feature provided by the YouTube itself .Like this :

Copy Embed Code ( YouTube )

That would free you up from any issues .

For the above Scenario :

  • Go to Youtube Video

  • Copy Embed Code

  • Paste that into your Code ( Make sure you Escape all the " ( Inverted Commas) by \" .
3

This happens because of your application does not allow to append iframe from origin other than your application domain.

If your application have web.config then add the following tag in web.config

<system.webServer>
    <httpProtocol>
        <customHeaders>
            <add name="X-Frame-Options" value="ALLOW" />
        </customHeaders>
    </httpProtocol>
</system.webServer>

This will allow application to append iframe from other origin also. You can also use the following value for X-Frame-Option

X-FRAME-OPTIONS: ALLOW-FROM https://example.com/ 
1

I came across the same problem using a Wordpress page and plugin. This didn't work for the iframe plugin

[iframe src="https://itunes.apple.com/gb/app/witch-hunt/id896152730#?platform=iphone"]

but this does:

[iframe src="https://itunes.apple.com/gb/app/witch-hunt/id896152730"  width="100%" height="480" ]

As you see, I just left off the #?platform=iphone part in the end.

0

I've had this issue with an Angular app where I tried the bypassSecurityTrustResourceUrl available within DomSanitizer however, it didn't work.

Following code within the template section was needed.

<iframe [src]="iframeLink | safeUrl" style="position:absolute; top:0; left:0; width:100%; height:100%;"></iframe>

A pure pipe is employed here to sanatize URL input on the DOM.

Component should have the safeUrl pipe as follows;

@Pipe({
  name: "safeUrl",
  pure: true
})
export class SafeUrlPipe implements PipeTransform {
  constructor(private sanitizer: DomSanitizer) {}
  transform(url: string): SafeResourceUrl {
    return this.sanitizer.bypassSecurityTrustResourceUrl(url);
  }
}

Although this setup will allow a piece of URL to be sanatized and rendered in the DOM, you may still run into an issue on the hosting part of your URL. For example, if you're trying to display a page from https://bit.ai but it's not displayed, try and alter your URL in the following manner:

https://acme.bit.ai/docs/**view**/4fkh34972kahf

changed to

https://acme.bit.ai/docs/**embed**/4fkh34972kahf

-1

If you're using Rails >4, this worked for me:

Add this line inside the respective controller method:

response.headers["X-FRAME-OPTIONS"] = "ALLOWALL"

e.g.:

  def extension
    response.headers["X-FRAME-OPTIONS"] = "ALLOWALL"
    ...
  end

Not the answer you're looking for? Browse other questions tagged or ask your own question.