配置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 相关文章推荐
鼠标放在图片上显示大图的JS代码
Mar 26 Javascript
JavaScript函数的4种调用方法详解
Apr 22 Javascript
IE6/IE7中JavaScript json提示缺少标识符、字符串或数字问题处理
Dec 16 Javascript
JS烟花背景效果实现方法
Mar 03 Javascript
jquery事件绑定解绑机制源码解析
Sep 19 Javascript
自定义require函数让浏览器按需加载Js文件
Nov 24 Javascript
Bootstrap导航简单实现代码
Mar 06 Javascript
Angular 4依赖注入学习教程之InjectToken的使用(八)
Jun 04 Javascript
AngularJS模糊查询功能实现代码(过滤内容下拉菜单排序过滤敏感字符验证判断后添加表格信息)
Oct 24 Javascript
推荐10款扩展Web表单的JS插件
Dec 25 Javascript
浅谈vue-router路由切换 组件重用挖下的坑
Nov 01 Javascript
javascript实现支付宝滑块验证码效果
Jul 24 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
一个MYSQL操作类
2006/11/16 PHP
php基础学习之变量的使用
2011/06/09 PHP
具有时效性的php加密解密函数代码
2013/06/19 PHP
php session劫持和防范的方法
2013/11/12 PHP
php的sprintf函数的用法 控制浮点数格式
2014/02/14 PHP
如何写php守护进程(Daemon)
2015/12/30 PHP
thinkPHP5分页功能实现方法分析
2017/10/25 PHP
Laravel 实现密码重置功能
2018/02/23 PHP
PHP函数按引用传递参数及函数可选参数用法示例
2018/06/04 PHP
控制打印时页眉角的代码
2007/02/08 Javascript
JS获得QQ号码的昵称,头像,生日的简单实例
2013/12/04 Javascript
Java/JS获取flash高宽的具体方法
2013/12/27 Javascript
JS 获取浏览器和屏幕宽高等信息代码
2014/03/31 Javascript
jquery禁止回车触发表单提交
2014/12/12 Javascript
浅谈js算法和流程控制
2016/12/29 Javascript
基于bootstrap实现收缩导航条
2017/03/17 Javascript
基于jQuery的左滑出现删除按钮的示例
2017/08/29 jQuery
基于BootStrap的文本编辑器组件Summernote
2017/10/27 Javascript
微信小程序实现图片上传功能
2018/05/28 Javascript
jQuery实现动画、消失、显现、渐出、渐入效果示例
2018/09/06 jQuery
vue、react等单页面项目部署到服务器的方法及vue和react的区别
2018/09/29 Javascript
vue实现随机验证码功能(完整代码)
2019/12/10 Javascript
vue+element使用动态加载路由方式实现三级菜单页面显示的操作
2020/08/04 Javascript
vue pages 多入口项目 + chainWebpack 全局引用缩写说明
2020/09/21 Javascript
jQuery实现计算器功能
2020/10/19 jQuery
Vue在H5 项目中使用融云进行实时个人单聊通讯
2020/12/14 Vue.js
[59:48]LGD vs IG 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
pip 错误unused-command-line-argument-hard-error-in-future解决办法
2014/06/01 Python
python抓取京东小米8手机配置信息
2018/11/13 Python
Python图像处理模块ndimage用法实例分析
2019/09/05 Python
Python猜数字算法题详解
2020/03/01 Python
用CSS3实现Win8风格的方格导航菜单效果
2013/04/10 HTML / CSS
标准毕业生自荐信范文
2013/11/04 职场文书
工程管理造价应届生求职信
2013/11/13 职场文书
休学证明范本
2015/06/19 职场文书
初中政治教学工作总结
2015/08/13 职场文书