Html 5 in an iframe

  • Henrik Gregersen

    (@henrikbonestdk)


    11 years, 2 months ago

    Hi.

    I have an HTML5 app which I would like to show on my wordpress site.

    I have uploaded the html5 app to wp-content/uploads/html5app

    I have created an iframe, that loads index.html like this

    <iframe src="<mydomain>/wp-content/uploads/html5app/index.html"></iframe>

    Basically what I am doing is just inserting the index.html directly

    But I have a problem
    If the html5 app is in the above location, it looks as if WordPress is trying to load the url as a wordpress permalink and it gives me a 404, like it is trying to rewrite the url to a permalink, and simply ingoring the index.html rendering.

    But If I put the html5 app on a different domain, it works fine.

    Is there a trick you can do in wordpress, or is it a server related issue?
    I would like to have the html5 app on my server, not an external because my site is https:

    Any tips?

Viewing 5 replies - 1 through 5 (of 5 total)
  • bernbe01

    (@bernbe01)

    11 years, 2 months ago

    two thoughts here:

    you wont be able to embed an iframe if you can’t hit the url directly… so… can you load <mydomain>/wp-content/uploads/html5app/index.html in a browser without issue or do you get 404?

    next thought / if it does show the wp error page, can you add an exception to your htaccess?

    along the lines of:

    RewriteRule ^print.php$ – [L]

    more info here: https://wordpress.org/support/topic/how-to-make-htaccess-exceptions?replies=2

    –> per that thread, i would suggest moving the html5 app to the docroot of the wordpress install:

    <mydomain>/html5app/index.html

    bernbe01

    (@bernbe01)

    11 years, 2 months ago

    I should have added that your exception would look like:

    RewriteRule ^html5app/ – [L]

    and that the exception goes inbetween the rewritebase and the rewrite rule

    Thread Starter Henrik Gregersen

    (@henrikbonestdk)

    11 years, 2 months ago

    Hi bernbe01

    Thanks for your answers.

    First of all, If I access the url directly without putting it in the iframe, I get the same result as if use it through an iframe.

    In both situations I get the 404, so I am pretty sure that it is a rewrite issue.

    But if I understand the standard wordpress .htaccess file then this :

    RewriteCond %{REQUEST_FILENAME} !-f
    This condition is true if the the path REQUEST_FILENAME not refers to an existing file.

    (source: )

    So since I try to access an existing file ( the index.html file) in the html5 app path directly, I would expect this rule to not send the url to the index.php file of wordpress.

    But I have now tied to add the RewriteRule to the wordpress site url file, and now it does not send the url to wordpress index.php file.

    So your suggestion actually works, but I would expect it not to be a problem because of the :

    RewriteCond %{REQUEST_FILENAME} !-f

    Can you explain this? Have I understood it wrong?

    Thread Starter Henrik Gregersen

    (@henrikbonestdk)

    11 years, 2 months ago

    Sorry something went wrong above, so I ended up adding a link to the source for almost the entire post 🙂

    bernbe01

    (@bernbe01)

    11 years, 2 months ago

    i can’t explain it too deeply 😛 but I’ll try. if i’m misspeaking please someone correct me

    htaccess will apply the first match or exclude it finds, so the top is the highest priority in an htaccess directive for rewrites

    the RewriteCond %{REQUEST_FILENAME} !-f path is looking for a filename in your top lovel (docroot) so it’s not looking for a match on the folder level

    RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d

    the above suppsoedly accounts for both, but i can’t confirm as I don’t use my uploads folder for anything other than wp-managed content

    good read

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Html 5 in an iframe’ is closed to new replies.