加载中 ...
首页 > 新闻资讯 > 经验心得 正文

小记一笔-微信小程序开发扫盲

2019-07-13 09:26:58 来源:沈阳小程序开发 作者:沈阳软件开发

序言:

今年的01月09号备受关注的微信小程序正式上线了,众多的互联网企业也相继发布了自家的小程序。趁着最近上班不是特别忙,自己闲来无事也跟着捣鼓了一个个人记账用的小程序:小记一笔用户可以方便,快捷的将自己平时的开销与收入记录下来,还有各种类型的统计,以便实时的准确掌握自己的财务状况目前此程序已正式上线,大家可以在微信中搜索“小记一笔”点击使用,下面是其中几张效果截图:

221710nqwoh09h36053o4w.png

准备工作:

1,要开发微信小程序,首先得有工具,可以先去微信公众平台官网(https://mp.weixin.qq.com/)注册帐号,登录到后台后,在最右上方点击“文档”切换到开发文档页面,里面有开发小程序的各种教程再点击“开发” - “工具” - “开发者工具”链接,可以选择下载相应的小程序开发工具,目前官方提供了 'windows64', 'WINDOWS32',“MAC “三种平台的开发工具,大家可以根据自己的实际情况选择相对应的工具即可。

XX 2,AppID:官方规定没有AppID,可以进行微信小程序的开发,也可以在真机上进行调试预览,但无法正式发布。因此,如果您只是开发自己的游戏,则无需申请appid,但如果您想正式启动自己的小程序供所有人使用,则需要申请AppID。在最近几天(03-27)微信小程序有另一个重大更新,为了增强小程序功能,扩展小程序使用场景,为个别开发者打开注册。在此之前,只有企业用户才能申请appid。申请时,您需要提供有关公司的相关信息。您需要使用公共帐户为腾讯提供指定的银行帐户,只需几美分即可获得认证。现在不需要,个人可以申请。 小程序在开放的个人开发者申请注册后,个人用户可以访问微信公共平台,扫描代码以验证身份,然后完成小程序帐户应用程序和代码开发。

221710ilgqnugu4gmglee5.png

开发环境介绍:

安装开发工具后,双击汇海将要求管理员扫描微信并同意进入。与大多数开发工具一样,以前的历史项目将列在汇海接口上。单击项目名称以进入上一个项目。单击“+”以创建新项目。

221711gjsnz4e22rntxyn3.png

如果你填写了appid,你可以在开发完成后发帖,填写项目名称,选择相应的目录,注意下面的复选框。此复选框表示为每个人提供了官方小程序目录结构,并且小程序需要配置文件和主页才能正常运行。建议您在练习时选中该复选框,以便在创建项目后运行该项目。否则,您需要手动创建所需的各种文件。当我第一次开始练习时,因为我没有检查它,我不知道我需要创建相应的配置文件,这导致项目运行各种错误并折腾了很长时间。

小程序包含五个部分:默认情况下,pages,utils,app.js,app.json和app.wxss。

1):pages文件夹主要存储小程序页面文件,每个文件夹是一个页面,每个页面包含.js,wxml,wxss,json四个文件:js文件是小程序脚本文件脚本事件用于处理接口,如使用我们熟悉的JS脚本编写数据,单击事件等。wxml是一个页面结构文件,用于组织页面上的元素,就像Html一样。json文件是配置文件。您只能配置此页面,例如此页面导航栏的文本,背景颜色等。wxss是一个样式表文件,类似于css,主要是为了使界面显示更加美观。

2):utils文件夹主要用于存储一些全局.js文件,如常用的JS网络请求方法和日期处理方法。

3):app.js文件是由系统方法处理的全局文件,也就是说,文件中声明的函数和数据可以在整个小程序中使用,例如存储后台接口API地址。

4):app.json文件是系统全局配置文件,必须包含在内。在此语句中,声明整个小程序页面,或声明小程序是否具有选项卡选项卡以及选项卡中的页面地址和文本。此配置文件是全局的。如果子页面的.json文件也配置了相同的内容,则子页面中的配置具有更高的优先级。

5):app.wxss文件是一个全局样式的美化文件,其优先级在子页面中wxss文件配置的样式中没有更高的优先级。

让我们谈谈在“小笔记”流程开发过程中遇到的一些问题。如果您正在开发自己的微信小程序,请注意:

1):小程序开发工具保存并编译快捷键为'ctrl + s',即写完代码后,直接按这两个键保存并重新生成。重要的是要注意写入多页中的代码。按下这两个键只会保存当前页面的代码,而不会保存所有页面的代码。因此,如果您有时无法实现所需的效果,请记住是否还有其他未保存的代码页。当我第一次开始写一个小笔记时,我经常发现页面代码没有保存,导致效果不会出现。需要每个人都要小心。

2):小程序缓存可以在开发工具中手动清除,但不能在真机上手动清除,所以如果你想在真机上手动清除它,你必须写一个清除事件,点击按钮,手动调用clear方法清除这是有点坑。

3):正式地说,如果小程序需要获取后台接口数据,则必须通过https协议。如果后台服务器不支持https协议并且想要在模拟器中获取数据,则只需在开发工具中设置它。单击开发工具左侧的“项目”按钮,然后选中右侧的“开发环境不验证请求域名和TLS版本”复选框,以便后台服务器可以返回数据而无需配置https协议。但是,如果要正式发布小程序并且后端服务器需要提供数据,则必须配置https协议。

4):我在开发练习中使用了豆瓣提供的测试界面。该接口的地址支持https协议。您还可以使用此界面测试何时调用后台数据。现在提供此接口地址供您参考:

正在发行的电影:https://api.douban.com/v2/movie/in_theaters

即将上映的电影:https://api.douban.com/v2/movie/coming_soon

top250上的电影:https://api.douban.com/v2/movie/top250

Real Machine Debug&在线&经验:

Real machine debugging: After developing the code, I want to preview it on the real machine. It's very simple, just take two steps to get it. After developing the code, click the "Project" button on the left side of the development tool, and then click the "Preview" button on the right side to generate a QR code. Scan the QR code with 微信 filled in during registration. The machine looks at the effect. It should be noted that, taking the above-mentioned view of Douban movie data as an example, there will be a problem that the data is not displayed on the real machine. At this time, it is only used to open the debug mode in the upper right corner of the mobile phone.

On-line: After the development of the code is also tested, this time we definitely want to officially release the 沈阳小程序 customization

ad.jpg

Line for more people to use, how to operate this time? First click the "Project" button on the left side of the development tool, then click the "Upload" button on the right side and click OK. Scan the QR code and agree to upload. At this time, you will be asked to fill in the version number and remarks of this upload. The upload button is uploaded to the back of the 微信 public platform, as shown below:

221711iii2787a8xxx9qjh.png

After uploading to the background, you can set it as the experience version, or you can submit the review directly. After filling in the corresponding review information and submitting the review, an audit version will appear. The review is passed. A publish button will appear on the right side. Only click this release. Button, your 小程序 is officially released online, then you can search in 微信. At present, a total of 6 versions have been submitted in a small note. Generally, Tencent audit staff will not review the weekend and review it on the working day. Normally, it will be reviewed and approved in the next two working days.

xx 经验:您可以在正式提交评论之前将上传的版本设置为试用版,这样非管理员也可以体验小程序来找出小程序的问题并及时纠正。在“用户身份” - 公共平台的“经验者”页面微信公共平台可以绑定到经验者微信,只有微信号码的经验者可以被绑定体验,并且上传的小程序版本必须设置为体验版本体验每个人都需要记住同时满足这两个条件。当我做了一个小笔记时,我只在开头绑定了经验者微信。我没有设置体验版本,这导致其他人在扫描QR码时没有经验许可。这需要明确。

后台服务器:

要提供后台界面,您必须拥有一台服务器。如今,每个人都可以选择的云服务器更为出名。腾讯云,阿里巴巴云和小机的选择是阿里巴巴云,它稳定而高效。通常,个人使用的云服务器的成本并不高。使用云服务器,您必须配置https协议和TLS版本以提供小程序的接口。如果您正在购买阿里云服务器,您可以直接使用官方提供的免费证书,官方安装教程,您可以参考其教程安装。以下提供了一个网站,您可以检测您的接口是否支持https协议,地址为:https://www.ssllabs.com/ssltest/index.html

结论:

小程序自发布以来,各种声音都很乐观,有各种各样的歌声。个人认为小程序就像几年前的微信公众号一样。当你第一次出来时并不乐观,但经过几年的发展,微信公众号现已渗透到各行各业。我相信在腾讯推广之后,小程序将被越来越多的人所接受。

最后,欢迎大家使用我的小程序,在微信中搜索“小笔记”,或扫描下面的二维码使用,有任何好的建议使用过程,请记得给我反馈,欢迎大家拍砖块。

221711tqy64i4n04fffi0w.jpg

“沈阳软件公司”的新闻页面文章、图片、音频、视频等稿件均为自媒体人、第三方机构发布或转载。如稿件涉及版权等问题,请与

我们联系删除或处理,客服QQ:55506560,稿件内容仅为传递更多信息之目的,不代表本网观点,亦不代表本网站赞同

其观点或证实其内容的真实性。