Fatal编程技术网
  • javascript/
  • Javascript CSS没有'；在Express.js中添加子站点时无法正确发送

Javascript CSS没有'；在Express.js中添加子站点时无法正确发送

javascript html css node.js express

Javascript CSS没有'；在Express.js中添加子站点时无法正确发送,javascript,html,css,node.js,express,Javascript,Html,Css,Node.js,Express,请记住，我是快递等行业的新手 我有一个问题，CSS没有为我所谓的“子站点”加载 所谓子站点，我指的是至少有两个斜杠的地址，例如domain.com/site/subsite 我正在使用Express应用程序： const express=require（`express`）； 常量app=express（）； 常数端口=80； app.use（express.static（u dirname+`/public_html`））；//为网站提供CSS和JS服务 app.get（`/`，（req，re

请记住，我是快递等行业的新手

我有一个问题，CSS没有为我所谓的“子站点”加载

所谓子站点，我指的是至少有两个斜杠的地址，例如
domain.com/site/subsite

我正在使用Express应用程序：

const express=require（`express`）；
常量app=express（）；
常数端口=80；
app.use（express.static（u dirname+`/public_html`））；//为网站提供CSS和JS服务
app.get（`/`，（req，res）=>{//根域
res.sendFile（uu dirname+`/public_html/index.html`）
});
app.get（`/website`，（req，res）=>{//另一个，示例站点
res.sendFile（uu dirname+`/public_html/website1.html`）
});
app.get（`*`，（req，res）=>{//For 404
res.sendFile（uu dirname+`/public_html/404.html`，404）
});
app.listen（端口，（）=>console.log（`app侦听端口${port}！`））；
在这种情况下，CSS和JS工作得很好

但是，当我这样做时：

app.get（`/website/subsite`，（req，res）=>{//一个有两条斜线的网站
res.sendFile（uu dirname+`/public_html/website2.html`）
});
即使没有改变正常的代码，CSS或JS也不会随网站一起发送

我还应该提到，我的所有文件都在
public\u html
文件夹中：

ProjectDirectory:
  |> server.js
  |> package.json
  |> package-lock.json
  |> public_html/:
    |> index.html
    |> website1.html
    |> website2.html
    |> css/:
      |> index.css // Corresponding css file to index.html
      |> website1.css
      |> website2.css
    |> js/:
      |> ...
每个
html
页面都有一个
链接
标记：

当您键入/website/而不仅仅是/website时，也会发生这种情况

加载子网站时弹出的错误：

拒绝应用“URL”中的样式，因为其MIME类型（“text/html”）不是受支持的样式表MIME类型，并且启用了严格的MIME检查。 我认真地尝试了很多解决方案，但都找不到合适的

如果您不理解我的问题，请解释如何在ExpressJS中正确包含css和js文件

谢谢你的帮助

问题在于html文件中的这一行：
。由于/css/[…]，css文件请求相对于当前URL提交。将行更改为使用根域的绝对路径，如下所示（注意第一个斜杠前面缺少的点）

这也解决了
/website/
的问题，因为后面的斜杠将css的路径更改为
/website/css/website1.css，而express无法解决此问题

server.js


const express = require(`express`);
const app = express();
const port = 80;

app.use(express.static(__dirname + `/public_html`)); // For serving CSS & JS to websites

app.get(`/`, (req, res) => { // Root domain
    res.sendFile(__dirname + `/public_html/index.html`)
});

app.get(`/website`, (req, res) => { // Another, example site
    res.sendFile(__dirname + `/public_html/website1.html`)
});

app.get(`/website/subsite`, (req, res) => { // A website with 2 slashes in it
    res.sendFile(__dirname + `/public_html/website2.html`)
});

app.get(`*`, (req, res) => { // For 404
    res.sendFile(__dirname + `/public_html/404.html`, 404)
});

app.listen(port, () => console.log(`App listening on port ${port}!`));


示例性网站1.html


<!DOCTYPE html>

<head>
    <link rel="stylesheet" href="/css/website1.css">
</head>

</html>





感谢您的回复。你的解决方案产生了奇迹，我得到了我所需要的。我在这个问题上挣扎了这么长时间，所以我在这里发了一条评论说“谢谢”（通常我不会在任何论坛上这么做…）很高兴我能帮上忙：）