云上部署微信小程序,需要首先购买云主机及 EIP、安全证书等资源,并且完成域名备案。(滴滴云提供免费备案服务,协助用户完成域名备案)

相关资源准备妥当以后,即可开始部署相关服务了。部署任务的第一步需要在滴滴云主机上完成 Nginx 等 Web 服务部署。本文以 Nginx 举例,如果需要其他案例或者购买等指导,请登录滴滴云官网帮助与支持查看。

  1. 登录 DC2,安装 Nginx:
sudo su
yum install –y nginx
systemctl start nginx
systemctl enable nginx
  1. 编辑测试页面:
cd /usr/share/nginx/html
mv index.html index.html.bak
vi index.html
This is hello from Didi!
  1. 本次测试域名chaucerhe.com,已在滴滴云进行转入备案,有关备案流程请参考以下链接:https://www.didiyun.com/icp.html。
  2. 小程序中应用的域名必须是 HTTPS 开头,因此要为网站服务添加安全证书。

本例中使用了滴滴云 Web 应用防火墙(WAF),并在滴滴云官网购买了安全证书,具体 WAF 的开通方式和安全证书购买流程请参考滴滴云官网。WAF 基本设置如下:

  1. 在WAF中添加域名
  2. 添加需要保护的域名
  3. 设置 HTTPS 并添加证书
  4. 设置源站 IP,源站 IP 为滴滴云主机的 EIP
  5. 添加完成后,将 WAF 的 CNAME 添加到域名供应商的 CNAME 记录中,本例中的域名是在阿里云购买,请参考以下设置:

微信小程序前端开发

  1. 访问微信公众平台 ,注册并登录。
  2. 参照链接完善小程序信息,先在微信开发者工具创建项目。
  3. 本例是针对微信自带模板小程序“hello world”的修改,获取第一部分中滴滴云主机的网页内容。

打开微信开发者工具,以下为模板小程序的页面文件结构:

我们需要对 index.js 中的部分代码进行修改,以下为修改后的代码。注意将 URL 修改为滴滴云主机的域名。

//index.js
//获取应用实例
const app = getApp()Page({data: {motto: 'Hello world',userInfo: {},hasUserInfo: false,canIUse: wx.canIUse('button.open-type.getUserInfo')},//事件处理函数bindViewTap: function() {wx.navigateTo({url: '../logs/logs'})},onLoad: function () {const _this = thiswx.request({url: 'https://chaucerhe.com',success:function(res) {_this.setData({motto: res.data})}})if (app.globalData.userInfo) {this.setData({userInfo: app.globalData.userInfo,hasUserInfo: true})} else if (this.data.canIUse){// 由于 getUserInfo 是网络请求,可能会在 Page.onLoad 之后才返回// 所以此处加入 callback 以防止这种情况app.userInfoReadyCallback = res => {this.setData({userInfo: res.userInfo,hasUserInfo: true})}} else {// 在没有 open-type=getUserInfo 版本的兼容处理wx.getUserInfo({success: res => {app.globalData.userInfo = res.userInfothis.setData({userInfo: res.userInfo,hasUserInfo: true})}})}},getUserInfo: function(e) {console.log(e)app.globalData.userInfo = e.detail.userInfothis.setData({userInfo: e.detail.userInfo,hasUserInfo: true})}
})

需要注意的是要将 URL 修改为滴滴云主机的域名。

点击真机调试,弹出二维码,打开微信扫描二维码:

可以看到从滴滴云主机的web服务获取的内容:

滴滴云微信小程序部署指导相关推荐

  1. node.js 微信小程序 部署服务器_自行部署微信小程序生产环境(node.js)—腾讯云服务器...

    一.前期准备 购买域名 + (云)服务器 购买https证书 二.解决方案 在一台(云)服务器上,安装好运行环境(nodejs+mysql+pm2+nginx),然后通过pm2运行小程序后端项目,并在 ...

  2. 浅谈对腾讯云微信小程序解决方案服务端的理解(主要针对信道服务)

    浅谈对腾讯云微信小程序解决方案服务端的理解(主要针对信道服务) 参考文章: (1)浅谈对腾讯云微信小程序解决方案服务端的理解(主要针对信道服务) (2)https://www.cnblogs.com/ ...

  3. python操作微信小程序云端数据库_微信小程序·云开发云数据库的基本使用-微信小程序云开发实例-腾讯云微信小程序...

    微信小程序·云开发云数据库的基本使用-微信小程序云开发实例-腾讯云微信小程序 浏览量:1120 时间:2020-04-06

  4. 关于将微信小程序部署到云服务器上的具体步骤

    微信小程序系列文章列表: 一文读懂微信小程序开发工具.项目结构.全局配置文件及页面跳转 一文读懂微信小程序开发wxml.json.js.wxss四类核心文件 微信小程序开发抽取HTML种数据的最快方法 ...

  5. node.js 微信小程序 部署服务器_微信小程序开发入门(一),Nodejs搭建本地服务器...

    1.  如何模拟真实环境中,读取服务端数据,首先需要使用Nodejs搭建一个本地服务器的环境. 在搭建web服务器之前,需要先安装node.js(安装版本最好为6.9.x) 安装后node.js,接下 ...

  6. node.js 微信小程序 部署服务器_微信小程序云开发环境部署,及添加数据

    点击蓝字 关注我们 今天在漫无目的逛CSDN的时候,一篇关于微信公众号云开发的文章引起了我的注意.据介绍,小程序云开发简称tcb,是腾讯爸爸给我们提供的基于腾讯云的云服务器.目前云开发已包含云数据库, ...

  7. 微信小程序 部署腾讯云 出现502 bad gateway 新解决方案

    当我们完成本地开发后 会选择微信开发者工具 上传测试代码 但往往会出现 502 (Bad Gateway) 错误 博主根据自身的跳坑经验 给出以下解决方案 希望能帮到各位! 一 ,上传之前的准备 1, ...

  8. 小程序微信授权登录服务器异常,解决调试腾讯云微信小程序Demo错误“登录失败:调用鉴权服务失败#40029_WEIXIN_CODE_ERR”...

    此文章解决大家有可能遇到的"登录失败:调用鉴权服务失败#40029的问题"~~ 很多人出现上面的问题,那是因为:如果在购买解决方案时,把AppId 和 AppSecret 填写错误 ...

  9. 牛刀云微信小程序完整项目教程

    鉴于懒得把在word写好的67页文档再搬过来 大家可以直接百度网盘上下载 链接:https://pan.baidu.com/s/1u-N__BTFSZO8W5B-lisBlg 提取码:x5vn 有问题 ...

最新文章

  1. Quartz.Net线程处理用到的两个Attribute
  2. Javascript中字符串输出html的动态链接
  3. 基于android模拟led发光,LED通知灯模拟app
  4. 【转】测试人员的思想理念和工作方法
  5. Apache Tomcat目录下各个文件夹的作用
  6. 荣耀50系列外观配置抢先看:售价成唯一悬念
  7. EDR BYPASS
  8. 身份证号码识别(python)
  9. HTML网页制作——制作一个属于自己的网页
  10. 如何锁定excel的一列不允许修改编辑
  11. 查看树莓派I2C设备是否正常
  12. PHP+Mysql 实现留言板
  13. 安卓中动态生成界面布局
  14. 【多元统计分析】02.多元正态分布
  15. CVT变速器中壳体吊机设计
  16. 数据备份及恢复需求分析
  17. 1个球从100m落下,每次时,反跳原高度的一半,再落,再反弹,求第10次落地共经过多少m,第10次反弹多高。 谭浩强《c语言程序设计》第五章第十一题
  18. 单选框按钮设置不可选中
  19. 涠洲岛日出日落时间表,1月10日涠洲岛开船时间/日出日落/天气预报
  20. livecd linux 原理,将现有Ubuntu系统做成LiveCD

热门文章

  1. 追女孩非常有效的23条短信
  2. 魔兽怀旧服服务器紧急维护,《魔兽世界怀旧服》这些服务器不会排队!官方紧急公告开服排队约10小时...
  3. shareSDK集成
  4. 小游戏开发周期多长时间
  5. Java构造方法(与类名相同的方法)、类方法、类变量、实例方法、实例变量
  6. PHP WEB练习题
  7. Java高级开发面试,java课程百度网盘
  8. linux acpi 电源管理,ACPI电源管理
  9. ORAClE 两个表取交集,并集,差集
  10. 屏蔽QQ内置浏览器举报功能(正在研究)