如何快速搭建微信小程序?快速搭建微信小程序的方法( 三 )


在微信小程序中,所有的网络请求受到严格限制,不满足条件的域名和协议无法请求 。简单来说,就是你的域名必须走 https协议 。所以你还需要为你的域名申请一个证书 。如果没有域名,请先注册一个 。由于我们没有收到内测,也就暂时不用登录微信公众平台配置通信域名了 。
第五步:Nginx 配置 https
微信小程序云端示例镜像中,已经部署好了 Nginx,但是还需要在 /etc/nginx/conf.d 下修改配置中的域名、证书、私钥 。

如何快速搭建微信小程序?快速搭建微信小程序的方法

文章插图
请将红框部分换成自己的域名和证书,并且将 proxy_pass 设置为 Node.js 监听的端口,我的是 9993 。
配置完成后,重新加载配置文件并且重启 Nginx 。
sudo service nginx reload sudo service nginx restart
第六步:域名解析
我们还需要添加域名记录,将域名解析到我们的云服务器上,这样才可以使用域名进行 https服务 。在腾讯云注册的域名,可以直接使用云解析控制台来添加主机记录,直接选择上面购买的 CVM 。
如何快速搭建微信小程序?快速搭建微信小程序的方法

文章插图
解析生效后,我们的域名就支持 https 访问了 。
第七步:开通和配置 COS
由于我们希望实现动静分离的架构,所以选择把「小相册」的图片资源是存储在 COS 上的 。要使用 COS 服务,需要登录 COS管理控制台,然后在其中完成以下操作 。
1.点击创建 Bucket 。会要求选择所属项目,填写相应名称 。这里,我们只需要填上自己喜欢的 Bucket 名称即可 。
如何快速搭建微信小程序?快速搭建微信小程序的方法

文章插图
2.然后在 Bucket 列表中,点击刚刚创建的 Bucket 。然后在新页面点击“获取API密钥” 。
如何快速搭建微信小程序?快速搭建微信小程序的方法

文章插图
弹出的页面中包括了我们所需要的三个信息:唯一的 APP ID,一对SecretID和SecretKey(用于调用 COSAPI) 。保管好这些信息,我们在稍后会用到 。
3.最后,在新的 Bucket 容器中创建文件夹,命名为photos 。这点后面我们也会提到 。
第八步:启动「小相册」的服务端
在官方提供的镜像中,小相册示例的 Node 服务代码已部署在目录 /data/release/qcloud-applet-album下 。进入该目录,如果是你自己的服务器,请进入相应的文件夹 。
cd /data/release/qcloud-applet-album
在该目录下,有一个名为 config.js 的配置文件(如下所示),按注释修改对应的 COS 配置:
module.exports = { // Node 监听的端口号 port: '9993', ROUTE_BASE_PATH: '/applet',cosAppId: '填写开通 COS 时分配的 APP ID', cosSecretId: '填写密钥 SecretID', cosSecretKey:'填写密钥 SecretKey', cosFileBucket: '填写创建的公有读私有写的bucket名称', };
另外,cd ./routes/album/handlers,修改 list.js,将 const listPath 的值修改为你的Bucket下的图片存储路径 。如果是根目录,则修改为 '/' 。当前服务端的代码中将该值设置为了 '/photos',如果你在第七步中没有创建该目录,则无法调试成功 。
小相册示例使用 pm2 管理 Node 进程,执行以下命令启动 node 服务:
pm2 start process.json
第九步:配置「小相册」通信域名
接下来,在微信 web 开发者工具打开「小相册」项目,并把源文件config.js中的通讯域名 host 修改成你自己申请的域名 。
如何快速搭建微信小程序?快速搭建微信小程序的方法

文章插图
将蓝色框内的内容修改为自己的域名
然后点击调试,即可打开小相册Demo开始体验 。

推荐阅读