html containing iframe won't display in browser - html

I want to embed a video stream in a html page. I run apache on a raspberry pi. With the standard index.html it works fine. When I change to my custom index.html, it says the page takes too long to load. This occurs when I access from another network (the internet) not the local network.
This is the content of the html page:
<html>
<head>
</head>
<body>
<iframe src=”http://192.168.1.56:8081” height=”480” width=”640”>
</iframe>
</body>
</hmtl>
My research has led me to X-Frame-Options (this is the best reference https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options i found).
I have enabled the headers module
a2enmod headers.load
systemctl restart apache2
and added the following line at the end of the apache2.conf file
Header always set X-Frame-Options “ALLOW-FROM http://192.168.1.56:8081”
Could you please help?
Thanks!`

Related

cache webpage in case site is down

I'm trying to create a static webpage that is cached in the browser. However when I take down the website the browser gives a 404 error.
I'm using the manifest attribute in HTML like so.
<html manifest="manifest.appcache">
<head>
<title>Connection Verification</title>
</head>
<body>
<h3>Testing Connection...</h3>
</body>
my manifest.appcache looks like this.
CACHE MANIFEST
#Nothing to load here
I assume the top level HTML file is implied.
I am also sending the cache-control header in the response.
cache-control: public max-age:3153600
However when I bring down the webserver and reload the page it still gives a 404 error. Is there some way to force browser to cache?

How to use a heroku app inside a html iframe?

I want to use this heroku app (spring boot) inside an iframe. https://sef-github-leaderboard.herokuapp.com/ but it doesn't work. it says refused to connect. Here's the code.
<!DOCTYPE html>
<html>
<body>
<iframe src="https://sef-github-leaderboard.herokuapp.com/" title="Iframe Example" style="height:500px;width:100%;"></iframe>
</body>
</html>
If you open up devtools, click the Network tab, refresh the page, and click the first item in the waterfall, you'll find that the Content Security Policy header X-Frame-Options is set to DENY on the URL you are seeking to embed. This instructs the browser to disallow loading the page within an iframe. To get around this, you would need to use a forward proxy to strip out the headers.

blockquote does not return anything

This sample works in codepen, but not work in my html file?
why is this happening?
i already tried to add https:// to href, but still not working
<script async src="//s.imgur.com/min/embed.js" charset="utf-8"></script>
a
<blockquote class="imgur-embed-pub" lang="en" data-id="KUteCdn">
View post on imgur.com
</blockquote>
My guess is that this is a CORS related issue, verify this by checking your js console. To rectify this, you can run a simple HTTP server and serve the html file from there.
on Mac OS you run the following in terminal from your working directory
http-server -p 4090 .
In your web browser, navigate to http://localhost:4090
This will stop you from receiving such an erroe

Auto refresh in Mac not working for some site

I got a code that refreshes the html page as per the seconds I desire. I am on an Mac and I use the TextEdit app to make the HTML file. This code works for www.apple.com but it does not work for say, https://www.bitcointalk.org or http://www.macrumors.com.
I am not sure why this is happening. All I am doing is replacing the apple URL with bitcointalk url. I know I can also do this refreshing via Safari extension, but I need this code to work.
Thanks a lot
The code I am using is:
<html>
<head>
<meta http-equiv="refresh" content="5">
</head>
<FRAMESET>
<FRAME src="http://www.apple.com/">;
</FRAMESET>
</html>
EDIT: What I am trying to do is, create this html and move it to my iPhone, so that I can do the web refresh through my phone. Right now there are only paid apps in the App store that lets you refresh a page automatically every few seconds/minute and they are not really that good.
As #esqew pointed out in their comment, the sites that aren't showing up forbid access via frames by setting the X-Frame-Options HTTP header to DENY or SAMEORIGIN.
See https://developer.mozilla.org/en-US/docs/Web/HTTP/X-Frame-Options

Why doesn't <iframe> work properly for me?

I have a simple bit of HTML code:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>iframe Practice</title>
</head>
<body>
<div>
<iframe src="//embed.gettyimages.com/embed/183351352?et=dbA2ZDFzQUqFbu8nRMfGww&sig=ozPqnsmwjm88sptsMM2UVS70lzd2ci-9q27BF6R0TzU=" width="507" height="407" frameborder="0" scrolling="no"></iframe>
</div>
</body>
</html>
When saved with .html extension and opened in a multiple browsers, I get a message saying "The file or directory could not be found." This is a very silly question, can somebody help me out with this?
Thanks!
You are using a scheme relative URI (one that begins with //).
This preserves the current scheme, so the content will load if you view it in a document hosted on http: or https: (normally you would get a security error if you tried to load an https: document into an http: document or vice versa).
You appear to not be using a web server, so you are trying to access the document via file: where it is not available.
You can either use an explicit scheme (replace // with http://) or do your testing on a web server (you can install one on your development system).
I'd generally recommend picking the latter option, there are many issues that crop up when you are testing documents on file: and using a development server bypasses them all.
Simply "//embed... in the iframe element's src property to http://embed....
<iframe src="http://embed.gettyimages.com/embed/183351352?et=dbA2ZDFzQUqFbu8nRMfGww&sig=ozPqnsmwjm88sptsMM2UVS70lzd2ci-9q27BF6R0TzU=" width="507" height="407" frameborder="0" scrolling="no"></iframe>
Are you trying to load the file locally with file://xxxxxxx You can not load and iframe this way you need to run it with a web server