最近刚开始接触Angular,按照Angular文档中的快速上手的教程完成了一个项目(my-app),本地运行毫无压力,就想着把项目部署到自己的服务器上,按照网上的教程,我这新手一时半会也没能搞定,看到有人说跟本地一个流程,也是先装环境,但是在远程服务器上安装环境遇到了问题,就是安装完Angular CLI后ng命令不好使,甚至还有些人的做法是把本地的环境文件,项目文件上传到远程服务器上,传完一个简单的项目花了好久时间,就放弃上传环境了(感觉不靠谱),看官方的文档,将 build 好的 dist 目录下的文件托管在任何支持静态文件的 Web 服务器上就可以,然后决定用Node.js:
2、按照上一步的教程,在 /dist/my-app/ 目录下创建了 index.js;
3、再结合这位大神的博客,最后成功了!
4、在 index.js 所在的目录(/dist/my-app/)输入指令 node index.js 启动服务,然后在浏览器输入对应的主机名称+端口号(我的服务器没域名,使用的公网IP)即可浏览web页面:
5、最后附上 index.js 的代码:
const http = require('http');
const url = require('url');
var fs = require('fs');
const hostname = '0.0.0.0';
const port = 4200;
const server = http.createServer((req, res) => {
let pathName = url.parse(req.url).pathname;
pathname = pathName == '/' ? 'index.html' : pathName.substring(1);
console.log('### req.url=' + req.url);
console.log('### pathName=' + pathName);
console.log('### pathname=' + pathname);
fs.readFile('' + pathname, function(err, data) {
if (err) {
console.log('404');
} else {
var fileType = '';
if (pathname.endsWith('.html')) {
fileType = 'text/html';
} else if (pathname.endsWith('.css')) {
fileType = 'text/css';
} else if (pathname.endsWith('.js')) {
fileType = 'text/javascript';
} else {
fileType = 'application/octet-stream'; //二进制,项目没用到,暂时先这么写了
}
console.log('200');
res.writeHead(200, { "Content-Type": fileType + ";charset='utf-8'" });
res.write(data);
res.end();
}
});
});
server.listen(port, hostname, () => {
console.log(`Server running at http://${hostname}:${port}/`);
});