错误消息显示意外的尖括号,但应该没有意外的尖括号

时间:2016-07-17 17:27:37

标签: jquery html node.js server runtime-error

我已经编写了一些我正在使用node.js从我的节点服务器提供的代码。我的HTML服务很好,但当我开始向index.html文件添加脚本时,我发现开发人员控制台中出现了最奇怪的错误:

Uncaught SyntaxError: Unexpected token < jquery-1.12.4.min.js:1
Uncaught SyntaxError: Unexpected token < hack.js:1 

这是我的HTML:

<!DOCTYPE HTML>
<html>
  <head>
    <link rel="stylesheet" type="text/css" href="hack.css">
  </head>
  <body>
    <h1>Colour Hack v1.0</h1>
    <p>Guess the correct values for each colour to unlock information on the European Union.</p>
    <script src="jquery-1.12.4.min.js"></script>
    <script src="hack.js"></script>
  </body>
</html>

hack.js代码:

const box = "<canvas>BOX</canvas>"

$(document).ready(function()  {
  $("p").append(box);
});

节点服务器(server.js)代码为:

//Import http and file server libraries
const http = require('http');
const fs = require('fs');

//Define port for comms
const PORT = 8080;

//Start server
http.createServer(function(request, response)  {
  response.writeHead(200);
  fs.readFile('index.html', function(err, contents)  {
    response.write(contents);
    response.end;
  });
}).listen(PORT);

console.log('Server listening on port: %s', PORT);

为什么出现意外的尖括号错误?

1 个答案:

答案 0 :(得分:2)

您正在使用index.html的内容回复对服务器的每个请求。因此,<中的index.html是您<!DOCTYPE HTML>文件request第一行的url。 (在“网络”选项卡中查看浏览器的开发工具,查看服务器为这些JavaScript文件返回的内容。)

您需要查看所请求的内容并返回正确的资源(请参阅IncomingMessage的文档,这是 <a class = "navbar-brand visible-xs" href = "<?php echo esc_url(home_url()); ?>"><img src="<?php echo get_template_directory_uri(); ?>/images/logo.png" alt="logo">" width="50"> </a><!-- /navbar-brand visible-xs --> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <!-- /navbar-toggle --> </div> <!-- /navbar-header --> <div class="collapse navbar-collapse"> <ul class="nav navbar-nav navbar-right hidden-xs social "> <li><a href="#"><i class="fa fa-lg fa-facebook"></i></a></li> <li><a href="#"><i class="fa fa-lg fa-instagram"></i></a></li> <li><a href="#"><i class="fa fa-lg fa-500px"></i></a></li> </ul><!-- /hidden-xs social --> <ul class="nav navbar-nav navbar-center"> <li><a href="index.html">HOME</a></li> <li><a href="">PORTFOLIO</a></li> <li class="dropdown hidden-xs"><a href="index.html" class="navbar-brand"><img id="logo-navbar-middle" src="C:\Users\Carolin_2\Desktop\nicole\logonew.png" width="50"</img></a></li> <li><a href="index.html">LEISTUNGEN</a></li> <li><a href="">KONTAKT</a></li> </ul><!-- /navbar-nav --> <ul class="nav navbar-nav navbar-center visible-xs social nav-pills"> <li><a href="#"><i class="fa fa-lg fa-facebook"></i></a></li> <li><a href="#"><i class="fa fa-lg fa-instagram"></i></a></li> <li><a href="#"><i class="fa fa-lg fa-500px"></i></a></li> </ul><!-- /visible-xs social --> </div> <!-- /navbar-collapse--> </div><!-- /container fluid--> 的内容 - 您可以从/* === NAVBAR ===*/ .navbar{ background-color: black; margin-bottom: 0; border: 0; } .navbar-inverse .navbar-nav>li>a{ text-align: center; color: white; display: inline-block; float:none; vertical-align: top; } @media (min-width: 768px){ .navbar-nav{ float:none; margin: 0 auto; display: table; table-layout: fixed; } } .navbar .navbar-collapse { text-align: center; } .navbar-inverse .navbar-toggle -.icon-bar{ color: white; } 获取请求的网址例如,属性,或者使用很乐意为你做这件事的库(如ExpressJS)。