为什么我的服务器端包含 (SSI) 不工作？答案

【问题标题】：Why isn't my Server Side Includes (SSI) working?为什么我的服务器端包含 (SSI) 不工作？
【发布时间】：2016-02-26 05:26:46
【问题描述】：

我正在创建一个网站，即在带有 Apache 的 Amazon EC2 实例上，我正在尝试让 SSI 工作/启用，我已经上传了 .htaccess 文件和我想要包含的文件，等等，但 SSI 仍然无法正常工作。为什么我的 SSI 不起作用？

我上传的所有文件都位于/var/www/html，如果有帮助的话！

我的 .htaccess 文件中有 AddType text/html .shtml AddOutputFilter INCLUDES .shtml。

我的 index.html 文件中的包含命令：。

main_nav.shtml：

<!--Main Nav-->
<header>
	<nav>
		<div class="main_nav">
		<a id="second_nav_bar" href="">Contact Me!</a>
		<a id="second_nav_bar" href="">About Me</a>
		<a id="second_nav_bar" href="">Search my site</a>


	<!--
		<div id="searchbox_div">
			<form action="" id="searchbox">
				<input id="search_input" type="search" name="searchmysite" placeholder="Search my Site!">
				<input type="submit" value="Search!">
			</form>
		</div>
	-->


		</div>
		
		<div id="logo">
			<h1 id="logo_jeff">JEFF</h1>
			<h1 id="logo_arries">ARRIES</h1>
			<h1 id="logo_website">WEBSITE</h1>
		</div>
		
		<div id="main_nav">
			<ul>
				<li><a class="main_nav" href="">Home</a></li>
				<li><a href="">Blog</a></li>
				<li><a href="">Trips</a></li>
				<li><a href="">Politics</a></li>
				<li><a href="">Pictures</a></li>
				<li><a href="">Videos</a></li>
				<li><a href="">Computer</a></li>
				<li><a href="">Misc</a></li>
			</ul>
		</div>
	</nav>
</header>

<!-- End Main Nav-->

这是我计算机上的文件（不提供文件）（只是为了展示我的服务器的外观，见下文）：

这是我的 Amazon EC2 服务器（提供文件）的终端屏幕截图，显示了文件和结构（见上文）：

仅供参考。我的网站是jeffarries.com，如果你想实时观看的话。

如果您需要任何进一步的信息，请随时询问！

更新：

更新 2：

Main_nav.shtml：

<!--#include file="main_nav.shtml" -->

<!--Main Nav-->
<header>
	<nav>
		<div class="main_nav">
		<a id="second_nav_bar" href="">Contact Me!</a>
		<a id="second_nav_bar" href="">About Me</a>
		<a id="second_nav_bar" href="">Search my site</a>


	<!--
		<div id="searchbox_div">
			<form action="" id="searchbox">
				<input id="search_input" type="search" name="searchmysite" placeholder="Search my Site!">
				<input type="submit" value="Search!">
			</form>
		</div>
	-->


		</div>
		
		<div id="logo">
			<h1 id="logo_jeff">JEFF</h1>
			<h1 id="logo_arries">ARRIES</h1>
			<h1 id="logo_website">WEBSITE</h1>
		</div>
		
		<div id="main_nav">
			<ul>
				<li><a class="main_nav" href="">Home</a></li>
				<li><a href="">Blog</a></li>
				<li><a href="">Trips</a></li>
				<li><a href="">Politics</a></li>
				<li><a href="">Pictures</a></li>
				<li><a href="">Videos</a></li>
				<li><a href="">Computer</a></li>
				<li><a href="">Misc</a></li>
			</ul>
		</div>
	</nav>
</header>

<!-- End Main Nav-->

index.shtml:

<head>
<title>Home | Jeff's Website</title>

<link href="styles/main_navigation.css" type="text/css" rel="stylesheet" />
<link href="styles/body.css" type="text/css" rel="stylesheet" />
<link href="styles/main_content.css" type="text/css" rel="stylesheet" />


<!-- Icon code -->
<link rel="apple-touch-icon-precomposed" sizes="57x57" href="/website_icons/apple-touch-icon-57x57.png" />
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="/website_icons/apple-touch-icon-114x114.png" />
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="/website_icons/apple-touch-icon-72x72.png" />
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="/website_icons/apple-touch-icon-144x144.png" />
<link rel="apple-touch-icon-precomposed" sizes="60x60" href="/website_icons/apple-touch-icon-60x60.png" />
<link rel="apple-touch-icon-precomposed" sizes="120x120" href="/website_icons/apple-touch-icon-120x120.png" />
<link rel="apple-touch-icon-precomposed" sizes="76x76" href="/website_icons/apple-touch-icon-76x76.png" />
<link rel="apple-touch-icon-precomposed" sizes="152x152" href="/website_icons/apple-touch-icon-152x152.png" />
<link rel="icon" type="image/png" href="/website_icons/favicon-196x196.png" sizes="196x196" />
<link rel="icon" type="image/png" href="/website_icons/favicon-96x96.png" sizes="96x96" />
<link rel="icon" type="image/png" href="/website_icons/favicon-32x32.png" sizes="32x32" />
<link rel="icon" type="image/png" href="/website_icons/favicon-16x16.png" sizes="16x16" />
<link rel="icon" type="image/png" href="/website_icons/favicon-128.png" sizes="128x128" />
<meta name="application-name" content="&nbsp;"/>
<meta name="msapplication-TileColor" content="#FFFFFF" />
<meta name="msapplication-TileImage" content="/website_icons/mstile-144x144.png" />
<meta name="msapplication-square70x70logo" content="/website_icons/mstile-70x70.png" />
<meta name="msapplication-square150x150logo" content="/website_icons/mstile-150x150.png" />
<meta name="msapplication-wide310x150logo" content="/website_icons/mstile-310x150.png" />
<meta name="msapplication-square310x310logo" content="/website_icons/mstile-310x310.png" />
<!-- End Icon code -->



<!-- Chatrify Script-->
<script type='text/javascript'>
    var __ac = {};
    __ac.uid = "08c261285ca9db6acdaf945deef7cd7b";
    __ac.server = "secure.chatrify.com";

    (function() {
      var ac = document.createElement('script'); 
      ac.type = 'text/javascript'; 
      ac.async = true;
      ac.src = 'https://cdn.chatrify.com/go.js';
      var s = document.getElementsByTagName('script')[0]; 
      s.parentNode.insertBefore(ac, s);
    })();
	</script>


</head>


<body>
	
	
<!--#include file="main_nav.shtml" -->



<!-- Landing Beta Pop Up box -->

<div id="popup_div">
	<div id="popup_beta">
		<p id="popup_main_header">Welcome to my website!</p>
		<p id="popup_main_content">My site is currently under construction. &nbsp; I'm trying to get everything ready, working and online as soon as possible. &nbsp;But for the time being, there may be broken/grayed out links and random stuff that doesn't work properly. Thank you for your patience!</p>
		
		<a id="got_it_button"href="#" onclick="toggle_visibility('popup_div');">Got it!</a>
	</div>
</div>

<!-- End Landing Beta Pop Up box -->

<!-- Pop Up Email Form-->
<div id="popup_email_form_div">
	<div id="popup_email_form_div_content">
		<p>Contact Form</p>
		<form method="post" action=""></form>
	</div>
</div>

<!-- End Pop Up Email Form-->



<!--Welcome to jeff's website-->

<div>
	<h2 id="welcome">Welcome to my Website!</h1>
	
	<a href="#here_you_can_learn">
	<img src="pictures/down_arrow.png" id="down_arrow"/>
	</a>
</div>

<!-- End Welcome to Jeff's website-->

<!--right side nav-->

<aside>
	<p>this is aside</p>

</aside>


<!--Main Content-->

<div id="main_content">
	<h2 id="here_you_can_learn">Here you can learn about me and my adventures!</h2>

<!--Most Frequently visited pages: on left side of page-->
	<div id="most_frequent">
		<p class="heading">Most frequently visted pages!</p>
		
		
		
		<a href="" class="show_more_link"><p class="show_more">Show More</p></a>

	</div>
	
<!--Recent Activity: on the right side of page-->
	<div id="recent_activity">
		<p class="heading">Recent Activity</p>


		<p class="content">test</p>


		<a href="" class="show_more_link"><p class="show_more">Show More</p></a>
	</div>
</div>



<script type="text/javascript">

    function toggle_visibility(id) {
       var e = document.getElementById(id);
       if(e.style.display = 'block')
          e.style.display = 'none';
       else
          e.style.display = 'block';
    }

</script>


</body>

我的 finder 窗口现在的屏幕截图：（不提供文件，但与服务器相同）

【问题讨论】：

标签： html .htaccess amazon-ec2 ssi

【解决方案1】：

这个：

AddOutputFilter INCLUDES .shtml

...告诉 Apache 在 .shtml 文件中查找 SSI 指令。

您已将 SSI 指令 () 放在 .html 文件中，而不是 .shtml 文件中。

【讨论】：

将AddOutputFilter INCLUDES .shtml 放入.htaccess 文件中？看来我的 SSI 指令确实有 .shtml。
@JeffArries — index.html 没有 .shtml。 main_nav.shtml 有 .shtml 但main_nav.shtml 不包含 SSI 指令。
好的，所以我需要把它放在我正在 SSI 的文件中，并将请求 SSI 的文件命名为 .shtml 吗？我的 .htaccess 文件中已经有 AddOutputFilter INCLUDES .shtml。
您需要将 放入浏览器直接请求的文件中（您已完成此操作，请将其放入index.html）。该文件必须具有.shtml 文件扩展名（您尚未这样做，您将文件称为index.html）。
好的，将修复并上传！