使用Node.js将HTML文件发送给客户端

Question

使用Node.js将HTML文件发送给客户端

54

我使用这个函数将HTML文件发送给客户端，但在客户端上我什么也没有收到（空白页），也没有出现错误。是我做错了什么吗？请帮忙解决？

var express = require('express'); 
var fs = require('fs');
var app = express();
app.set('view engine', 'jade');
app.engine('jade', require('jade').__express); 
    app.get('/test', function(req, res) {
            fs.readFile(__dirname + '/views/test.html', 'utf8', function(err, text){
                res.send(text);
            });
var port = process.env.PORT || 80;
var server = app.listen(port);
console.log('Express app started on port ' + port);

我的test.html文件

<!DOCTYPE html>
<html>
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
      <style something here </style>
      <title>Test</title>
      <script src="..."></script>
   </head>
<body>
    <div> Somthing here </div>

    <script type="text/javascript">
        //something here
    </script>
</body></html>

- user3044147

你的代码就这些吗？ - mihai

@mihai 我刚刚编辑了。 - user3044147

7个回答

6

您可以更轻松地在express中呈现页面


 var app   = require('express')();    
    app.set('views', path.join(__dirname, 'views'));
    app.set('view engine', 'jade');
 
    app.get('/signup',function(req,res){      
    res.sendFile(path.join(__dirname,'/signup.html'));
    });

所以，如果您请求类似于http://127.0.0.1:8080/signup的内容，它将在视图文件夹下呈现signup.html页面。

- Adiii

1

顺便提一下 - 你缺少了 path.join 和字符串拼接。你可能想要的是 path.join(__dirname, 'signup.html')。如果你只是用 + 运算符连接这两个字符串，那么调用 path.join 就没有意义了，因为它只会在单个参数上执行。 - Mureinik

4

多年以后，我想通过在Express.js中使用视图引擎来添加另一种方法。

var fs = require('fs');

app.get('/test', function(req, res, next) {
    var html = fs.readFileSync('./html/test.html', 'utf8')
    res.render('test', { html: html })
    // or res.send(html)
})

那么，如果你选择上面代码中的res.render方法，在views/test中执行以下操作：

<%- locals.html %>

这样做可以避免破坏您的视图引擎设置。

就是这样。

- efkan

1

"

\"../\"被视为恶意操作，会导致ForbiddenError: Forbidden at SendStream.error...异常。

正确的方法是使用path模块：

"

var path = require('path');
res.sendFile(path.resolve('views/auth/success.html'));

- M22

1

var app = express();

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

在 IT 技术中，__dirname 表示当前文件所在的路径。因此，在使用 res.sendFile() 方法时，我们首先通过 __dirname 找到当前位置，然后再加上需要显示在主页上的特定文件的路径，例如："views/test.html"。

- Gaurav Tripathi

0

按照这个简单的步骤发送 HTML 文件 -> res.sendfile("views/home.html"); // 不要在 sendFile 中使用大写字母 F，必须使用小写字母 f 例如：sendfile();

- Ontor Hazary

use `` for code examples - Fiodorov Andrei

0

In Controllers -> use this in get all routes in index.js

To render html
const router = require('express').Router()
const path = require('path')`enter code here`


router.get('/',(req,res)=>{
  res.sendFile(path.join(__dirname,'/../views/test.html'))
})








To render EJS:
In server.js
const express = require('express');
const bodyParser = require('body-parser');

app.use(bodyParser.urlencoded({ extended: true }));
app.use(express.static('public'))
app.use(bodyParser.json()) 
app.set('view engine','ejs')


In Controller- index.js
const express = require('express')
const app = express()
const router = require('express').Router();
const path = require('path')


router.get('/',(req,res)=>{
res.render('test')
})

- Divya Balaji

请不要将整个答案格式化为代码块。 - DaveL17

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Tim Brown · Accepted Answer

试着用以下方式运行您的代码：

var app = express();
app.get('/test', function(req, res) {
    res.sendFile('views/test.html', {root: __dirname })
});

使用res.sendFile代替手动读取文件，这样express可以为您设置正确的content-type。
不需要app.engine这一行，因为它在express内部处理。