GET http://localhost:3000/public/js/test.js net::ERR_ABORTED 404（未找到）

Question

我尝试将 sign_up.liquid 与 test.js 连接起来。但我有错误 404。

我认为我连接这两个文件的路径是正确的：

  <script src="../../public/js/test.js"> </script>
  <form id="formSignUp" method="POST" onsubmit="return main()">
    <h1>Inscription</h1>
    <input type="text" id="form_input_name" name="name" placeholder="Prénom" size= "30">
    <input type="text" id="form_input_surname" name="surname" placeholder="Nom" size= "30">
    <input type="text" id="form_input_mail" name="mail" placeholder="E-mail" size= "30">
    <input type="password" id="form_input_password" name="password" placeholder="Mot de passe" size= "30">
    <input type="password" id="form_input_conf_password" name="conf_password" placeholder="Confirmation de mot de passe" size= "30">

    <div id="div_checkNewsletter">
        <input type="hidden" name="newsletter" value="0">
        <input type="checkbox" id="box_newsletter" name="newsletter" value="1">
        <label for="newsletter">En cochant cette case, j’accepte de recevoir <br>les actualités d’Otablo.</label>
    </div>

    <button type="submit" id="button_orange_center"> Suivant</button>
</form>

我的 server.js 可以将我的静态文件发送到客户端：

const express = require('express')
const app = express()
const path = require('path')
const bodyParser = require('body-parser')
const http = require('http').createServer(app)

// Liqui Param
const { Liquid } = require('liquidjs')
const engine = new Liquid({
  root: ['./views', './views/partials', './views/layouts']
})

const HTML_DIR = path.join(__dirname, '/public/')
app.use(express.static(HTML_DIR))

app.use(bodyParser.json())
app.use(bodyParser.urlencoded({ extended: true }))

我不明白为什么 sign_up.liquid 和 test.js 没有关联。

Answer 1

我认为我连接这两个文件的路径是正确的

不是。

路径是您在 server.js 文件中指定的，而不是在您的计算机文件系统中指定的路径。

你说：

const HTML_DIR = path.join(__dirname, '/public/')
app.use(express.static(HTML_DIR))

...所以/public/ 中的所有内容都会映射到/ 下的 URL。

这意味着路径是：

src="/js/test.js"