【快点查查】微信小程序使用流程

该项目已经开源,开源地址如下

  • GitHub地址
  • 码云地址

API注册

第一步:注册qqma开发者

  • 注册qqmap开发者

  • 点右上方的【控制台】按钮
    【快点查查】微信小程序使用流程_第1张图片

  • 依次点击【key管理】——>【创建新密钥】
    【快点查查】微信小程序使用流程_第2张图片

  • 依次填写【Key名称】——>【描述】——>【验证码】,点击提交即可。
    【快点查查】微信小程序使用流程_第3张图片

  • 然后会提示key申请成功,接下来点击【进入key设置】即可。
    【快点查查】微信小程序使用流程_第4张图片

  • 最后按照下图的内容,填写appid和勾选相关内容就好。
    【快点查查】微信小程序使用流程_第5张图片

第二步:注册高德地图开发者开发者

  • 注册高德地图开发者
  • 注册后,依次点击【控制台】——>【应用管理】——>【我的应用】
    【快点查查】微信小程序使用流程_第6张图片
  • 点击【创建新应用】
    【快点查查】微信小程序使用流程_第7张图片
  • 填写【应用名称】和【应用类型】即可。(可以自己随便命名,不需要和图上一致。)
    【快点查查】微信小程序使用流程_第8张图片
  • 面板中找到该应用后,点击【添加】,进入key的设置。
    【快点查查】微信小程序使用流程_第9张图片
  • 输入【key的名称】,选择【服务平台】为【微信小程序】,然后保存就好

【快点查查】微信小程序使用流程_第10张图片

  • 高德开发者的key就申请好了。
    【快点查查】微信小程序使用流程_第11张图片

第三步:注册和风天气开发者

  • 注册和风天气开发者

  • 注册好账户后,点击【控制台】
    【快点查查】微信小程序使用流程_第12张图片

  • 依次点击【应用管理】——>【新建应用】

【快点查查】微信小程序使用流程_第13张图片

  • 输入该应用名称
    【快点查查】微信小程序使用流程_第14张图片
  • 然后在该应用中选择【添加KEY】

【快点查查】微信小程序使用流程_第15张图片

  • 然后填写该KEY的信息,类型必须为【Web API】
    【快点查查】微信小程序使用流程_第16张图片
  • 创建后的key信息入如下。【快点查查】微信小程序使用流程_第17张图片
  • 去认证【个人开发者】,点击【我的控制台】,第一次注册的类型为【】普通用户,然后点击认证就好,填写个人证件信息。大概3天就可以通过审核。审核通过后,你的账号类型就是下图的样子【认证开发者】
    【快点查查】微信小程序使用流程_第18张图片

第四步:到微信小程序里配置request域名

  • 登陆小程序后,点击左侧【开发】,点击【开发设置】,然后页面下滑。。

  • 【快点查查】微信小程序使用流程_第19张图片

  • 一直下滑到【服务器域名配置】,然后点击修改,将下列四个域名添加进去
    【快点查查】微信小程序使用流程_第20张图片

https://apis.map.qq.com
https://free-api.heweather.com
https://restapi.amap.com
https://v1.hitokoto.cn
到这里为止,快点查查小程序的前期工作就全部准备完毕。

第五步:运行小程序

  • 拉去github上的代码。
git clone https://github.com/tomato-cc/wxmap.git
  • 修改配置文件
    【快点查查】微信小程序使用流程_第21张图片

  • 修改config.js文件,将qqmap、高德、和风的key加进去。

【快点查查】微信小程序使用流程_第22张图片

  • 修改app.js文件,将和风的key加进去。
    【快点查查】微信小程序使用流程_第23张图片

  • 然后点击【云开发】,将项目文件下【云平台数据】文件夹内的数据导入。
    【快点查查】微信小程序使用流程_第24张图片

  • 第一次进入云平台需要创建用户,简单操作下就好。然后点击【数据库】,点【+】号,进行创建数据库。创建两个数据库的名字分别为:broadcasthotCities
    【快点查查】微信小程序使用流程_第25张图片

  • 选中broadcast集合,然后选择导入,将’database_broadcast.json’文件导入即可。同理的,选择hotCities集合,然后选择导入,将’database_hotCities.json’文件导入即可。

【快点查查】微信小程序使用流程_第26张图片

  • 然后将代码中的【云函数】上传到【云平台】。修改下面三个文件夹内的index.js文件。将cloud env修改为自己云开发平台的环境ID。

【快点查查】微信小程序使用流程_第27张图片
【快点查查】微信小程序使用流程_第28张图片

  • 鼠标移动到【cloudfunction】文件夹,右键,点击同步云函数列表

【快点查查】微信小程序使用流程_第29张图片

  • 同步成功后,可以在云平台的云函数中进行查看 。
    【快点查查】微信小程序使用流程_第30张图片

  • 将代码中的【云平台数据】里面的图片上传到云平台的【存储中】,注意路径就好。

【快点查查】微信小程序使用流程_第31张图片

结语:

到在这里为止,【快点查查】小程序就搭建完成啦。

你可能感兴趣的:(开发栈----微信小程序)