html - IFrame: This content cannot be displayed in a frame; the error is still occurring after adding header -
i receiving error:
protect security of information enter website, publisher of content not allow displayed in frame. want embed youtube video site , i've added tags
<meta http-equiv="x-frame-options" content="allow">
but error still occurring. here entire code down added iframe tags.
<!doctype html> <html lang="en"> <head> <link rel="shortcut icon" href="/img/favicon.jpg"> <meta charset="utf-8"> <meta http-equiv="x-frame-options" content="allow"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="description" content=""> <meta name="author" content=""> <title>dronedaddy</title> <!-- bootstrap core css --> <link href="css/bootstrap.min.css" rel="stylesheet"> <!-- custom css --> <link href="css/business-casual.css" rel="stylesheet"> <!-- fonts --> <link href="http://fonts.googleapis.com/css? family=open+sans:300italic,400italic,600italic,700italic,800italic,400,300,600,7 00,800" rel="stylesheet" type="text/css"> <link href="http://fonts.googleapis.com/css? family=josefin+slab:100,300,400,600,700,100italic,300italic,400italic,600italic, 700italic" rel="stylesheet" type="text/css"> <!-- html5 shim , respond.js ie8 support of html5 elements , media queries --> <!-- warning: respond.js doesn't work if view page via file:// --> <!--[if lt ie 9]> <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"> </script> <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> <![endif]--> <body> <p> </p> <p> </p> </body> </head> <body> <div class="brand">welcome dronedaddy</div> <div class="address-bar">lawton, ok</div> <!-- navigation --> <nav class="navbar navbar-default" role="navigation"> <div class="container"> <!-- brand , toggle grouped better mobile display --> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <!-- navbar-brand hidden on larger screens, visible when menu collapsed --> <a class="navbar-brand" href="index.html">dronedaddy</a> </div> <!-- collect nav links, forms, , other content toggling -- > <div class="collapse navbar-collapse" id="bs-example-navbar- collapse-1"> <ul class="nav navbar-nav"> <li> <a href="index.html">home</a> </li> <li> <a href="about.html">about</a> </li> <li> <a href="contact.html">contact</a> </li> <li> <a href="realestate.html" class="dropdown-toggle" data- toggle="dropdown">services <b class="caret"> </b> </a> <ul class="dropdown-menu"> <li><a href="realestate.html">real estate</a></li> <li class="divider"></li> <li><a href="inspection.html">aerial inspection</a></li> <li class="divider"></li> <li><a href="advertisement.html">advertisement</a></li> <li class="divider"></li> <li><a href="photography.html">aerial photography</a></li> <li class="divider"></li> <li><a href="police_tatical.html">police/tactical response</a> </li> </ul> </li> <li> <a href="blog.html">news</a> </ul> </div> <!-- /.navbar-collapse --> </div> <!-- /.container --> </nav> <div class="container"> <div class="row"> <div class="box"> <div class="col-lg-12 text-center"> <div id="carousel-example-generic" class="carousel slide"> <!-- indicators --> <ol class="carousel-indicators hidden-xs"> <li data-target="#carousel-example-generic" data- slide-to="0" class="active"></li> <li data-target="#carousel-example-generic" data- slide-to="1"></li> <li data-target="#carousel-example-generic" data- slide-to="2"></li> </ol> <!-- wrapper slides --> <div class="jumbotron col-lg-12"> <h1>featured video</h1> <p> hello, ok. </p> <iframe width="420" height="315" src="https://www.youtube.com/watch?v=e2od1fbocu8"> </iframe> </div>
to embed iframe, need use different url video - https://www.youtube.com/embed/e2od1fbocu8
more info on how embed youtube video site - http://www.w3schools.com/html/html_youtube.asp
the x-frame-options not defined you, youtube sends in video viewing page html response header , denies page embedding it. when define header on page, means page cannot embedded.
more on x-frame-options - https://developer.mozilla.org/en-us/docs/web/http/x-frame-options