Node.js和Java实时BUG监控，如何开发自己**个小程序

菏泽炫佑科技 菏泽炫佑小程序开发 菏泽炫佑app制作 炫佑科技

Node.js和Java实时BUG监控，如何开发自己**个小程序

0 前言

我*近的工作重点是小程序，开发几个小程序。 对小程序开发的流程和相关技术比较熟悉。 在开发过程中，我也总结了一些经验，学到了一些小程序文档中没有的东西。 ，踩过一些陷阱。 于是我想到写一篇文章来记录一下，用它来整理一下小程序开发的相关知识，以供日后参考，也作为自己工作的一个阶段性总结。 同时，我也希望通过文章，能够结交更多的朋友，多交流，互相学习，共同进步。 如果文章有什么不对的地方，请指出并给我一些建议。

1 微信小程序的基础知识和概念

微信小程序开发入门非常简单。 只需阅读官方文档即可获得简单的小程序教程。 如何申请小程序账号，如何开发你的**小程序，如何发布，这一系列关于hello world操作的官方文档提供了分步说明。 小程序开发的每一步都包含在提供的能力文档中。 个人觉得开发小程序时候，没事的时候就应该看看文档，因为小程序更新很快，我们可能会错过一些小能力，所以多看文档。

1.1 简单说一下目录结构和app.json

文件目录结构非常灵活

我们先看一下小程序项目的文件目录结构

除了app.json必须位于根目录外，其他文件是可选的，可以删除。 而页面文件可以放在哪里，只需要在app.json中的pages中进行配置即可。 可以说是非常灵活了。 您还可以将多个页面放在同一个文件夹中（我相信您不会这样做，何必这么麻烦自己）。

接下来对各个文件进行简单介绍：

全局配置文件app.json

对于小程序项目来说，*重要的文件就是app.json，它也是开发工具用来识别文件夹是否是小程序项目的标识符。 使用开发工具创建项目时，如果选择空文件夹，则会创建一个新项目。 如果是有文件的文件夹，则会查看该文件夹中是否有app.jon文件。 如果有，就会认为这是一个小程序项目，并打开该项目。 如果文件夹文件中没有app.json，会提示无法创建项目。

app.json 必须放在项目的根目录下。 是小程序项目的全局配置文件。 小程序代码包准备好启动后（下面会详细介绍小程序从用户点击打开小程序到销毁小程序的整个过程），会读取app.json文件首先要进行小程序的初始化，比如初始化。 整个小程序的大纲样式，获取首页地址等。

其实小程序是微信提供的一个容器。 每个页面都在这个容器中加载、运行和销毁。

下面介绍小程序的全局配置选项：

注意：

    "pages": [
        "pages/index/index",
        "pages/log/log"
    ]
复制代码

在app.json中，必须配置pages选项。 该配置项注册了小程序所有页面的地址，其中每一项为页面的路径+文件名。 配置的字符串实际上是每个页面的wxml路径，不带.wxml后缀。 因为框架会自动在路径中寻找.json、.js、.wxml、.wxss这四个文件进行集成。 这意味着.json、.js、.wxss这三个文件的文件名必须与.wxml一致，否则不会生效。 因此一个页面必须至少有一个 .wxml 文件。

总结：

  "window":{
    "enablePullDownRefresh": ture,
    "navigationStyle": "custom"
  }
复制代码

该配置项用于配置小程序的全局外观风格。 具体请参考文档。这里重点讲两个比较实用的：

//去掉默认的导航栏，轻松实现全面屏
"navigationStyle": "custom" , 
//开启自带的下拉刷新，减少自己写样式
"enablePullDownRefresh": ture, 
复制代码

这个选项可以让我们轻松实现导航栏标签效果，但是有一个缺点就是跳转可操作性很低。 即每个选项卡只能跳转到当前小程序页面，而不能跳转到其他小程序。 如果需要跳转到其他小程序，就需要自己封装一个组件。

这是网络请求超时。 可以为不同类型的请求设置超时时间，比如wx.、wx.等，其实很多时候我们都忽略了这个选项。 小程序默认的超时时间是60s，但是我们应该手动设置一个较低的值，因为我们的接口一般会在10s内完成请求（如果超过10s，那么就到了你优化的时候了）。 所以如果网络或者服务器出现问题，就会要求用户等待60秒，*终还是会失败。 这对于用户来说是非常不友好的。 *好提前告诉用户现在出现问题，请稍后重试。

前段时间，由于公司服务器网关的一个小问题，导致部分请求无法连接，出现大量连接超时的情况。 通过之前添加的错误信息收集插件（这是性能优化，下面讨论），我们看到很多接口返回超时60s。 让用户等待60秒仍然失败是不友好的。 因此，一般将此超时时间设置为15s-30s比较好。

是否开启调试功能。 开启后可以查看更多调试信息，方便问题定位。 您可以考虑在开发阶段开启它。

这个是和插件结合使用的，因为微信小程序插件有很大的局限性，插件中提供的API也很有限。 wx.login 和 wx. 不能在插件中使用。 如果您需要获取用户信息并进行支付，则必须通过插件。 所提供的功能也已实现。 当您的小程序下的插件启用了插件功能时，该选项必须设置为true。

小程序插件必须安装在微信小程序中，并且一个小程序一个插件。 当您的小程序启用的插件启用了插件功能时，该选项必须设置为true。

    "plugins": {
        "myPlugin": {
            "version": "1.0.0",
            "provider": "wxidxxxxxxxxxxxxxxxx"
        }
    }
复制代码

小程序使用插件时，必须在这里声明并导入。小程序本身打开的小程序不能在小程序本身使用。

    "navigateToMiniProgramAppIdList": [
        "wxe5f52902cf4de896"
    ]
复制代码

以前小程序只要关联公众号就可以互相跳转。 现在微信做出了限制。 这里需要配置需要跳转的小程序。 上限为 10，并且必须对它们进行硬编码。 不支持配置。 。 因此，当小程序跳转到其他小程序时，必须配置此项，否则无法跳转。

  "usingComponents": {
    "hello-component": "plugin://myPlugin/hello-component"
  }
复制代码

在使用自定义组件或者插件提供的组件之前，必须先在这里声明它们。

1.2小程序启动及生命周期

下面讲一下小程序从用户点击打开到销毁的整个过程。 用图片更清晰，所以特意画了一张流程图：

小程序启动时有两种情况，一种是“冷启动”，一种是“热启动”。 如果用户已经打开过某个小程序，然后在一定时间内再次打开小程序，此时不需要重新启动它。 只需将后台小程序切换到前台即可。 这个过程是热启动； 冷启动是指用户**次打开小程序或者被微信主动销毁后再次打开时，需要重新加载并启动小程序。

上面的流程图包含了所有内容，但毕竟文字有限，所以我们就详细说一下几点。

小程序会先检测是否有本地代码包，然后使用本地代码包启动小程序，然后异步检测远程版本。 这就是小程序的离线能力。 与H5相比，这是一个优势，可以加快小程序启动速度。 当本地有小程序代码包时，会异步请求远端是否有*新版本。 有些是下载到本地的开发微信小程序网址，但本次启动仍会使用之前的代码。 所以当我们发布*新版本时，用户需要冷启动两次才能使用*新版本。 如果希望用户能够冷启动使用*新版本，可以使用小程序提供的版本更新API进行更新。 代码如下。 只要在app.js的函数中添加如下代码，每次小程序更新时都会提示用户更新小程序。 不过，每次更新这个提示Node.js和Java实时BUG监控，如何开发自己**个小程序，都会在一定程度上影响用户体验。 如果结合后端配置，每次进来读取配置，就可以根据需要更新版本。 例如，如果必须由用户更新后才能使用，则使用强制更新。 对于某些小版本，无需使用此强制更新。

    if (wx.canIUse('getUpdateManager')) {
        //检测是否有版本更新
        var updateManager = wx.getUpdateManager()
        updateManager.onCheckForUpdate(function (res) {
            // 请求完新版本信息的回调，有更新
            if (res.hasUpdate) {
                wx.showLoading({
                    title: '检测到新版本',
                })
            }
        })
        updateManager.onUpdateReady(function () {
            wx.hideLoading();
            wx.showModal({
                title: '更新提示',
                content: '新版本已经准备好，是否重启应用？',
                success: function (res) {
                    if (res.confirm) {
                        //清楚本地缓存
                        try {
                            wx.clearStorageSync()
                        } catch (e) {
                            // Do something when catch error
                        }
                        // 新的版本已经下载好，调用 applyUpdate 应用新版本并重启
                        updateManager.applyUpdate()
                    }
                }
            })
        })
        updateManager.onUpdateFailed(function () {
            // 新的版本下载失败
            console.log('新版本下载失败');
        })
    }
复制代码

1.3开发工具

关于小程序开发工具，没有一个让开发满意的工具，至少我不满意，哈哈哈！ 微信提供的微信开发工具。 除了编译器外，其他都很好。 但由于开发工具、ios、以及运行小程序的三个平台的内核不同。 所以，有时候开发工具有问题，但真机就有问题，尤其是样式。 大多数问题可以通过在开发工具中设置上传代码时的自动完成样式来解决。另外，微信开发工具提供了真机调试功能，对于真机调试非常方便。

还可以自定义编译条件

可以模拟任意场景值、设置页面参数、模拟更新等。基本满足所有调试。 然而，仍然存在一些影响。 开发工具和真机可能有所不同，所以还是需要在真机上确认。

1.4 测试-审核-上线事宜

服务器域名的合法域名每月只能修改五次。 因此，您不应该在每次请求新域名时都添加它。 开发阶段，在微信开发工具上勾选不验证合法域名，并开启真机调试模式。 然后您就可以请求任何域名甚至IP地址，而无需先配置合法域名。 开发完成后，一次性配置所有合法域名，在微信开发工具上取消合法域名不验证，关闭真机调试模式，然后开始测试。

使用试用版+线上环境的界面，和线上环境一模一样，所以发布之前先用试用版+线上环境过一遍。 如果没有问题的话，发布后也不会出现问题。

只有发布在线版小程序二维码并调用小程序二维码生成接口才能成功返回二维码。 而且二维码识别是在线版本，未发布的小程序无法生成二维码。

在线版本具有版本回滚功能。 这里有一个陷阱。 版本回滚后，返回的版本需要重新审核后才能发布。

设置试用版时还可以设置指定的路径和参数，非常方便测试。

待续……。

炫佑科技专注互联网开发小程序开发-app开发-软件开发-网站制作等