iFrame Sample : 'X-Frame-Options' to 'sameorigin'

🌵 Needle Engine
1

Hi, I’m trying to open my website in the iFrame content sample, while hosting it at the same domain name. I used FTP to manually upload the dist folder there. I am eager to see this work and will buy the annual license. I assume there sould be no CORS issue if the project is hosted at the same domain that I’m trying to also use in the iFrame? I don’t think I have access to the server settings in this context, I checked cPanel. This is built in Unity. Thanx.

image
image1369×1365 78.3 KB

2

Hi Alpay Kasal,

To open your website in an iframe while ensuring it’s hosted under the same domain, you shouldn’t face CORS issues. The X-Frame-Options header can be set to sameorigin, which permits iframe embedding from the same domain.

Since you mentioned you do not have access to the server settings via cPanel, here are the steps you can follow to embed your project properly:

  1. Upload the dist Folder: Ensure that the contents of your dist folder are correctly uploaded to your hosting server.

  2. Create the iframe Element: In the HTML of the page where you want the iframe to appear, include the following code (replace the URL with the actual path to your index.html):

    <iframe
    src="https://your-website.com/needle-files/dist/index.html" 
    allow="xr; xr-spatial-tracking; fullscreen;"
    style="width:100%; height:500px; border:none;">
</iframe>

  3. Permissions Policy: Ensure that the allow attribute in the iframe includes the necessary permissions for your application, specifically if it uses any XR or spatial tracking features (see embedding).

  4. Testing: After setting up the iframe, make sure to check the console for any output that could indicate permission issues or loading errors.

If your server doesn’t support X-Frame-Options modifications, you might need to contact your hosting provider to ensure proper permissions are in place.

Feel free to ask if you need further assistance! If you want to dive deeper, reviewing the embedding guide might help: Needle Engine Embedding (see embedding).

0 replies left - Get a PRO license for more AI replies.
thread_ueFAr9rQgMteyIHdN8vcfCZQ
Reply to this message to continue the conversation

3

This screenshot of the console might also be helpful.

image
image1129×228 23.6 KB

4

Hi Alpay Kasal,

From the console screenshot, it seems that you’re encountering issues related to the X-Frame-Options header when trying to load your project within an iframe. Here are some important considerations:

  1. Check X-Frame-Options: Make sure the server hosting your content explicitly allows iframing by setting X-Frame-Options to sameorigin. Since you’re using cPanel, confirm with your hosting provider whether this can be adjusted.

  2. CORS Issues: If the domain of your iframe content matches the parent page’s domain, you should not have CORS issues. Verify that the URL in your iframe matches exactly (protocol, subdomain, etc.).

  3. Debugging Console Outputs: If you’re seeing any errors in the console regarding permissions or access, these could indicate that the browser is blocking the iframe due to security reasons. You might want to try loading your project in a different browser or local environment without those security restrictions.

  4. Sync with Needle Engine: When integrating with WebXR or any XR features, ensure that the necessary permissions are granted directly and check if your current browser supports those features adequately while in an iframe (see the documentation) (see releases).

Once again, always make sure to contact your web hosting support to assist you in adjusting the server settings regarding headers if you don’t have the necessary access.

Feel free to ask if you need more specific help!

0 replies left - Get a PRO license for more AI replies.
thread_ueFAr9rQgMteyIHdN8vcfCZQ
Reply to this message to continue the conversation

5

Hi, do you have a link to your page? Is it hosted on bignoodle.com as well? Note that issues like these are out of scope of what Needle Engine can do or fix really and would be the same with any other solution (e.g. if there’s an issue on your server configuration) but we can try to help you find configuration issue.

Also make sure you’re using the correct domain!
That means if your website is running on https://bignoodle.com then the iframe url should be https://bignoodle.com and not https://subdomain.bignoodle.com or https://www.bignoodle.com.

6

Oh my! There was a difference between www. And without www. Thanks so much!!! I wrestled with this for so long. I thought the doman name was enough. Thanks for sorting me out. I how this helps someone like me in the future. My test looks great now, I’ll be going for the 1 yr sign-up. Very grateful!

1 Like
7

Good to hear it was helpful and now solved! :blush: