nodejs写服务器怎么样
2018-01-08 · 百度知道合伙人官方认证企业
育知同创教育
目前最主流的三个Web服务器是Apache、Nginx、IIS。
Node.js 提供了 http 模块，http 模块主要用于搭建 HTTP 服务端和客户端，使用 HTTP 服务器或客户端功能必须调用 http 模块，代码如下：
[javascript] view plain copy
var http = require('http');
var http=require('http');
var fs = require('fs');
var url = require('url');
//创建服务器
http.createServer(function(request,response) {
//解析请求，包括文件名
var pathname= url.parse(request.url).pathname;
//输出请求的文件名
console.log("Request for "+ pathname + " received.");
//从文件系统中都去请求的文件内容
fs.readFile(pathname.substr(1),function(err, data) {
if(err) {
console.log(err);
//HTTP 状态码 404 ： NOT FOUND
//Content Type:text/plain
response.writeHead(404,{'Content-Type': 'text/html'});
}
else {
//HTTP 状态码 200 ： OK
//Content Type:text/plain
response.writeHead(200,{'Content-Type': 'text/html'});
//写会相应内容
response.write(data.toString());
}
//发送响应数据
response.end();
});
}).listen(8081);
console.log('Server running at http://127.0.0.1:8081/');
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>index</title>
</head>
<body>
这是一个用于进行nodejs服务器测试的html文件，我们能够通过在浏览器上面输入
http://127.0.0.1:8081/WebServer/index.html进行访问
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>index</title>
<style>
body {
border: 1px solid red;
}
div {
border-radius: 10px;
width: 500px;
height: 200px;
border: 2px solid green;
}
</style>
</head>
<body>
这是一个用于进行nodejs服务器测试的html文件，我们能够通过在浏览器上面输入
http://127.0.0.1:8081/WebServer/index.html进行访问
<div>1</div>
<div>2</div>
</body>
</html>
<link rel="stylesheet" href="http://127.0.0.1:8081/WebServer/index.css">
var http=require('http');
var fs = require('fs');
var url = require('url');
//创建服务器
http.createServer(function(request,response) {
//解析请求，包括文件名
var pathname= url.parse(request.url).pathname;
//输出请求的文件名
console.log("Request for "+ pathname + " received.");
//当请求static文件夹时，设置文件返回类型是text/css
var firstDir = pathname && pathname.split('/')[2];
var ContentType = null;
if (firstDir && firstDir === 'static') {
ContentType = {'Content-Type': 'text/css'};
} else {
ContentType = {'Content-Type': 'text/html'}
}
//从文件系统中去请求的文件内容
fs.readFile(pathname.substr(1),function(err, data) {
if(err) {
console.log(err);
//HTTP 状态码 404 ： NOT FOUND
//Content Type:text/plain
response.writeHead(404, {'Content-Type': 'text/html'});
}
else {
//HTTP 状态码 200 ： OK
//Content Type:text/plain
response.writeHead(200, ContentType);
//写会回相应内容
response.write(data.toString());
}
//发送响应数据
response.end();
});
}).listen(8081);
console.log('Server running at http://127.0.0.1:8081/');
body {
border: 1px solid blue;
}
div {
border-radius: 10px;
width: 400px;
height: 200px;
border: 2px solid yellow;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>index</title>
<link rel="stylesheet" href="http://127.0.0.1:8081/WebServer/static/index.css">
</head>
<body>
这是一个用于进行nodejs服务器测试的html文件，我们能够通过在浏览器上面输入
http://127.0.0.1:8081/WebServer/index.html进行访问
<div>1</div>
<div>2</div>
</body>
</html>
在通常的服务器中，数据流通的方式是客户先通过浏览器进行发送请求，服务器在项目中进行查找，然后进客户所需要的页面进行返回，在查找的过程中可能存在两种情况，就是存在和不存在，当然，我们会做出判断，下面就是简单的服务器实现过程：
1、编写服务器代码server.js
[javascript] view plain copy
通过上面代码，我们就能够实现服务器对于文件的查找，下面，我们就进行创建一个html文件，然后通过浏览器进行访问
2、编写html文件（index.html），用于浏览器进行请求
[html] view plain copy
创建完之后，我们进行测试，现在我的目录结构是这样的：
3、进行测试
(1) 首先我们启动服务器，使用命令node WebServer/server.js
(2) 在浏览器进行访问，在url栏中输入http://127.0.0.1:8081/WebServer/index.html
其显示效果如下所示：
后台效果如下所示：
当然，我们也能够通过访问通过http://127.0.0.1:8081/LoveYou.html访问server.js文件夹外边的文件,进行到这里，我们就可以得到文件返回给前端，但是有些同学可能会问，样式该怎么做？？如下面代码，我们进行了样式的定义，修改了两个div的大小,并且给div设置边框
[html] view plain copy
效果如下所示，
有了这些，我们还会问，你这样直接将样式写在html中，我可不干，我要把样式写道另外单独一个文件中，然后通过引用的方式引入，于是就会有人使用下面代码：
[html] view plain copy
然而，这段代码并不会起作用，因为传递给前端的方式Content-Type是有问题的，需要我们的服务器进行下一步操作，也就是处理静态文件。既然传给前端时需要告诉type是css，那么我们就进行区分对待，如下面代码，我们对server.js进行修改如下：
[html] view plain copy
接着，我们需要在项目中创建一个static文件夹，如下面所示结构：
在static文件夹中创建index.css文件，代码内容如下所示：
[html] view plain copy
也就是修改body边框为蓝色，div边框为黄色，同时我们需要更新index.html中文件内容如下所示：
[html] view plain copy
也就是通过引入的方式将样式引入到html文件中，然后在浏览器查看内容，效果如下所示：
很明显，我们的样式已经通过引入的方式引进到html页面中了，同样的原理，我们能够进行将js也通过引入的方式进行使用，在这里我就不一一贴出代码了，看看效果如下所示：
|
广告 您可能关注的内容 |
