在Node.js中出现了“Uncaught SyntaxError：Unexpected token <”错误

Question

在Node.js中出现了“Uncaught SyntaxError：Unexpected token <”错误

11

当我尝试服务于客户端代码时，运行node server/server.js时，出现以下截屏错误：

以下是我的server.js代码...

app.use(express.static(path.join(__dirname, "public")));
app.use(logger('dev'));
app.use(bodyParser.json({limit: '50mb'}));

app.all('/*', function(req, res, next){
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Methods", "GET, PUT, POST, DELETE, OPTIONS");
    res.header("Access-Control-Allow-Headers", "Content-type,Accept,X-Access-Token,X-Key");

    if(req.method === 'OPTIONS'){
        res.status(200).end();
    } else {
        next();
    }

});

app.all("/api/v1/*", [require('./middlewares/validateRequest')]);
app.use("/", require("./routes"));

app.use(function(req, res, next){
    var err = new Error("Not found");
    err.status = 404;
    next(err);
});

在我的routes/index.js文件中，我为get请求编写了以下内容。

router.get('*', function(req, res) {
    res.sendfile('./public/index.html');
});

- ShankarGuru

1

看起来它正在读取 HTML 文件而不是 JavaScript 文件。你是否使用了正确的 jQuery JavaScript 文件？请检查网络选项卡。 - Praveen Kumar Purushothaman

Chrome：检查网络选项卡。Firefox：检查网络选项卡。查看jQuery请求的响应。 - Praveen Kumar Purushothaman

@PraveenKumar：在网络选项卡中，它正在加载HTML文件而不是JavaScript文件...为什么？http://localhost:3000/assets/libs/jquery/jquery.min.js 这个链接并没有指向JS文件，而是index.html...在查看源代码时。 - ShankarGuru

@ShankarGuru - 它正在提供HTML文件，因为你告诉它这样做。查看你的路由。res.sendfile('./public/index.html'); - Quentin

@Quentin：为什么index.html中没有包含js文件的服务... - ShankarGuru

@ShankarGuru — 因为你的路由指定了提供 index.html 文件。 - Quentin

5个回答

2

我的文件夹结构

node(folder)
     server.js
     -client(f)
           -index.html
           -views(f)
           -js(f)
              -ctrl(f)
              -service(f)
              -app.js
              -state.js

并且

app.use(express.static('client'));
app.get('/index.html', function (req, res) {

  res.sendfile(_dirname + '/index.html');

});

从浏览器拨打此电话：http://127.0.0.1:1956/index.html。

var server = app.listen(1956, function (req, res) {
    var host = server.address().address
    var port = server.address().port
    console.log("app listening at", host, port)
});

对我来说它运行良好。

- praveenpds

谢谢！基本上，我们需要指向包含静态文件（如js、css等）的目录。 - Gabe Karkanis

2

我认为这可能是由于你的/public/index.html文件引起的。

当你在index.html文件中引入JavaScript文件时，"src"属性存在问题。因此它将返回一个"未找到"的HTML文件而不是实际的JavaScript文件。

- ruichao

1

我找到了解决方案。Node.js应用程序尝试编译公共文件夹内的JavaScript文件，这会导致错误；你定义公共文件夹的方式如下：

app.use(express.static(path.join(__dirname, 'public')));

尝试使用虚拟目录定义它，只需添加一个特定的虚拟文件夹名称，如下所示：

app.use('/static', express.static(path.join(__dirname, 'public')));

这应该可以工作；

- Mostaffa Ossman

0

我猜问题的一部分在你的路由器中。

在你的routes/index.js文件中，将get请求更改为

router.get('/', function(req, res) {
    res.sendfile('./public/index.html');
});

你是否正在使用gulp或类似的方式对你的资源进行流水线处理？如果不是，那么你是如何提供你的资源的呢？

我建议你要么静态地提供你的资源，要么使用gulp。

- Oss

我没有使用gulp来进行管道化资产处理...事实上，我认为提供index.html文件也会提供js文件...我是否应该单独包含js、css文件？我的意思是它们的路径... - ShankarGuru

不会的。我建议您要么静态地提供您的资产 http://expressjs.com/en/starter/static-files.html，要么使用 gulp。 - Oss

我已经做得对了，app.use(express.static(path.join(__dirname, "public"))); 它不应该在提供index.html的同时返回public目录中的所有文件吗？ - ShankarGuru

你尝试过将路由器从 * 更改为 / 吗？ - Oss

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Jonathan Morales Vélez · Accepted Answer

通常情况下，当浏览器请求 JavaScript 文件时，服务器会发送一个 HTML 文件。这是由于类似于 app.get('*'... 的规则所导致的。因此，我们需要告诉服务器先发送静态文件，然后再声明规则，如下所示：

// Declare static folder to be served. It contains the JavaScript code, images, CSS, etc.
app.use(express.static('build'));

// Serve the index.html for all the other requests so that the
// router in the JavaScript application can render the necessary components
app.get('*', function(req, res){
  res.sendFile(path.join(__dirname + '/build/index.html'));
  //__dirname : It will resolve to your project folder.
});