0

I have a lightning component with iFrame. I a getting the 'sameorigin' issue. am I missing anything?

Lightning Component:

<aura:component implements="flexipage:availableForAllPageTypes,
                            flexipage:availableForRecordHome" access="global">
    <aura:attribute name="iframeUrl" type="String" />
    <aura:attribute name="width" type="String" />
    <aura:attribute name="height" type="String" />
    <aura:attribute name="scrolling" type="String" />
    <aura:attribute name="frameBorder" type="String" />
    <aura:attribute name="style" type="String" />
    <aura:attribute name="sandbox" type="String" />

    <iframe src="{!v.iframeUrl}"
            width="{!v.width}"
            height="{!v.height}"
            style="{!v.style}"
            frameBorder="{!v.frameBorder}"
            sandbox="{!v.sandbox}"
            scrolling="{!v.scrolling}"/>

</aura:component>

Design:

<design:component label="iFrame Component">
    <design:attribute name="iframeUrl" label="Source URL (HTTPS only)" default="https://www.google.com/"/>
    <design:attribute name="width" label="Width" default="100%"/>
    <design:attribute name="height" label="Height" default="500px"/>
    <design:attribute name="style" label="Style" default="border: none; overflow: scroll;"/>
    <design:attribute name="scrolling" label="Scrolling" default="auto"/>
    <design:attribute name="frameBorder" label="Frame Border" default="0"/>
    <design:attribute name="sandbox" label="Frame Border" default="allow-same-origin allow-scripts allow-forms"/>
</design:component>

Error:

Refused to display 'https://www.google.com/' in a frame because it set 'X-Frame-Options' to 'sameorigin'.

  • 1
    Google doesn't want to be placed in an iframe, so you can't place it in an iframe. Try using a resource that allows itself to be framed. – sfdcfox Jan 16 at 17:36
  • @sfdcfox, actually I am trying to embed a tableau dashboard on Lightning Home page. So, Tableu also has the same issue, so I need to think about different approach – Ajay Jan 16 at 17:48
  • I am currently working on tableau is the dashboard is public facing or private. public one works for me please try with visualforce page first. I used VF page to show. – Avijit Chakraborty Jan 16 at 18:05
  • Please also try implement forceCommunity:availableForAllPageTypes interface. – Avijit Chakraborty Jan 16 at 18:10
0

There are instructions on Tableau's site for how to properly embed views. Aside from this, there's not much we're going to be able to do to assist you. If you need further assistance with this, consider contacting their support. Security errors from other domains require support from the other domain. Lightning itself has some CSP restrictions, but these would not affect any secure site that has the correct headers.

0

Finally I went back to VF page option. and it worked fine. I thought of using Lightning component instead of VF page, however no luck

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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