【node.js】搭建可访问本地文件的服务器

2018-12-26  本文已影响0人  倾国倾城倾我心

A.手动搭建

一.首先了解文件目录


文件目录.jpg

二.新建assets文件夹,里面可放置各类静态资源(图片,网页,建模素材等),例子:index.html

<!DOCTYPE HTML>
<html>
<body>
<video width="320" height="240" controls="controls">
  <source src="movie.ogg" type="video/ogg">
  <source src="movie.mp4" type="video/mp4">
</video>

</body>
</html>

三.创建server.js

//加载模块
var http = require('http');
var fs = require('fs');
var url = require('url');
var path = require('path')
 


var server = http.createServer(function(req, res){
    
    //1.__dirname是全局变量,可以直接获取。表示当前执行脚本所在的目录。
    var staticPath = path.join(__dirname,'assets');    //path.join方法,拼接目录地址
    //2.staticPath拼接后的目录地址,为了跳到自己项目所在那个目录。
 
    //3.req.url请求的链接(这里输出的是/index.html)
    var pathObj = url.parse(req.url, true);         //url.parse方法,解析请求的url,解决链接"\"和"/"的差异问题。
    //4.解析后的req.url是个对象。
    
    //5.从解析后的对象中获取到pathname(这里pathObj.pathname是/index.html)
    var filePath = path.join(staticPath, pathObj.pathname);   //path.join方法,拼接完整项目目录地址。
    //6.fileContent拼接后的项目目录名字(这里是E:\subject\act\index.html)
            
    //fs.readFileSync方法,同步读取文件信息                                                          
    var fileContent = fs.readFileSync(filePath,'binary');     //读取拼接完整后的目录中的文件, 'binary'表示二进制方式读取   
    
    res.write(fileContent,'binary');
    res.end();  

     // 注意:因为是同步请求,这个地方会出现一个问题,当文件没获取完,我们就打开网址的话,服务器就会报错、崩溃
     // 推荐使用异步

       //异步读取文件数据
    fs.readFile(filePath,'binary',function(err,fileContent){
        if(err){    //如果报错,显示404,不会导致服务器崩溃了。
            res.writeHead(404,"Not Found");
            res.end('<h1>404 Not Found!</h1>')  
        }else{
            res.writeHead(200,'ok');
            res.write(fileContent,'binary');
            res.end();  
        }
    });

 
server.listen(8888);


console.log('服务器已打开, 可以运行 http://localhost:8888');

四.、在cmd终端或者GIT Bash运行server.js(命令行node server.js)


运行结果.jpg

五.在浏览器中输入http://localhost:8888/index.html 就可以运行了

访问结果.jpg

B.运用插件anywhere(推荐)

一.全局下载 anywhere(命令行:npm install anywhere -g)


下载anywhere.png

二.开启 anywhere(命令行:anywhere 8888)


开启 anywhere.png

三.访问 http://localhost:8888/

访问结果.png
上一篇 下一篇

猜你喜欢

热点阅读