5分钟学会如何访问服务器静态 HTML

# 5分钟学会如何访问服务器静态 HTML

主要通过 2 种方式 (http-server和node-static) 开通服务访问静态 HTML。

在浏览器上的静态 HTML 不能通过 ftp 的方式去访问，所以一般访问服务器上的静态资源都是通过服务的方式去访问静态 HTML。

# Start

# 1.init

#检查是否安装node
node -v  
#初始化当前项目 
#初始化，配置package.json文件，按照要求填写相关信息，一直回车也可以（不建议）
npm init

1
2
3
4
5

为啥要初始化 node 项目？因为http-server和node-static都是通过 node 来启动服务然后指向静态资源文件来访问。

# 2.http-server

npm i http-server // 安装 http-server，i是install的缩写
http-server -p 端口号 // 启动服务  不用-p 端口号的话，默认是8080
浏览器访问: 公网ip:端口号 // 注意路径问题
// 例子
http-server -p 1234 // 启动服务，端口号为1234
浏览器访问: xx.xx.xx.xx:1234即可

1
2
3
4
5
6

# 3.node-static

根据这个 node-static 简介

在当前资源下创建 index.js(文件夹名称随意) index.js

var static = require('node-static');
var file = new static.Server('./'); // "./"是资源的路径，如果你的index.js是跟资源同一个文件夹就可以这么写

require('http').createServer(function (request, response) {
    request.addListener('end', function () {
        file.serve(request, response);
    }).resume();
}).listen(1234); // 端口号一般建议4位跟相关服务类端口号区别开。

1
2
3
4
5
6
7
8

启动服务

node index.js

浏览器访问对应的 ip 即可浏览器访问: xx.xx.xx.xx:1234 即可

注意事项有的人通过上述命令可能会无法访问，目前根据我碰到的原因来看可能是因为阿里云的安全组配置限制了端口号，需要在阿里云安全组配置上加入端口号。

End 用http-server和node-static都是根据 node 来启动服务的，注意资源路径和端口号就可以初步使用，个人更建议node-static可配性更高。

02-CSS学习 →