10 min 阿里云搭建网站入门：socket聊天室网页实例（基于nodejs和轻量应用服务器

时间：2023-07-06 11:51:01 | 来源：网站运营

时间：2023-07-06 11:51:01 来源：网站运营

10 min 阿里云搭建网站入门：socket聊天室网页实例（基于nodejs和轻量应用服务器）：没事干租个阿里云的服务器玩玩，跟着这个教程一步步做下来，你会对建站和服务器有个非常简单的了解。无痛入门~不用什么编程基础，有对Linux命令、服务器、web项目有个民科了解就行。

纯粹科普，高手绕道。

一、简单讲讲这个用了做例子的nodejs的聊天室项目，对网站有个基本概念。项目chatroom目录如下：

• css存css
• img存img，图片文件
• js存js
• node_modules存nodejs-express相关包
• 还有两个界面的html，就两个界面
• server.js 项目启动脚本。

这个项目很简单，作为例子够用了。给个项目link: https://github.com/saaries/chatroom




二、在本地运行

先在本地把网页跑起来看看。默认本地已安装 nodejs, npm, express, git

• git clone https://github.com/saaries/chatroom
• cd chatroom
• node server.js (或者直接node server)
  

• 打开浏览器进入：http://localhost:4000/ 你应该会看到下图。那么这时候网页就在本地跑起来了。下面考虑怎么把它放在阿里云的服务器上，这样别的PC也可以访问。

三、准备一个服务器

阿里云买就完事了。24岁以下9.5/月，买着练手很划算 ！

先在阿里云App实名认证，首页=>学生礼遇=>开发者成长计划=>轻量应用服务器

我的配置是：

买完了在网页进入控制台，可以看到刚刚买的服务器。

点击远程连接（除此之外，本地连接服务器的方法还有非常多，详见开发者文档 https://help.aliyun.com/document_detail/59083.html?spm=5176.10173289.0.dexternal.7f512e77HEb2JQ#activeroot ，这里只说最快上手的一种）：

远程连接后，为服务器安装nodejs, npm：

• 具体见博文：https://blog.csdn.net/qq_44812132/article/details/104947750
• 太长不看可以直接run下面的代码
• sudo su root
• sudo yum install nodejs
• sudo yum install npm
• sudo yum install zip unzip
• node -v 如果输出node版本号则说明安装成功，npm同理
• npm -v

四、服务器的防火墙处理

进入服务器=>左侧概览=>安全=>防火墙=>添加规则=>自定义/TCP/4000

因为在server.js 中我们监听的窗口是4000，因此在服务器端要把4000端口打开，允许外网访问。

添加后的防火墙列表：

修改完后最好将服务器重启一次。

五、上传本地项目到服务器

这里为了演示方便，我用了github。这一步完成了将本地写好的项目上传到服务器，进行项目部署。在服务器的远程连接窗口（上面的terminal）输入：

• sudo su root
• cd /root
• git clone https://github.com/saaries/chatroom
• (unzip chatroom)
• cd chatroom
• node server

执行完之后，项目就在服务器上面跑起来了。命令与期望得到的输出见下图：

执行好后，这个terminal不要关，因为需要保证server一直在running才能访问。




六、外网访问

打开PC端浏览器或者手机，输入网址 46.102.200.253:4040

这里的 46.102.200.253 是我的服务器ip，根据你的情况修改；4000 是 server.js 中指定的端口号。

那么你会见到下图，成功部署，可以登录着玩一玩。




七、一些可能用得着的笔记。

• 如何在本地运行一个nodejs项目 进入项目目录，node XX.js 或直接 node XX 不一定是4000这个端口号，具体在 XX.js 里面找 浏览器打开：http://localhost:4000/index.html
• 阿里云服务器 环境准备：https://blog.csdn.net/qq_44812132/article/details/104947750 服务器node/npm安装：https://blog.csdn.net/erdfty/article/details/89847743
• 服务器远程连接 教程：https://help.aliyun.com/document_detail/59083.html?spm=a2c4g.11186623.4.5.4d562108thHcX1 SSH密钥创建：XXX.pem PuTTy安装：https://www.jianshu.com/p/ec552ffb84fc，过程曲折！用port老老实实装着等就好了。 密钥转换命令：sudo puttygen /Users/saaries/Downloads/SHH_Mac.pem -o /Users/saaries/Downloads/SHH_Mac.ppk -O private
• 远程连接命令：使用 SSH 命令连接至实例（假设实例的公网 IP 地址为 10.10.10.100）：ssh root@10.10.10.100 -i /root/xxx.pem。
• 利用github部署：https://blog.csdn.net/qq_32339477/article/details/86529409 外网访问防火墙设置：https://blog.csdn.net/qq_37705048/article/details/82863373 运行服务器：https://segmentfault.com/a/1190000013740262
• 修改默认初始页index.html：https://blog.csdn.net/m0_48808447/article/details/108139020 app.use(myexpress.static(__dirname+"/public",{index:"login.html"}));//默认设置首页
• Linux删除文件夹：rm -rf XXX
• 远程连接到服务器传输文件：https://www.pianshen.com/article/8315137485/ sftp传输命令：put 本地文件路径 远程主机路径 只能传输文件，所以先本地压缩再到服务器里解压：yum install unzip安装 unzip 压缩包全名
• 查看当前目录：pwd
• 通过输入“sudo su root”切换至root账号
• 文件重命名： 将目录A重命名为B： mv A B 将/a目录移动到/b下并重命名为c ： mv /a /b/c 其实在文本模式中要重命名文件或目录，只需要使用mv命令就可以了，比如说要将一个名为abc的文件重命名为1234：mv abc 1234