昨天买了一个服务器想着用来测试一些自己的项目，由于是第一次建站，在tomcat,linux,node.js间想了好久。最终因为node搭建比较方便没那么麻烦就决定用node.js来搭建网站项目。

搭建服务器也很简单首先下载安装node.js后，建立一个项目文件夹再在文件夹下建一个js文件可任意取名，这个文件对项目进行配置

全部配置如下：

"use strict";

//加载所需要的模块

var http = require('http');

var url = require('url');

var fs = require('fs');

var path = require('path');

var cp = require('child_process');

//创建服务

var httpServer = http.createServer(processRequest);

// 这是端口号

var port = 80;

//指定一个监听的接口

httpServer.listen(port, function() {

    console.log(`app is running at port:${port}`);

    console.log(`url: http://localhost:${port}`);

    cp.exec(`explorer http://localhost:${port}`, function () {

    });

});

//响应请求的函数

function processRequest (request, response) {

    //mime类型

    var mime = {

        "css": "text/css",

        "gif": "image/gif",

        "html": "text/html",

        "ico": "image/x-icon",

        "jpeg": "image/jpeg",

        "jpg": "image/jpeg",

        "js": "text/javascript",

        "json": "application/json",

        "pdf": "application/pdf",

        "png": "image/png",

        "svg": "image/svg+xml",

        "swf": "application/x-shockwave-flash",

        "tiff": "image/tiff",

        "txt": "text/plain",

        "wav": "audio/x-wav",

        "wma": "audio/x-ms-wma",

        "wmv": "video/x-ms-wmv",

        "xml": "text/xml"

    };

    //request里面切出标识符字符串

    var requestUrl = request.url;

    //url模块的parse方法 接受一个字符串，返回一个url对象,切出来路径

    var pathName = url.parse(requestUrl).pathname;

    //对路径解码，防止中文乱码

    var pathName = decodeURI(pathName);

    //解决301重定向问题，如果pathname没以/结尾，并且没有扩展名

    if (!pathName.endsWith('/') && path.extname(pathName) === '') {

        pathName += '/';

        var redirect = "http://" + request.headers.host + pathName;

        response.writeHead(301, {

            location: redirect

        });

        //response.end方法用来回应完成后关闭本次对话，也可以写入HTTP回应的具体内容。

        response.end();

    }

    //获取资源文件的绝对路径

  /*  var filePath = path.resolve(__dirname + pathName);*/

   //__dirname是访问项目静态资源的路径 我的项目静态文件都在public下所以我写public可根据自己项目路径来配置哦

  var filePath = path.resolve("public" + pathName);

    console.log(filePath);

    //获取对应文件的文档类型

    //我们通过path.extname来获取文件的后缀名。由于extname返回值包含”.”，所以通过slice方法来剔除掉”.”，

    //对于没有后缀名的文件，我们一律认为是unknown。

    var ext = path.extname(pathName);

    ext = ext ? ext.slice(1) : 'unknown';

    //未知的类型一律用"text/plain"类型

    var contentType = mime[ext] || "text/plain";

    fs.stat(filePath, (err, stats) => {

        if (err) {

            response.writeHead(404, { "content-type": "text/html" });

            response.end("<h1>404</h1>");

        }

        //没出错 并且文件存在

        if (!err && stats.isFile()) {

            readFile(filePath, contentType);

        }

        //如果路径是目录

        if (!err && stats.isDirectory()) {

            var html = "<head><meta charset = 'utf-8'/></head><body><ul>";

            //读取该路径下文件

            fs.readdir(filePath, (err, files) => {

                if (err) {

                    console.log("读取路径失败！");

                } else {

                    //做成一个链接表，方便用户访问

                    var flag = false;

                    for (var file of files) {

                        //如果在目录下找到index.html，直接读取这个文件

                        if (file === "index.html") {

                            readFile(filePath + (filePath[filePath.length-1]=='/' ? '' : '/') + 'index.html', "text/html");

                            flag = true;

                            break;

                        };

                        html += `<li><a href='${file}'>${file}</a></li>`;

                    }

                    if(!flag) {

                        html += '</ul></body>';

                        response.writeHead(200, { "content-type": "text/html" });

                        response.end(html);

                    }

                }

            });

        }

        //读取文件的函数

        function readFile(filePath, contentType){

            response.writeHead(200, { "content-type": contentType });

            //建立流对象，读文件

            var stream = fs.createReadStream(filePath);

            //错误处理

            stream.on('error', function() {

                response.writeHead(500, { "content-type": contentType });

                response.end("<h1>500 Server Error</h1>");

            });

            //读取文件

            stream.pipe(response);

        }

    });

}

这个配置可以对文件的类型，路径进行解析。

因为我的项目静态资源都在public文件下所以这里就写成public。大家可根据自己项目路径来配置

   //这里是是访问项目静态资源的路径 我的项目静态文件都在public下所以我写public可根据自己项目路径来配置

  var filePath = path.resolve("public" + pathName);

这里设置的是端口号，可以根据需要自己来更改

var port = 80;
//指定一个监听的接口

httpServer.listen(port, function() {

    console.log(`app is running at port:${port}`);

    console.log(`url: http://localhost:${port}`);

    cp.exec(`explorer http://localhost:${port}`, function () {

    });//这行代码作用是项目运行成功后自动打开项目网页不想要的话可以去掉

});

然后直接启动 node node.js项目就跑起来了，静态文件全部正确加载了，跳转链接也可以用。访问的话直接访问域名或Ip名就能直接打开项目页面了

用node.js搭建一个静态资源站 html,js,css正确加载 跳转也完美实现！的更多相关文章

  1. 搭建nginx静态资源站

    搭建静态资源站包括以下几部分: root指令与alias指令的区别 使用gzip压缩资源 如何访问指定目录下的全部资源文件 如何限制访问流量 如何自定义log日志 root指令与alias指令的区别 ...

  2. nginx系列3：搭建一个静态资源web服务器

    搭建静态资源web服务器 1,创建静态页面 在nginx的安装目录(/usr/local/nginx)下创建文件夹webapplications/helloworld,然后创建一个名为index.ht ...

  3. 从零开始,在windows上用nodejs搭建一个静态文件服务器

    从零开始,在windows上用nodejs搭建一个静态文件服务器 首先安装nodejs: 新建一个node文件夹 下载node.exe到该文件夹 下载npm然后解压到该文件夹 现在node文件夹是这样 ...

  4. 如何用webgl(three.js)搭建一个3D库房,3D仓库,3D码头,3D集装箱可视化孪生系统——第十五课

    序 又是快两个月没写随笔了,长时间不总结项目,不锻炼文笔,一开篇,多少都会有些生疏,不知道如何开篇,如何写下去.有点江郎才尽,黔驴技穷的感觉. 写随笔,通常三步走,第一步,搭建框架,先把你要写的内容框 ...

  5. 如何用webgl(three.js)搭建一个3D库房,3D仓库3D码头,3D集装箱,车辆定位,叉车定位可视化孪生系统——第十五课

    序 又是快两个月没写随笔了,长时间不总结项目,不锻炼文笔,一开篇,多少都会有些生疏,不知道如何开篇,如何写下去.有点江郎才尽,黔驴技穷的感觉. 写随笔,通常三步走,第一步,搭建框架,先把你要写的内容框 ...

  6. 利用git+hugo+markdown 搭建一个静态网站

    利用git+hugo+markdown 搭建一个静态网站 一直想要有一个自己的文档管理系统: 可以很方便书写,而且相应的文档很容易被分享 很方便的存储.管理.历史记录 比较方面的浏览和查询 第一点用M ...

  7. 使用webgl(three.js)搭建一个3D智慧园区、3D建筑，3D消防模拟，web版3D,bim管理系统——第四课

    序:这段时间忙于奔波,好久没有更新了,今天更新一下,继续上节课的完善讲解,算是对前段时间的一个总结吧.披星戴月的时光也算有点应用效果了. 对于webgl(three.js)性能这一块我在上节课< ...

  8. SpringMVC中css,js,图片等静态资源被拦截的解决办法

    一.静态资源的存放路径 css,js,图片等静态资源存放在项目的路径必须为 二.html.jsp导入静态资源文件 html.jsp页面中的导入静态资源文件: js: css: 图片: 二.web.xm ...

  9. 如何用webgl(three.js)搭建一个3D库房,3D密集架,3D档案室（升级版）

    很长一段时间没有写3D库房,3D密集架相关的效果文章了,刚好最近有相关项目落地,索性总结一下 与之前我写的3D库房密集架文章<如何用webgl(three.js)搭建一个3D库房,3D密集架,3 ...

随机推荐

  1. Fiddler--模拟弱网

    1.首先要勾选Rules--Performance--Simulate Modem Speeds 2.点击Customer Rules 3.然后找到 修改这个值就好. 备注:修改完保存后,要重新勾选第 ...

  2. Django基础之jQuery操作

    Django基础之jQuery操作 jquery之cookie操作 定义:让网站服务器把少量数据储存到客户端的硬盘或内存,从客户端的硬盘读取数据的一种技术: 下载与引入:jquery.cookie.j ...

  3. Java重要类之LinkedList

    一.ArrayList与LinkedList 基本概念:List是一个接口,Arraylist和LinkedList是它的两个实现类,只是实现的方式不一样.我在“单链表java实现”一文中已经对单链表 ...

  4. sql server row_number分页

    row_number分页 SELECT  TOP 10* --pageSize =10FROM (  SELECT    *, row_number () OVER (ORDER BY a.bsqID ...

  5. 入门&常量&变量

    位:二进制中,每个0或1就是一个位,叫做bit(比特) 字节:计算机最小是存储单元(byte或B) 8bit = 1B 常用cmd命令: 启动: Win+R,输入cmd回车切换盘符 盘符名称:进入文件 ...

  6. Caffe之prototxt

    1.可视化工具: http://ethereon.github.io/netscope/quickstart.html 2.常用网络模型caffe-model之.prototxt: https://g ...

  7. Hyperledger Fabric（3）通道与组织

    1,通道的结构 通道是Fabric中非常重要的概念(类似微信群?),它实质是由排序节点划分和管理的私有原子广播通道,目的是对通道的信息进行隔离,使得通道外的实体无法访问通道内的信息,从而实现交易的隐私 ...

  8. LeetCode_Bit Manipulation

    231. Power of Two Given an integer, write a function to determine if it is a power of two. class Sol ...

  9. Transformer, ELMo, GPT, 到Bert

    RNN:难以并行 CNN:filter只能考虑局部的信息,要叠多层 Self-attention:可以考虑全局的信息,并且可以并行 (Attention Is All You Need) 示意图:x1 ...

  10. 去掉或修改lightinthebox网址与标题中Wholesale关键词

    includes\languages\english.php define('SEO_COMMON_KEYWORDS','Wholesale'); 将里面的Wholesale换成你想显示的词即可.