错误:获取js文件net::ERR_ABORTED 404(未找到)node.js

问题描述 投票:0回答:2

我知道这个问题不是第一个,但我不知道在哪里寻找解决方案。 我有一个快速后端服务器。当它启动时,它必须渲染包含 main.js 的 HTML 页面。

app.js代码:

var createError = require('http-errors');
var express = require('express');
var path = require('path');
// <...>

var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');
var app = express();

app.set('views', path.resolve(__dirname, 'views'));
app.set('view engine', 'jade');

app.use(cors());
app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.resolve(__dirname, 'public')));

var listener = app.listen(5000, function(){
  console.log('Listening on port ' + listener.address().port);
  
});
app.use('/', indexRouter);
app.use('/users', usersRouter);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  next(createError(404));
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});



module.exports = app;


public/index.html代码:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
     <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet"
        type="text/css">
    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon">
    <title>Fetch Travels</title>
    <style>
        #play {
            display: none;
        }
    </style>
</head>

<body>
    <button type="button" class="btn btn-primary" id="play">search</button>


    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
    <script src="main.js" type="module"></script>
</body>

</html>

public/main.js 显然是一个客户端脚本,在服务器上找不到,但在本地主机中找到。

javascript html node.js express http-status-code-404
2个回答
0
投票

改成这样

<script src="/main.js" type="module"></script>

0
投票

首先您需要遵循正确的文件夹结构:Public 应该位于 src 目录中 而不是这个(你拥有的):

- public
  - main.js
  - ingex.html
- src
  - index.js
  ...

你必须这样做

- src
  - index.js
  - public
    - main.js
    - ingex.html
  ...

其次,您需要在 src/index.js 中的快速配置中使用这一行,以便让服务器传递额外的文件(不仅仅是 index.html)

app.use("/public/", express.static(__dirname + '/public'));

最后是 html 标签:

<script src="public/main.js"></script>
© www.soinside.com 2019 - 2024. All rights reserved.