配置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 相关文章推荐
jquery select(列表)的操作(取值/赋值)
Aug 06 Javascript
extjs 为某个事件设置拦截器
Jan 15 Javascript
Ext JS添加子组件的误区探讨
Jun 28 Javascript
jQuery对象的length属性用法实例
Dec 27 Javascript
dedecms页面如何获取会员状态的实例代码
Mar 15 Javascript
js 函数式编程学习笔记
Mar 25 Javascript
vue.js移动端app实战1:初始配置详解
Jul 24 Javascript
微信小程序实现留言功能
Oct 31 Javascript
vue-router实现嵌套路由的讲解
Jan 19 Javascript
VUE实现密码验证与提示功能
Oct 18 Javascript
js通过循环多张图片实现动画效果
Dec 19 Javascript
解决vue路由name同名,路由重复的问题
Aug 05 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与ASP
2006/10/09 PHP
PHP开发过程中常用函数收藏
2009/12/14 PHP
php简单实现快速排序的方法
2015/04/04 PHP
php实现网页缓存的工具类分享
2015/07/14 PHP
Yii2中如何使用modal弹窗(基本使用)
2016/05/30 PHP
PHP有序表查找之插值查找算法示例
2018/02/10 PHP
js实现滑动触屏事件监听的方法
2015/05/05 Javascript
jQuery使用drag效果实现自由拖拽div
2015/06/11 Javascript
简单实现轮播图效果的实例
2016/07/15 Javascript
快速掌握jQuery插件WebUploader文件上传
2016/11/07 Javascript
完美解决jQuery fancybox ie 无法显示关闭按钮的问题
2016/11/29 Javascript
JS图片压缩(pc端和移动端都适用)
2017/01/12 Javascript
vue.js树形组件之删除双击增加分支实例代码
2017/02/28 Javascript
JS中使用textPath实现线条上的文字
2017/12/25 Javascript
vue2.0 computed 计算list循环后累加值的实例
2018/03/07 Javascript
vue 下列表侧滑操作实例代码详解
2018/07/24 Javascript
浅谈VUE-CLI脚手架热更新太慢的原因和解决方法
2018/09/28 Javascript
layer.alert回调函数执行关闭弹窗的实例
2019/09/11 Javascript
JavaScript图像放大镜效果实现方法详解
2020/06/28 Javascript
Python开发实例分享bt种子爬虫程序和种子解析
2014/05/21 Python
Python实现基于HTTP文件传输实例
2014/11/08 Python
符合语言习惯的 Python 优雅编程技巧【推荐】
2018/09/25 Python
python批量下载网站马拉松照片的完整步骤
2018/12/05 Python
python右对齐的实例方法
2020/07/05 Python
python dir函数快速掌握用法技巧
2020/12/09 Python
亚洲领先的旅游体验市场:Voyagin
2019/11/23 全球购物
企业内部培训方案
2014/02/04 职场文书
市优秀教师事迹材料
2014/02/05 职场文书
2014年四风问题个人对照自查剖析材料
2014/09/15 职场文书
三严三实心得体会范文
2014/10/13 职场文书
乡镇群众路线整改落实情况汇报
2014/10/28 职场文书
2014年酒店工作总结范文
2014/11/17 职场文书
2014年结对帮扶工作总结
2014/12/17 职场文书
《攀登者》:“海拔8000米以上,你不能指望任何人”
2019/11/25 职场文书
swagger如何返回map字段注释
2021/07/03 Java/Android
使用canvas对video视频某一刻截图功能
2021/09/25 HTML / CSS