开发一个钉钉小程序和微信小程序签到APP的具体学习报告

【我想说的话：开发这个东西的初衷是为了想将所学融入日常生活中，恰好学长开发了一个i重科，我想挑战一下结合人工智能的签到app会是什么样的体验。在这个过程中我面临了很多困难，一度怀疑自己，但是现在我还是继续坚持下去。
从头来过，记录自己的学习过程与你们分享。】

选择开发工具HbuilderX：

基于自己的职业规划和极差的基本功，我询问前辈的经验之后，最终选择了这个开发工具，用其中的uni-app模板进行开发。恰好疫情推动了全国大学生对于钉钉的使用，在这种良好的开发环境下，我决定将这个项目的开发重点从app转为钉钉小程序。【钉钉小程序19-6月运营】

必备学习进程：

开发前我学习过前端，有一定的基础，不过没有学习过框架，所以我是跟视频学习，因为要调用阿里云的声纹识别的API，所以我去B站对黑马程序员《Ajax从零入门到精通（part 1）》进行了一段时间的学习。
然后在DCloud官方的文档中开始认真阅读uni-app的介绍

项目流程：

一、测试环境(学习工具：上面推荐的文档+视频)开发工具默认没有运行到钉钉小程序，所以我要去配置钉钉小程序，不知道能不能成功。【这个没法教，得自己慢慢摸索，实在不懂可以加我好友QQ：1109386911】

• 按照官方推荐的视频课程安装微信小程序和支付宝小程序的开发者工具，并完成调试。【ps：原版视频需要500rmb的费用，还好我找到了百度网盘资源，有需要的同志可以联系我。一开始运行到不同小程序上的时候，支付宝不会自动显示，需要手动复制开发工具控制台上的地址，在支付宝小程序里面打开项目，这一点还是比较坑的！】
  

• 阅读钉钉开发者平台的开发文档
  【阅读完我明白了创建一个可以应用于整个学校的小程序，只能创建第三方企业级应用，而且还得购买钉钉云，而钉钉云的价格在500/月左右，只有7天的免费体验时间，所以我只能在我的项目整体完成之后再上架7天保证答辩当天能运行】

这是钉钉中企业内部应用小程序创建成功的界面：
微信小程序和支付宝钉钉小程序运行测试成功的抓图：

二、慢慢学习开发知识

• app启动图配置——Give up
  直接在配置中选取一张.png图片是不行的，官方的办法：官方社区方案，实践遇到的问题：我的sdk没有tools文件夹。百度了一会，没有头绪，暂时放弃。
• 跨域问题
  用chorm浏览器运行时控制台会提示存在这样的跨域问题
  
  Dcloud社区里面的前辈解决了我的疑问：hbuilderx内置浏览器没有跨域问题但是chrome有CORS问题 ，hx内置浏览器是特别改造取消跨域的，mac的hx在2.5.10版也支持内置浏览器跨域了。
• 页面跳转问题
  写的navigator语句正确，可页面就是无法跳转，百度过后才找到了问题所在，特地总结如下：出现这种情况可能有三种问题：
  1.跳转的页面没有在app.json页面中注册。如果是这种问题会在控制台弹出错误，留意控制台即可；
  2.跳转的路径不正确。初学时不太注意会出现这种问题，这种问题同样会在控制台弹出错误。
  3.跳转的页面位于TabBar中。这种情况不会在控制台弹出错误，需要自己去检查，解决的办法是将navigator改成switchtab即可。

三、开始页面的初步设计

• 轮播图和tabbar——手机app的必备元素
  

• 动态渲染页面的数据——在Eclips用servlet文件连接MySql，最后将servlet放在申请的新浪云上，新浪云的URL（域名）供前端调用生成页面数据。
  1）申请新浪云，详情见黑马程序员《Ajax从零入门到精通（part 1）》中视频教程。
  2）接下来的技术查看Servlet 数据库访问
  3）个人遇到的所有小问题
  查看电脑中Mysql的版本：利用navicat连接mysql的客户端工具可以查看
  连接之后右键——详细信息
  
  
  4）小测试最后的结果：
  
  5）在腾讯云上申请了一个域名cqust.xyz，到时候将sevlet文件放上去，目前一年只要一元
  

四：登录页面的设计

理想目标：

小笔记：

属性	实验发现	定义	代码提示中的定义有
value	设置的内容不会出现在页面上	输入框的初始内容 可常用
type	也有密码邮件等类型，为什么要分那么细：在提交表单时，会自动验证 input域的值。	input 的类型 可常用	digit/idcard/number/text
password	意思是设置输入可不可见	是否是密码类型 可常用	false/true
placeholder		输入框为空时占位符 可常用
placeholder-style		指定 placeholder 的样式
placeholder-class	placeholder-style适合设置颜色，placeholder-class适合设置字体。但是你没定义盒子的长宽高是不会生效的	指定 placeholder 的样式类
disabled	说明性的文档用处大	是否禁用	true/false
maxlength	比如在一些输入框比较靠下的情况下，可用这个属性将输入框上移	最大输入长度，设置为 -1 的时候不限制最大长度 可常用
focus	是否使用出现的键盘不一样	能否聚焦以及软键盘是否跟随弹出 可常用	true/false
confirm-type	这个我输入合法值也无法生效 想用不能用	设置键盘右下角按钮的文字，仅在 type=“text” 时生效。
confirm-hold	加快用户注册或者登录的速度	点击键盘右下角按钮时是否保持键盘不收起 =可常用=
hold-keyboard	加快用户注册或者登录的速度，但是只能在微信小程序里面使用	focus时，点击页面的时候不收起键盘 想用不能都用
cursor	我就用默认的就好	指定focus时的光标位置
selection-start		光标起始位置，自动聚集时有效，需与selection-end搭配使用
selection-end		光标结束位置，自动聚集时有效，需与selection-start搭配使用
adjust-position		键盘弹起时，是否自动上推页面

五、通过观察简单的第三方接口（比如天气预报），再上手声纹识别这样流程比较复杂的接口

1、购买天气预报API——科大讯飞
支付成功之后，进入管控中心会看到购买信息：


2、阅读完 简单身份认知 技术信息
结果发现这个第三方的天气预报API目前不支持 js 前端直接调用，只支持 java，c#，php，python，oc。那证明声纹识别也只能使用后台开发语言进行调用。
经过实践调用声纹识别的第一个API 发现确实是这种情况：

结论：所以接下来要学习如何用java调用API了

六、学习如何用java调用天气预报接口并将数据全部返回给前端页面进行挑选。