关于html5:最佳实践小程序重点场景异常处理一

0次阅读

共计 1784 个字符,预计需要花费 5 分钟才能阅读完成。

一、背景

小程序在运行过程中难免会遇到一些异常情况,将会给用户带来不好的体验。针对于此,咱们总结出一些常见的 case,总结成最佳实际,帮忙开发者正当解决异样,晋升小程序体验。

二、最佳实际

场景一:用户回绝受权定位,二次进入页面不敌对

一些小程序须要在进入首屏的时候,需向用户获取地理位置权限,然而若用户一旦误点击【回绝】按钮,那么下次再次进入该小程序时,页面间接显示无奈定位。那么对于个别用户,很难晓得如何再次开启权限,并因而无奈应用小程序,给用户造成了不好的体验。

首次进入小程序时,会弹出获取地理位置信息的对话框,用户点击回绝。

再次进入小程序时,页面会如右图所示,整个页面无内容。

那咱们如何解决这个场景的问题呢?这里提出一种优化倡议:

  1. 在用户进入页面时,对以后用户的权限进行判断;
  2. 若用户没有对应权限,则弹出设置页面来疏导用户开启权限。
Page({onLoad() {
        swan.authorize({
            scope: 'scope.userLocation',
            fail(err) {
                // 更多错误码请查看官网文档:https://smartprogram.baidu.com/docs/develop/api/open/authorize_swan-authorize/
                // 以 10003 用户回绝受权为例
                if (err.errCode === 10003) {
                   swan.openSetting({success(res) {
                            // 弹出开启异样提醒 toast
                            swan.showToast({
                                title: '请点击权限设置 -> 地理位置 开启地理位置权限',
                                icon: 'none'
                            });
                        },
                });
            }
       });
    }
});

这样用户在进入界面中,能够收到敌对的提醒,通过从新开启权限应用该性能。

场景二:获取用户信息及异样解决

在业务开发中,常常会有获取用户信息、地址等需要;咱们发现有些开发者,仍旧在应用以下两个废除的 api,这是咱们不提倡的。

官网文档中提供了一种通过 button 调用的形式,具体应用形式如下:

<!-- index.swan -->
<button type="primary" class="middle-btn" open-type="getUserInfo" bindgetUserInfo="getUserInfo"> 获取用户信息 </button>
<button type="primary" class="middle-btn" open-type="openSetting" bindchooseAddress="chooseAddress"> 获取用户地址 </button> 
// index.js
Page({getUserInfo(e) {console.log('用户信息:', e);
    },
    chooseAddress(e) {console.log('收货地址:', e);
    }
});

用 button 的形式来调用 API 有一系列益处:

  • 在获取信息前,主动进行用户鉴权解决。
  • 应用形式简略,更易于保护。

同时,为了更好的解决调用 api 的谬误场景,下方列出了可能会呈现的谬误,以及对应的解决方案:

开发者能够在谬误回调中,通过错误码来解决不同类别的谬误。

场景三:领取及异样解决

在很多的小程序中,须要接入领取性能,官网上提供了百度收银台这样的性能,能够间接接入业务,具体的应用形式见:

https://smartprogram.baidu.com/docs/introduction/pay-intro/

在开发中,咱们会应用 swan.requestPolymerPayment 这个 api 来关上百度收银台。这个形式有两个益处:

  • 它聚合了多种支流的领取形式,包含:百度钱包、微信、支付宝、网银等,不便开发者一站式疾速接入多种领取渠道。
  • 就是全流程的领取环节的谬误都会被收集到,这样有利于对整顿领取闭环的监控。

官网地址见:https://smartprogram.baidu.com/docs/develop/api/open/payment_swan-requestPolymerPayment/

所以,针对于应用了这种形式来实现领取性能的小程序,咱们能够获取更残缺的与领取相干的错误信息。

以下列出了调用 swan.requestPolymerPayment 会返回的错误码和错误信息:

开发者能够在谬误回调中,通过错误码来解决不同类别的谬误,给予用户更敌对的体验。

正文完
 0