node部署静态页面;node上线静态页面
node部署静态页面上线
静态页面上线可以采用 nginx, tomcat或者node ,我们这里介绍下node部署静态页面
这里采用最简单的上线方式,我们就不用node + express + ejs ,直接采用node + html
1.首先确定好安装了 node 如果没有安装,请下载 https://nodejs.org/zh-cn/ 建议下载LTS版本
2.新建一个目录,比如 test 文件夹,然后在当前文件夹下进入命令行窗口 npm init 初始化npm,此处一路回车,这时会生成 package.json的一个文件
3.然后我们需要在 test 的根目录下创建一个 server.js
- server.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);
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 Not Found</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);
}
});
}
4.这是运行node server.js 便启动了服务,我们可以通过本地 localhost 进行访问,也可上传到linux,通过自己域名访问
node部署静态页面;node上线静态页面的更多相关文章
- 【Node.js】利用node.js搭建服务器并访问静态网页
node.js是一门服务端的语言,下面讲讲如何利用node.js提供给我们的api来搭建服务器,并且访问静态网页 项目结构如下 ------------------------------------ ...
- nodejs之获取客户端真实的ip地址+动态页面中引用静态路径下的文件及图片等内容
1.nodejs获取客户端真实的IP地址: 在一般的管理网站中,尝尝会需要将用户的一些操作记录下来,并记住是哪个用户进行操作的,这时需要用户的ip地址,但是往往当这些应用部署在服务器上后,都使用了ng ...
- [转]把动态页面.aspx 生成静态页面.html
本文转自:http://blog.csdn.net/csb5201314/article/details/5391688 如果要把主页Index.aspx 生成静态页面 Index.html后输出会提 ...
- 页面静态化3 --- 使用PHP页面缓存机制来完成页面静态化(下)操作一个案例(新闻管理系统)
案例需求: 使用PHP缓存机制完成新闻管理系统的页面静态化数据库表 ecs_article (新闻表)因为新闻这些信息,并不是对实时性要求高,本身这个新闻比较稳定,内容也比较固定,所以我们考虑: 当第 ...
- 转:php页面静态化之真静态
之前的缓存和现在所说的页面静态化都是为网站提速的,如果是访问量小的小型网站可能不需要但是如果网站规模或访问量很大,那么页面静态化和缓存就会体现出各自的价值了下面先来了解下页面静态化的分类 页面静态化的 ...
- Web项目中用模板Jsp页面引入所有静态样式脚本文件(js,css等)
这样的好处是不需要再每个页面中都添加太多的外链接(不会减少请求数量),但对开发会更快捷,如果更改这些文件的位置或名称,只需要更改模板文件,不需要一个一个页面复制粘贴:同时可以为不同jsp页面组创建不同 ...
- PHP 404页面/如何设置404页面/URL静态化/URL伪静态化
php中如何设置404页面及其他错误页面 首先在项目根目录下新建文件,文件名为" .htaccess " 在该文件中写入一下配置项: ErrorDocument 404 /404. ...
- thinkphp3.2中开启静态缓存后对404页面的处理方法
静态缓存很实用但是有时有些不需要静态缓存,如404页面,第一次访问返回404页面并缓存,第二次换回的状态就是200,属于正常访问,虽然人眼可以看出是404页面,但是搜索引擎不会的,而是把这个页面当成正 ...
- dedecms--将静态页面转化为动态页面
最近在用dedecms二次开发项目,需要对文章内容页设置权限,会员未登录不允许查看,这个需要先在后台设置将静态页面转化为动态页面 具体步骤: 1:将主页设置为动态浏览 2:进入后台→系统→SQL命令行 ...
随机推荐
- Java SSM框架之MyBatis3(四)MyBatis之一对一、一对多、多对多
项目搭建Springboot 1.5 pom.xml <?xml version="1.0" encoding="UTF-8"?> <pro ...
- Red Pen - 快速高效的获取设计项目的反馈
Red Pen 让设计师能够快速,高效的从你的同事和客户获取反馈.只需要简单的拖放图像到 Red Pen 主页,然后把生成的链接分享给你的同事或者客户.他们打开链接就能看到设计稿,并给予实时的反馈,所 ...
- .gitignore 失效问题解决
对于Git,已经跟踪的文件,再加入到.gitignore中,会使忽略失效.使用下面3个命令使它重新生效 git rm -r --cached . git add . git commit -m &qu ...
- Verilog笔记.三段式状态机
之前都是用的一段式状态机,逻辑与输出混在一起,复杂点的就比较吃力了. 所以就开始着手三段式状态机. 组合逻辑与时序逻辑分开,这样就能简单许多了. 但是两者在思考方式上也有着很大的区别. 三段式,分作: ...
- HTTP协议之响应头Date与Age
HTTP没有为用户提供一种手段来区分响应是缓存命中的,还是访问原始服务器得到的.客户端有一种方法能判断响应是否来自缓存,就是使用Date首部.将响应中Date首部的值与当前时间进行比较,如果响应中的日 ...
- 01 uni-app框架学习:项目创建及底部导航栏tabBar配置
1.创建一个项目类型选择uniapp 2. pages里新建3个页面如下 3.在pages.json中配置底部导航tabBar 效果展示:
- 20165230 2017-2018-2《Java程序设计》课程总结
20165230 2017-2018-2<Java程序设计>课程总结 一.作业链接汇总 每周作业链接 预备作业1:我期望的师生关系 预备作业2:做中学learning by doing个人 ...
- linux服务器如何添加sudo用户
1. 编辑 vi /etc/ssh/sshd_config 文件,修改默认端口:默认Port为22,并且已经注释掉了,修改是把注释去掉,并修改成其它的端口. 原来用默认端口:22修改为:8975 (这 ...
- Python学习三|列表、字典、元组、集合的特点以及类的一些定义
此表借鉴于他人 定义 使用方法 列表 可以包含不同类型的对象,可以增减元素,可以跟其他的列表结合或者把一个列表拆分,用[]来定义的 eg:aList=[123,'abc',4.56,['inner', ...
- [Android]使用 Eclipse 给 APK 签名时遇到的两个问题及解决办法
问题 今天用 APK 反编译工具看了一下自己项目生成的 APK 文件,发现代码并没有混淆,于是设置了用 ProGuard 混淆代码,可是混淆是必须在非 Debug 模式才会生效的,即使你是以 Rele ...