使用Nginx搭建简易版微信小程序HTTP接口的服务端(Mock)

前言


微信小程序是前后端分离的开发模式,就像APP开发一样,所有的数据都是通过接口来交互,并不像传统网页由服务端渲染页面,响应到浏览器HTML页面。
有很多不懂后端的同学想要开发微信小程序,但奈何不会写后端接口,难倒了很多人。
第三方也有很多在线的Mock工具,但由于微信小程序的安全机制,无法进行发布,显然不太适合,那么有没有更好的办法来实现呢?
下面我来教大家一个简单的方法,利用Nginx来搭建一个简易版微信小程序HTTP接口的服务端。(当然这个服务端也是一个Mock形式的)

使用这种方式的优缺点


优点

1、无需后端经验
2、接口数据可控
3、支持手机预览
4、可发布

缺点

1、无法进行增删改查操作

使用这种方式的限制虽然很大,但也是一种不错的选择
如果你的小程序只是一些信息展示,但需要不定期更新数据,这种方式成本很低
其他的类型的小程序,可以在有后端服务之后进行迁移
完全不需要修改任何小程序代码进行后端迁移[无需重新发布小程序]
需要准备的东西

1、一台Linux系统的服务器
2、一个已经备案通过的域名
3、HTTPS证书

Windows服务器也可以,但配置方法有少许不同,可以使用其他容器代替Nginx
备案过的域名需要解析到该服务器,并且已经在微信小程序后台配置过该域名为安全域名
相信要开发小程序的同学这两样东西应该都已经具备 
[如果你使用的是腾讯云的wafer解决方案,且自己无法操作这台服务器,还是老老实实的写后端吧]

下面开始进入正题

安装Nginx


本人比较喜欢源码编译安装,下面就介绍如何源码编译安装Nginx
该文档编写时最新的Nginx版本下载地址为:http://nginx.org/download/nginx-1.13.9.tar.gz

以CentOS 7为例, 其他系统的安装方法这里不介绍,请出门左拐去百度

在编译Nginx前需要安装一些依赖,具体记不太清了,下面只能凭印象来列举一下所需依赖

pcre-*、openssl、openssl-devel、gcc、gcc-c++、ncurses-devel、perl

开始安装

# 在服务器使用`wget`命令下载下来
wget http://nginx.org/download/nginx-1.13.9.tar.gz
# 如果服务器上没有`wget`命令请执行下面的命令进行安装,然后再下载
yum install -y wget
# 安装编译所需依赖
yum install -y pcre-* openssl openssl-devel gcc gcc-c++ ncurses-devel perl
# 解压下载下来的压缩包
tar zxf nginx-1.13.9.tar.gz
# 进入到解压出来的文件夹
cd nginx-1.13.9
# 配置编译的选项
# 安装到 /usr/local/nginx 目录,且开启SSL(HTTPS)功能
./configure --prefix=/usr/local/nginx --with-http_ssl_module
# 编译
make
# 安装
make install

以上命令执行完成之后Nginx就已经安装完成了,下面还需配置一些东西,用来操作Nginx

开机自启动

# 新建一个配置文件放在/etc/systemd/system目录中文件名为nginx.service
# 个人习惯直接使用vim命令进行新建和编辑
vim /etc/systemd/system/nginx.service
# 如果服务器上没有`vim`命令请执行下面的命令进行安装,然后再新建和编辑配置文件
yum install -y vim
# 在这个配置文件中写入以下代码
[Unit]
Description=Nginx
After=network.target remote-fs.target nss-lookup.target

[Service]
ExecStart=/usr/local/nginx/sbin/nginx -p /usr/local/nginx
ExecReload=/usr/local/nginx/sbin/nginx -p /usr/local/nginx -s reload
ExecStop=/usr/local/nginx/sbin/nginx -p /usr/local/nginx -s stop
Restart=always
Type=forking
PIDFile=/usr/local/nginx/logs/nginx.pid
KillMode=process
RestartSec=60s

[Install]
WantedBy=multi-user.target
# 代码编写完之后按下 esc 然后输入 :wq 进行保存和退出编辑
# 退出编辑后运行以下命令即可
systemctl enable nginx.service 

Nginx的常用操作命令

# 启动服务
systemctl start nginx.service
# 查看状态
systemctl status nginx.service
# 重启
systemctl restart nginx.service
# 重载
systemctl reload nginx.service
# 停止
systemctl stop nginx.service

到此为止Nginx算是已经安装完成了,当然别忘了开启防火墙端口,这里就不多做介绍了

配置Nginx


编辑Nginx配置文件

# 新建一个文件夹用于存放自己的配置文件
mkdir /usr/local/nginx/vhosts
# 编辑Nginx的配置文件
vim /usr/local/nginx/conf/nginx.conf
# 然后在最后一个反大括号前添加一行代码
include /usr/local/nginx/vhosts/*.conf;
# 代码编写完之后按下 esc 然后输入 :wq 进行保存和退出编辑

以后所有的Nginx配置文件直接在 /usr/local/nginx/vhosts 文件夹下管理就好了

下面开始创建我们需要的HTTP接口服务端吧

# 创建这个HTTP接口服务端的配置文件
vim /usr/local/nginx/vhosts/api.conf
# 写入以下代码
server {
    listen  443;
    server_name 域名;
    ssl on;
    ssl_certificate HTTPS证书 .crt 文件存放路径;
    ssl_certificate_key HTTPS证书 .key 文件存放路径;
    ssl_session_timeout 5m;
    ssl_protocols   TLSv1 TLSv1.1 TLSv1.2;
    ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
    ssl_prefer_server_ciphers   on;

    location / {
        root    /opt/api;
        index   index.html;
    }

    error_page 405 =200 @405; 

    location @405  { 
        root /opt/api;
        proxy_method GET; 
        proxy_pass https://域名;  
    }
}
# 其中域名的填写不要写http或者https,直接写你解析在这台服务器的域名
# 关于HTTPS的证书,每个机构发放的文件都有所不同,具体还需资讯发放机构
# loaation 下面的 root 是存放接口文件的目录
# 代码编写完之后按下 esc 然后输入 :wq 进行保存和退出编辑

到这里Nginx的所有配置都已经做完了,下面可以启动Nginx来试验一下了

# 启动命令
systemctl start nginx.service

测试


在 /opt/api 目录下新建一个 json 文件, 或者在本地编写完之后上传到服务器

# 测试文件的内容
[
    {
        id: 1,
        title: "微信订阅号"
    },
    {
        id: 2,
        title: "微信服务号"
    },
    {
        id: 3,
        title: "微信小程序"
    },
    {
        id: 4,
        title: "微信小游戏"
    },
    {
        id: 5,
        title: "企业微信"
    }
]

我把这个文件放在了 /opt/api/sys 目录下, 文件名叫 product.json

wx.request 去请求这个伪接口,地址为: https://域名/sys/product.json
成功响应json文件中的内容

接口的地址就是 https://域名/你存放在服务器的路径 从/opt/api后面开始

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
禁止转载,如需转载请通过简信或评论联系作者。
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 215,384评论 6 497
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,845评论 3 391
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 161,148评论 0 351
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,640评论 1 290
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,731评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,712评论 1 294
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,703评论 3 415
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,473评论 0 270
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,915评论 1 307
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,227评论 2 331
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,384评论 1 345
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,063评论 5 340
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,706评论 3 324
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,302评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,531评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,321评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,248评论 2 352

推荐阅读更多精彩内容