我目前正在为网站主页上的帖子设置视图页面。主页和视图页面都使用相同的页眉和页脚文件。它们都在同一目录级别。一个是工作,另一个不是。显示的错误似乎与页眉和页脚文件中的脚本和链接标记有关。
错误类型:(自定义脚本和链接也会抛出这些错误)
5ab70c4e84fa1b212efa0145:5 获取http://localhost:5000/home/scripts/lib/jquery-3.3.1.min.js net :: ERR_ABORTED 5ab70c4e84fa1b212efa0145:1
拒绝执行来自' http://localhost:5000/home/scripts/lib/jquery-3.3.1.min.js'的脚本因为它的MIME类型(' text / html')不可执行,并且启用了严格的MIME类型检查。
5ab70c4e84fa1b212efa0145:1拒绝使用' http://localhost:5000/home/stylesheets/main.css'因为它的MIME类型(' text / html')不是受支持的样式表MIME类型,并且启用了严格的MIME检查。
我的页眉和页脚部分如下:
部首:
<!DOCTYPE>
<html>
<head>
<script type="text/javascript" src="scripts/lib/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="scripts/lib/bootstrap.min.js"></script>
<link type="text/css" rel="stylesheet" href="stylesheets/bootstrap.min.css">
<script defer src="https://use.fontawesome.com/releases/v5.0.8/js/all.js" integrity="sha384-SlE991lGASHoBfWbelyBPLsUlwY1GwNDJo3jSJO04KZ33K2bwfV9YBauFfnzvynJ" crossorigin="anonymous"></script>
<link type="text/css" rel="stylesheet" href="stylesheets/main.css">
</head>
<body>
<nav class="navbar navbar-default navbar-inverse">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/"><i class="far fa-heart"></i> The Beanie Boo Network</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<form class="navbar-form navbar-left">
<div class="form-group">
<input type="text" class="form-control" placeholder="Search">
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form>
<ul class="nav navbar-nav navbar-right">
<% if(!currentUser){ %>
<li><a href="/login">Login</a></li>
<li><a href="/register">Register</a></li>
<% } else { %>
<li><a href="#"><%=currentUser.username%></a></li>
<li><a href="/logout">Logout</a></li>
<% } %>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container">
页脚:
</div>
<script type="text/javascript" src="scripts/main.js"></script>
</body>
</html>
文件适用于:(完整)
<% include ../partials/header %>
<header class="jumbotron">
<div>
<h1>Beanie Booboard</h1>
<h4>Keep up to date with whats going on on The Beanie Boo Network</h4>
</div>
</header>
<% posts.forEach(function(post){ %>
<div class="thumbnail">
<div class="row">
<div class="caption col-sm-6">
<div class="container">
<h2><%=post.title%></h2>
<p><%=post.content.substring(0, 50)%>...</p>
<p><em><%=post.author%></em></p>
<p><%=post.created.toDateString()%></p>
<a href="/home/<%=post._id%>"class="btn btn-xs btn-danger">Read More</a>
</div>
</div>
<div class="thumbnail-img col-sm-6">
<img class="img-responsive" src="<%=post.image%>">
</div>
</div>
</div>
<% }); %>
<% include ../partials/footer %>
文件不起作用:(完整)
<% include ../partials/header %>
<% include ../partials/footer %>
我试图找出并理解的是为什么一个文件丢失错误而另一个文件没有,我怎么能在将来避免这个错误,如果它出现就修复它?
答案 0 :(得分:0)
解决方案:
解决方案很奇怪,因为它没有解释为什么它在一个页面而不是另一个页面中工作。但我改变了脚本和链接标签一点点。我从页眉和页脚文件中的链接和脚本标记中删除了type属性,并添加了&#34; /&#34;在文件路径前面。在已经工作的那个中没有任何改变,但现在不起作用的那个有效。
如果有人对内部运作有任何了解,我会非常感激和解释。感谢。