文章/答案/技术大牛

发布

社区首页 >问答首页 >IFrame:此内容不能在框架中显示，添加表头后仍出错

问IFrame:此内容不能在框架中显示，添加表头后仍出错
EN

Stack Overflow用户

提问于 2015-04-10 05:13:32

回答 1查看 30.3K关注 0票数 1

我收到以下错误：

为了帮助保护您输入此网站的信息的安全，此内容的发布者不允许将其显示在框架中。我只想嵌入一个YouTube视频到我的网站，我已经添加了标签

<meta http-equiv="X-Frame-Options" content="allow">

但错误仍在发生。下面是我添加iframe标签的完整代码。

   <!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 and Respond.js IE8 support of HTML5 elements and media  queries -->
 <!-- WARNING: Respond.js doesn't work if you view the 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 to DroneDaddy</div>
 <div class="address-bar">Lawton, Ok</div>

 <!-- Navigation -->
 <nav class="navbar navbar-default" role="navigation">
    <div class="container">
        <!-- Brand and toggle get grouped for 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 is hidden on larger screens, but visible when  the menu is collapsed -->
          <a class="navbar-brand" href="index.html">DroneDaddy</a>
        </div>
        <!-- Collect the nav links, forms, and other content for 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 for 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>

html

iframe

youtube

回答 1

Stack Overflow用户

发布于 2015-04-10 05:33:28

要嵌入Iframe，您需要为您的视频使用不同的url - https://www.youtube.com/embed/e2od1FBOCU8

有关如何在您的站点嵌入YouTube视频的更多信息- http://www.w3schools.com/html/html_youtube.asp

X-FRAME-OPTIONS不是您自己定义的，但是YouTube在视频查看页面的HTML响应头中发送它，并拒绝任何页面嵌入它。当您在页面上定义页眉时，这意味着您的页面不能嵌入。

有关X-FRAME-OPTIONS - https://developer.mozilla.org/en-US/docs/Web/HTTP/X-Frame-Options的更多信息

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/29549154

复制

相似问题

问IFrame:此内容不能在框架中显示，添加表头后仍出错
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问IFrame:此内容不能在框架中显示，添加表头后仍出错EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问IFrame:此内容不能在框架中显示，添加表头后仍出错
EN