Question

我正在进行一些前端实验，我希望有一个非常基本的网络服务器来快速启动项目并提供文件（一个index.html文件+一些css / js / img文件）。所以我正在尝试使用node.js和express，我已经玩了两次，但是这次我不想使用渲染引擎，因为我只有一个静态文件，这个代码我得到了html文件但不是资产（错误404）：

var express = require('express'),
    app = express.createServer();

app.configure(function(){
  app.use(express.static(__dirname + '/static'));
});

app.get('/', function(req, res){
  res.sendFile(__dirname + '/index.html');
});

app.listen(3000);

是否有一种简单的方法（如果可能，在一个文件中）或Express需要使用视图和渲染引擎？

Answer 1

我遇到过这个，因为我有类似的情况。我不需要或不喜欢模板。您放在express下的public /目录中的任何内容都将作为静态内容提供（就像Apache一样）。所以我将index.html放在那里并使用sendfile来处理没有文件的请求（例如：GET http://mysite/）：

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

Answer 2

以下代码为我工作。

var express = require('express'),
  app = express(),
  http = require('http'),
  httpServer = http.Server(app);

app.use(express.static(__dirname + '/folder_containing_assets_OR_scripts'));

app.get('/', function(req, res) {
  res.sendfile(__dirname + '/index.html');
});
app.listen(3000);

这会加载包含资产的页面

Answer 3

你可以使用 ~~a solution like this in node.js~~ （链接不再有用），就像我以前写过博客一样。

总结一下，安装与npm install connect联系。

然后将此代码粘贴到名为server.js的文件中，该文件与HTML / CSS / JS文件位于同一文件夹中。

var util = require('util'),
    connect = require('connect'),
    port = 1337;

connect.createServer(connect.static(__dirname)).listen(port);
util.puts('Listening on ' + port + '...');
util.puts('Press Ctrl + C to stop.');

现在导航到终端中的该文件夹并运行node server.js，这将为您提供http://localhost:1337

的临时网络服务器

Answer 4

感谢原始海报，但他们的答案现在已经过时了。这非常非常简单。基本设置如下：

const express = require("express");
const app = express();
const dir = `${__dirname}/public/`;

app.get("/", (req, res) => {
  res.sendFile(dir + "index.html");
});

app.get("/contact", (req, res) => {
  res.sendFile(dir + "contact.html");
});

// Serve a 404 page on all other accessed routes, or redirect to specific page
app.get("*", (req, res) => {
  //   res.sendFile(dir + "404.html");
  //   res.redirect("/");
});

app.listen(3000);

上面的示例是如果您要提供单个HTML文件。如果您只提供一个页面的JS应用程序，则可以使用。

const express = require("express");
const app = express();
const dir = `${__dirname}/public/`;

app.get("*", (req, res) => {
  res.sendFile(dir + "index.html");
});

app.listen(3000);

如果您需要从文件夹中提供其他静态资产，则可以在开始定义路由之前添加如下内容：

app.use(express.static('public'))

比方说，您在js这样的公共目录中有一个public/js文件夹。您可以使用相对路径将任何这些文件包含在html文件中。例如，假设/contact需要一个contact.js文件。在您的contact.html文件中，您可以包括以下脚本：

<script src="./js/contact.js"></script>

以该示例为基础，您可以对CSS，图像等进行相同的操作。

<img src="./images/rofl-waffle.png" />
<link rel="stylesheet" href="./css/o-rly-owl.css" />

希望这对以后的所有人都有帮助。

带有node.js的基本web服务器，用于提供服务html文件和资产

4 个答案: