Express-js无法获取我的静态文件,为什么？

Question

我已将代码缩减为我可以制作的最简单的express-js应用程序:

var express = require("express"),
    app = express.createServer();
app.use(express.static(__dirname + '/styles'));
app.listen(3001);

我的目录看起来像这样:

static_file.js
/styles
  default.css

然而,当我访问时,http://localhost:3001/styles/default.css我收到以下错误:

Cannot GET / styles /
default.css

我正在使用express 2.3.3和node 0.4.7.我究竟做错了什么？

Answer 1

试试http://localhost:3001/default.css.

要/styles在您的请求网址中使用,请使用:

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

看看这个页面上的例子:

//Serve static content for the app from the "public" directory in the application directory.

    // GET /style.css etc
    app.use(express.static(__dirname + '/public'));

// Mount the middleware at "/static" to serve static content only when their request path is prefixed with "/static".

    // GET /static/style.css etc.
    app.use('/static', express.static(__dirname + '/public'));

Answer 2

我也有同样的问题.我用以下代码解决了这个问题:

app.use('/img',express.static(path.join(__dirname, 'public/images')));
app.use('/js',express.static(path.join(__dirname, 'public/javascripts')));
app.use('/css',express.static(path.join(__dirname, 'public/stylesheets')));

静态请求示例:

http://pruebaexpress.lite.c9.io/js/socket.io.js

我需要一个更简单的解决方案.它存在吗？

Answer 3

default.css 应该在 http://localhost:3001/default.css

在styles中app.use(express.static(__dirname + '/styles'));只是告诉快递在寻找styles目录静态文件服务.它(不容易)然后形成它可用的路径的一部分.

Answer 4

这项工作对我来说:

app.use('*/css',express.static('public/css'));
app.use('*/js',express.static('public/js'));
app.use('*/images',express.static('public/images'));

Answer 5

我在我的应用程序中使用 Bootstrap CSS、JS 和字体。我在asset应用程序的根目录中创建了一个文件夹，并将所有这些文件夹放在其中。然后在服务器文件中添加以下行：

app.use("/asset",express.static("asset"));

这一行使我能够asset从/asset路径前缀加载目录中的文件，例如：http://localhost:3000/asset/css/bootstrap.min.css.

现在在视图中，我可以简单地包含 CSS 和 JS，如下所示：

<link href="/asset/css/bootstrap.min.css" rel="stylesheet">

Answer 6

在你的server.js中:

var express   =     require("express");
var app       =     express();
app.use(express.static(__dirname + '/public'));

您已单独声明express和app,创建名为'public'的文件夹或您喜欢的文件夹,但您可以访问这些文件夹.在模板src中,您已将/ public(或命令文件夹的名称)的相对路径放入静态文件中.小心路线上的酒吧.

Answer 7

对我有用的是：

而不是写 app.use(express.static(__dirname + 'public/images'));在你的 app.js

简单地写 app.use(express.static('public/images'));

即删除路径中的根目录名称。然后你可以在其他js文件中有效地使用静态路径，例如：

<img src="/images/misc/background.jpg">

希望这可以帮助 ：）

Answer 8

提供静态文件（css、images、js 文件）只需两个步骤：

1. 将 css 文件目录传递给内置中间件 express.static

   var express = require('express');
   var app = express();
   /*public is folder in my project directory contains three folders
   css,image,js
   */
   //css  =>folder contains css file
   //image=>folder contains images
   //js   =>folder contains javascript files
   app.use(express.static( 'public/css'));
   

2. 要访问 css 文件或图像，只需输入 url http://localhost:port/filename.css例如：http://localhost:8081/bootstrap.css

注意：要将 css 文件链接到 html 只需键入<link href="file_name.css" rel="stylesheet">

如果我写这段代码

var express = require('express');
var app = express();
app.use('/css',express.static( 'public/css'));

要访问静态文件，只需输入 url:localhost:port/css/filename.css 例如： http://localhost:8081/css/bootstrap.css

注意将 css 文件与 html 链接只需添加以下行

<link href="css/file_name.css" rel="stylesheet">    

Answer 9

这个对我有用

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

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

app.use('/shopping-cart/javascripts',express.static(path.join(__dirname, 'public/javascripts')));

app.use('/shopping-cart/stylesheets',express.static(path.join(__dirname, 'public/stylesheets')));

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

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