我试图找出如何加载和呈现一个基本的HTML文件,这样我就不必写代码:
response.write('...<p>blahblahblah</p>...');
我试图找出如何加载和呈现一个基本的HTML文件,这样我就不必写代码:
response.write('...<p>blahblahblah</p>...');
我只是发现了一种使用fs库的方法。但我不确定它是不是最干净的。
var http = require('http'),
fs = require('fs');
fs.readFile('./index.html', function (err, html) {
if (err) {
throw err;
}
http.createServer(function(request, response) {
response.writeHeader(200, {"Content-Type": "text/html"});
response.write(html);
response.end();
}).listen(8000);
});
基本概念就是读取原始文件并转储内容。不过,仍然有更清洁的选择!
您可以使用fs对象手动回显文件,但我建议使用ExpressJS框架使您的工作更容易。
...但如果你坚持用艰难的方式来做:
var http = require('http');
var fs = require('fs');
http.createServer(function(req, res){
fs.readFile('test.html',function (err, data){
res.writeHead(200, {'Content-Type': 'text/html','Content-Length':data.length});
res.write(data);
res.end();
});
}).listen(8000);
我知道这是一个老问题,但由于没有人提到过,我认为有必要补充一下:
如果你真的想要提供静态内容(比如一个“关于”页面,图像,css等),你可以使用一个静态内容服务模块,例如node-static。(还有其他可能更好或更差的方法——试试search.npmjs.org。)通过一点点预处理,您就可以从静态页面中过滤动态页面,并将它们发送到正确的请求处理程序。
这可能会更好一些,因为您将流式文件而不是像fs.readFile那样将其全部加载到内存中。
var http = require('http');
var fs = require('fs');
var path = require('path');
var ext = /[\w\d_-]+\.[\w\d]+$/;
http.createServer(function(req, res){
if (req.url === '/') {
res.writeHead(200, {'Content-Type': 'text/html'});
fs.createReadStream('index.html').pipe(res);
} else if (ext.test(req.url)) {
fs.exists(path.join(__dirname, req.url), function (exists) {
if (exists) {
res.writeHead(200, {'Content-Type': 'text/html'});
fs.createReadStream('index.html').pipe(res);
} else {
res.writeHead(404, {'Content-Type': 'text/html'});
fs.createReadStream('404.html').pipe(res);
});
} else {
// add a RESTful service
}
}).listen(8000);
我们可以用连接框架加载HTML文档。 我已经把我的html文档和相关图像放在我的项目的公共文件夹中,下面的代码和节点模块。
//server.js
var http=require('http');
var connect=require('connect');
var app = connect()
.use(connect.logger('dev'))
.use(connect.static('public'))
.use(function(req, res){
res.end('hello world\n');
})
http.createServer(app).listen(3000);
我已经尝试了fs的readFile()方法,但它无法加载图像,这就是为什么我使用了连接框架。
我知道这是一个老问题——如果你不喜欢使用connect或express,这里有一个简单的文件服务器实用工具;而是HTTP模块。
var fileServer = require('./fileServer');
var http = require('http');
http.createServer(function(req, res) {
var file = __dirname + req.url;
if(req.url === '/') {
// serve index.html on root
file = __dirname + 'index.html'
}
// serve all other files echoed by index.html e.g. style.css
// callback is optional
fileServer(file, req, res, callback);
})
module.exports = function(file, req, res, callback) {
var fs = require('fs')
, ext = require('path').extname(file)
, type = ''
, fileExtensions = {
'html':'text/html',
'css':'text/css',
'js':'text/javascript',
'json':'application/json',
'png':'image/png',
'jpg':'image/jpg',
'wav':'audio/wav'
}
console.log('req '+req.url)
for(var i in fileExtensions) {
if(ext === i) {
type = fileExtensions[i]
break
}
}
fs.exists(file, function(exists) {
if(exists) {
res.writeHead(200, { 'Content-Type': type })
fs.createReadStream(file).pipe(res)
console.log('served '+req.url)
if(callback !== undefined) callback()
} else {
console.log(file,'file dne')
}
})
}
这是一个相当老的问题……但如果你在这里的用例是简单地向浏览器发送一个特定的HTML页面,我会使用像这样简单的东西:
var http = require('http')
, fs = require('fs');
var server = http.createServer(function(req, res){
var stream = fs.createReadStream('test.html');
stream.pipe(res);
});
server.listen(7000);
使用app.get获取HTML文件。很简单!
const express = require('express');
const app = express();
app.get('/', function(request, response){
response.sendFile('absolutePathToYour/htmlPage.html');
});
就这么简单。 为此使用快捷模块。 安装express: npm Install -g express
这是对默罕默德·奈斯温的回答的更新
在快车4号。x, sendfile已弃用,必须使用sendfile函数。区别在于sendfile采用相对路径,而sendfile采用绝对路径。因此,__dirname被用来避免硬编码路径。
var express = require('express');
var app = express();
var path = require("path");
app.get('/', function (req, res) {
res.sendFile(path.join(__dirname + '/folder_name/filename.html'));
});
用ejs代替jade
npm 安装 EJS
app.js
app.engine('html', require('ejs').renderFile);
app.set('view engine', 'html');
/线路/ index.js
exports.index = function(req, res){
res.render('index', { title: 'ejs' });};
我学到的最好的方法是在html文件中使用express,因为express有很多优势。如果你想的话,你也可以把它扩展到Heroku平台上。
var express = require("express");
var app = express();
var path = require("path");
app.get('/',function(req,res){
res.sendFile(path.join(__dirname+'/index.html'));
});
app.listen(3000);
console.log("Running at Port 3000");
干净而且最好!!
简单的方法是,把你所有的文件,包括index.html或所有资源,如CSS, JS等,在一个文件夹公共或你可以命名它任何你想要的,现在你可以使用express JS,只是告诉app使用_dirname as:
在你的server.js中使用express添加这些
var express = require('express');
var app = express();
app.use(express.static(__dirname + '/public'));
如果你想有一个单独的目录,在公共目录下添加新的目录,并使用“/public/YourDirName”路径
我们到底在这里做什么? 我们正在创建名为app的快速实例,我们正在为访问所有资源的公共目录提供地址。 希望这能有所帮助!
使用快递模块怎么样?
var app = require('express')();
app.get('/',function(request,response){
response.sendFile(__dirname+'/XXX.html');
});
app.listen('8000');
然后,可以使用浏览器获取/localhost:8000
我认为这将是一个更好的选择,因为它显示了运行服务器的URL:
var http = require('http'),
fs = require('fs');
const hostname = '<your_machine_IP>';
const port = 3000;
const html=fs.readFile('./index.html', function (err, html) {
if (err) {
throw err;
}
http.createServer(function(request, response) {
response.writeHeader(200, {"Content-Type": "text/html"});
response.write(html);
response.end();
}).listen(port, hostname, () => {
console.log(`Server running at http://${hostname}:${port}/`);
})
});
https://gist.github.com/xgqfrms-GitHub/7697d5975bdffe8d474ac19ef906e906
这是我简单的演示代码主机静态HTML文件使用Express服务器!
希望对你有所帮助!
// simple express server for HTML pages! // ES6 style const express = require('express'); const fs = require('fs'); const hostname = '127.0.0.1'; const port = 3000; const app = express(); let cache = [];// Array is OK! cache[0] = fs.readFileSync( __dirname + '/index.html'); cache[1] = fs.readFileSync( __dirname + '/views/testview.html'); app.get('/', (req, res) => { res.setHeader('Content-Type', 'text/html'); res.send( cache[0] ); }); app.get('/test', (req, res) => { res.setHeader('Content-Type', 'text/html'); res.send( cache[1] ); }); app.listen(port, () => { console.log(` Server is running at http://${hostname}:${port}/ Server hostname ${hostname} is listening on port ${port}! `); });
采用管道法是一种更加灵活、简单的方法。
var fs = require('fs');
var http = require('http');
http.createServer(function(request, response) {
response.writeHead(200, {'Content-Type': 'text/html'});
var file = fs.createReadStream('index.html');
file.pipe(response);
}).listen(8080);
console.log('listening on port 8080...');
var http = require('http');
var fs = require('fs');
http.createServer(function(request, response) {
response.writeHeader(200, {"Content-Type": "text/html"});
var readSream = fs.createReadStream('index.html','utf8')
readSream.pipe(response);
}).listen(3000);
console.log("server is running on port number ");
你也可以使用这个片段:
var app = require("express");
app.get('/', function(req,res){
res.sendFile(__dirname+'./dir/yourfile.html')
});
app.listen(3000);
如果你使用管道,它就非常简单。下面是server.js的代码片段。
Var HTTP = require(' HTTP '); Var fs = require('fs'); 函数onRequest(req, res){ 日志("用户提出请求。“+ req.url); res.writeHead(200, {'Content-Type': 'text/html'}); var readStream = fs. varcreatererestream (__dirname + '/index.html','utf8'); /*包含你的HTML文件和目录名,而不是<<__dirname + '/index.html'>>*/ readStream.pipe (res); } http.createServer (onRequest) .listen (7000); console.log('Web服务器正在运行…');
增加另一个选项-基于例外的答案。
打字稿:
import { Injectable } from '@nestjs/common';
import { parse } from 'node-html-parser';
import * as fs from 'fs';
import * as path from 'path'
@Injectable()
export class HtmlParserService {
getDocument(id: string): string {
const htmlRAW = fs.readFileSync(
path.join(__dirname, "../assets/files/some_file.html"),
"utf8"
);
const parsedHtml = parse(htmlRAW);
const className = '.'+id;
//Debug
//console.log(parsedHtml.querySelectorAll(className));
return parsedHtml.querySelectorAll(className).toString();
}
}
(*)上面的例子是使用nestjs和node-html-parser。
你可以直接在end方法中加载HTML
response.end('...<p>blahblahblah</p>...')
这和
response.write('...<p>blahblahblah</p>...')
response.end()
试试这个:
var http = require('http');
var fs = require('fs');
var PORT = 8080;
http.createServer((req, res) => {
fs.readFile('./' + req.url, (err, data) => {
if (!err) {
var dotoffset = req.url.lastIndexOf('.');
var mimetype = dotoffset == -1 ? 'text/plaint' : {
'.html': 'text/html',
'.css': 'text/css',
'.js': 'text/javascript',
'.jpg': 'image/jpeg',
'.png': 'image/png',
'.ico': 'image/x-icon',
'.gif': 'image/gif'
}[ req.url.substr(dotoffset) ];
res.setHeader('Content-Type', mimetype);
res.end(data);
console.log(req.url, mimetype);
} else {
console.log('File not fount: ' + req.url);
res.writeHead(404, "Not Found");
res.end();
}
});
}).listen(PORT);
有了这个,你可以包括js, css源代码时链接他们,你可以加载图标,imgs, gif。如果你愿意,你可以添加更多。
var http = require('http');
var fs = require('fs'); //required to readfile
http.createServer(function(req, response){
fs.readFile('index.html',function (err, data){
response.writeHead(200);
response.write(data);
response.end();
});
}).listen(8000);
// #just use express lol
Index.html是HTML文件的名称
您可以使用Express使用Node加载和呈现基本的HTML文件。这大约需要10分钟才能开始。它被绑定到http.createServer(),所以你仍然在Node的土地上,可以轻松地删除它。
// app.js
const path = require('path');
const express = require('express');
const app = express();
app.use(express.static(path.join(__dirname, 'public')));
app.use('/', express.static('index.html'));
app.use('/test', express.static('test.html'));
module.exports = app;
// server.js
const http = require('http');
const PORT = process.env.PORT || 3000;
const appServer = require('./app');
const httpServer = http.createServer(appServer);
httpServer.listen(PORT);
console.log(`Listening on port ${PORT}...`);