配置node服务器并且链接微信公众号接口配置步骤详解


Posted in Javascript onJune 21, 2019

配置node服务器

在购买好服务器后,用Xshell链接到服务器。

1、安装nvm

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.34.0/install.sh | bash
或者
wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.34.0/install.sh | bash

安装完,关闭重新启动一下Xshell。

2、用nvm安装node

// 查看当前可安装node版本
nvm ls-remote
// 选择'nodejs.org'官网LTS稳定版本
nvm install v10.16.0
// 出现这样的显示表示安装好了,默认的是v10.16.0的node版本,6.9.0的npm版本
Now using node v10.16.0 (npm v6.9.0)
Creating default alias: default -> v10.16.0
// 可以使用命令查看版本
node --version 
// nvm可以安装多个node版本
nvm install v10.11.0
// 可以使用命令查看安装了多少个node版本
nvm ls
// 可以使用命令指定默认的node版本,如果安装了多个node版本,一定要指定一个默认的版本
nvm alias default v10.11.0
// 如果你不想使用默认,只是零时用一下,可以使用命令
nvm use v10.11.0

3、安装nginx

// 查看服务器系统版本
$ cat /etc/redhat-release 
// 安装epel-release 源
yum install epel-release -y
// 打开源配置
vim /etc/yum.repos.d/nginx.repo
// 在配置中设置nginx安装源,具体可以参考nginx官网文档('http://nginx.org/en/linux_packages.html#stable')
[nginx]
name=nginx repo
baseurl=http://nginx.org/packages/centos/7/$basearch/
gpgcheck=0
enabled=1
// 安装nginx
yum install nginx -y
// 查看nginx是否安装成功,成功的话会显示路径
whereis nginx

4、设置nginx

// 设置开机启动
systemctl enable nginx
// 启动服务,重启是'systemctl restart nginx',停止是 'stop'
systemctl start nginx
// 重新加载,因为一般重新配置之后,不希望重启服务,这时可以使用重新加载
systemctl reload nginx
// 查看服务器状态
systemctl status nginx
// 如果CentOS7 系统打开了防火墙,还需打开防火墙端口
firewall-cmd --zone=public --permanent --add-service=http
sudo firewall-cmd --reload
firewall-cmd --list-service
// 如果要使用反向代理,CentOS7 需要打开网络访问权限
setsebool httpd_can_network_connect 1

5、部署测试项目

// 创建文件夹
mkdir server
// 进入文件夹
cd server
// 创建js文件
vim home.js
// 编写测试代码,注意,这里的ip地址一定要配置成0.0.0.0,如果配置成127.0.0.1,外网会报错端口3000链接不通
const http = require('http');
const hostname = '0.0.0.0';
const port = 3000;
const server = http.createServer((req, res) => {
res.statusCode = 200;
res.setHeader('Content-Type', 'text/plain');
res.end('Hello World\n');
});
server.listen(port, hostname, () => {
console.log(`服务器运行在 http://${hostname}:${port}/`);
});
// 启动
node home.js
// 如果报错'Unhandled 'error' event',可能是端口被占用了,先查看端口占用情况
ps -ef|grep node
// 如果有占用,删除占用,'xxxx'为'root'后的数字
skill -9 xxxxx

出现:服务器运行在 http://0.0.0.0:3000/ 即表示node运行成功,运行成功后,登录阿里云后台配置安全组规则
配置成功如下显示:

允许 自定义 TCP 3000/3000 IPv4地址段访问 0.0.0.0/0 node后台端口

然后就可以在浏览器地址栏输入你的服务器公网ip地址加上:3000,成功出现Hello World即表示安全组配置成功

6、配置nginx

// 进入 '/etc/nginx' 文件夹,查看下 'nginx.conf' 配置文件
cd /etc/nginx
ls
vim nginx.conf
// 低版本的nginx 'nginx.conf' 文件夹里有以下内容
// # include /etc/nginx/conf.d/*.conf;
// # include /etc/nginx/sites-enabled/*;
// 去掉 '#' 号
// 创建nginx配置文件,文件名随意,我一般喜欢用项目名加端口号,比如 'wxServer-3000'
vim /etc/nginx/conf.d/wxServer-3000.conf
// 编写配置文件代码
# 项目名字
upstream wxServer {
# 需要代理的node端口号,也就是你写的端口号
server 0.0.0.0:3000;
# nginx最大连接数
keepalive 8;
}
# nginx服务器实例
server {
# 代理出去的端口号,默认Http协议的80端口,如果配置其它端口需要更改 SELinux 的设置
listen 0.0.0.0:80;
# 别人访问的域名或者ip地址,多个用空格隔开
server_name lzf.fun www.lzf.fun;
# 错误日志存放地址
access_log /var/log/nginx/wxServer-3000.log;
location / {
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $http_host;
proxy_set_header X-NginX-Proxy true;
# proxy_pass 设置反向代理用服务器域名,不使用反向代理,直接用上面upstream的名字就可以了
proxy_pass http://wxServer/;
proxy_redirect off;
}
}
// 保存配置文件后,检查是否编写错误
nginx -t
// 出现以下内容为正确
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful
// 重新加载nginx服务器
systemctl reload nginx
// 在阿里云后台开启80端口的安全组,然后在浏览器输入域名,可以看到 'Hello World' 就表示nginx配置成功了

7、配置PM2

// 安装PM2
npm install pm2 -g
// 进入你的node项目存放的文件夹,pwd是你的文件夹路径
cd pwd
// 启动pm2,--watch监听,每次改动代码自动启动,-i 1 启动一个实例,根据服务器又几个核心设置
// -i 0 则会根据机器当前核数自动开启尽可能多的进程
pm2 start home.js --watch -i 1
// 查看pm2
pm2 ls
// 查看错误日志
pm2 logs
// 重启
pm2 restart home.js
// 停止,id通过查看获得
pm2 stop home|id
// 删除
pm2 delete home|id
// 了解程序的详细信息
pm2 describe home|id
// 关闭Xshell,刷新域名,还可以看见 'Hello World' 表示配置成功

链接微信公众号接口配置

8、编写本地node代码

const Koa = require('koa')
const cors = require('koa2-cors')
const Router = require('koa-router')
const crypto = require('crypto')
const app = new Koa()
// 微信配置
const config = {
wechat: {
appID: 'appID',
appsecret: 'appsecret',
token: 'Maya'
}
}
// 使用koa2-cors解决跨域问题
app.use(
cors({
origin: ctx => {
if (ctx.url === '/test') {
return false
}
return '*'
},
exposeHeaders: ['WWW-Authenticate', 'Server-Authorization'],
maxAge: 5,
credentials: true,
allowMethods: ['GET', 'POST', 'DELETE'],
allowHeaders: ['Content-Type', 'Authorization', 'Accept']
})
)
// 给微信验证的
const wxServer = new Router()
wxServer.get('/', async ctx => {
const { signature, timestamp, nonce, echostr } = ctx.query
const token = config.wechat.token
let hash = crypto.createHash('sha1')
const arr = [token, timestamp, nonce].sort()
hash.update(arr.join(''))
const shasum = hash.digest('hex')
if (shasum === signature) {
return (ctx.body = echostr)
}
ctx.status = 401
ctx.body = 'Invalid signature'
})
// 装载所有路由
const router = new Router()
router.use('/forWx', wxServer.routes(), wxServer.allowedMethods())
// 加载路由中间件
app.use(router.routes()).use(router.allowedMethods())
app.listen(3000)
console.log('[demo] start-quick is starting at port 3000')

9、通过内网穿透的方式测试本地代码是否ok

1、通过localtunnel启动内网穿透,不推荐,有可能启动成功,但是域名链接失败

// 安装
npm install -g localtunnel
// 开启本地服务器
lt --port 3000

2、通过natapp启动内网穿透,配置需要花费一点时间

可以通过内网穿透工具natapp!这篇文章安装配置,

如果你代码写的是开启3000端口,那么最好也配置成3000端口

tips:如果看到隧道链接成功,但是127.0.0.1:3000端口链接失败的提示,不代表安装配置失败,是需要你启动一下代码

安装配置成功后,启动

node home.js

能够成功在浏览器上看到 Invalid signature 表示内网穿透成功

10、开启一个微信公众平台测试账号

在微信公众平台测试管理页面,接口配置信息,URL填写你natapp启动的域名加上forWx,比如我的域名是

http://qf7rja.natappfree.cc/forWx

Token是你自己自定义的,可以随便写,但是要和你本地代码里的Token一致,我这里用的是Maya

点击提交,显示配置成功

11、服务器链接微信公众号接口配置

通过上面的测试账号,验证了代码没有问题,可以配置成功接口配置,剩下的就是把代码上传到服务器了,安装选择rz和sz,当然,使用xftp更好

// 安装
yum install lrzsz -y
// 上传,执行命令,选择打包文件
rz
// 下载,filename是你打包的服务器文件夹,或者单个文件
sz filename

上传成功后,解压缩,清除前面的 Hello World 代码,清空 PM2 ,重新把现在代码挂到 PM2 上

在浏览器上输入域名 + forWx 能出现 Invalid signature 表示成功,如果没有出现,配置不成功,需要排查原因

在微信公众平台登录账号,选择基本配置-->服务器配置,然后按照配置测试账号的方式去配置

点击提交,显示配置成功

尾声

嘘~~~长出了一口气,研究了老久,node服务器总算配置成功了,而且已经链接到公众号接口配置,并且我还有一个测试账号
可以用测试账号本地写代码,然后再上传到服务器验证的方式去开发
这样的做的原因是,测试账号玩坏了不心疼,转眼又弄好了一个,服务器玩坏了,配置起来可就麻烦了
剩下的就是开发具体业务了,什么拿到AccessToken啊,自动回复消息啊,自定义菜单啊,等等等等

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 面向对象的 私有成员和公开成员
May 13 Javascript
JS数组的赋值介绍
Mar 10 Javascript
深入理解javascript原型链和继承
Sep 23 Javascript
jquery转盘抽奖功能实现
Nov 13 Javascript
javascript每日必学之条件分支
Feb 17 Javascript
JS中JSON对象和String之间的互转及处理技巧
Apr 06 Javascript
关于backbone url请求中参数带有中文存入数据库是乱码的快速解决办法
Jun 13 Javascript
jQuery Ajax全解析
Feb 13 Javascript
jQuery.form.js的使用详解
Jun 14 jQuery
基于input框覆盖掉数字英文的实例讲解
Jul 21 Javascript
vue+element创建动态的form表单及动态生成表格的行和列
May 20 Javascript
javascript设计模式 ? 职责链模式原理与用法实例分析
Apr 16 Javascript
微信小程序实现点击效果
Jun 21 #Javascript
JS利用prototype给类添加方法操作详解
Jun 21 #Javascript
三分钟教你用Node做一个微信哄女友(基友)神器(面向小白)
Jun 21 #Javascript
微信小程序实现弹出菜单动画
Jun 21 #Javascript
js类的继承定义与用法分析
Jun 21 #Javascript
js中值引用和地址引用实例分析
Jun 21 #Javascript
微信小程序实现消息框弹出动画
Apr 18 #Javascript
You might like
php实现数组纵向转横向并过滤重复值的方法分析
2017/05/29 PHP
详谈PHP中public,private,protected,abstract等关键字的用法
2017/12/31 PHP
ThinkPHP5.1验证码功能实现的示例代码
2020/06/08 PHP
Cookie跨域问题解决方案代码示例
2020/11/24 PHP
jQuery 判断元素上是否绑定了事件
2009/10/28 Javascript
javascript中字符串拼接需注意的问题
2010/07/13 Javascript
JS时间选择器 兼容IE6,7,8,9
2012/06/26 Javascript
js模拟点击事件实现代码
2012/11/06 Javascript
通过正则格式化url查询字符串实现代码
2012/12/28 Javascript
js借助ActiveXObject实现创建文件
2013/09/29 Javascript
jquery通过select列表选择框对表格数据进行过滤示例
2014/05/07 Javascript
详解Javascript继承的实现
2016/03/25 Javascript
Bootstrap插件全集
2016/07/18 Javascript
JS/HTML5游戏常用算法之碰撞检测 包围盒检测算法详解【圆形情况】
2018/12/13 Javascript
详解jQuery-each()方法
2019/03/13 jQuery
JS中的算法与数据结构之集合(Set)实例详解
2019/08/20 Javascript
详解vue-flickity的fullScreen功能实现
2020/04/07 Javascript
[02:01]2018完美盛典-开场舞《双子星》
2018/12/16 DOTA
python Django连接MySQL数据库做增删改查
2013/11/07 Python
简单介绍Python中的floor()方法
2015/05/15 Python
Django自定义manage命令实例代码
2018/02/11 Python
如何用Python制作微信好友个性签名词云图
2019/06/28 Python
Python单元测试及unittest框架用法实例解析
2020/07/09 Python
python爬取抖音视频的实例分析
2021/01/19 Python
关于探究python中sys.argv时遇到的问题详解
2021/02/23 Python
HTML5 的新的表单元素(datalist/keygen/output)使用介绍
2013/07/19 HTML / CSS
HTML5 解决苹果手机不能自动播放音乐问题
2017/12/27 HTML / CSS
服装销售人员求职自我评价
2013/09/26 职场文书
汽车检测与维修专业求职信
2013/10/30 职场文书
留学推荐信写作指南
2014/01/25 职场文书
大学国际贸易专业自荐信
2014/06/05 职场文书
关于九一八事变的演讲稿2014
2014/09/17 职场文书
党的群众路线教育实践活动督导组工作情况汇报
2014/10/28 职场文书
年终工作总结范文2014
2014/11/27 职场文书
酒店服务员岗位职责
2015/02/09 职场文书
Navicat连接MySQL错误描述分析
2021/06/02 MySQL