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>&nbsp;</p> <p>&nbsp;</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


Popular posts from this blog