【最佳实践】小程序重点场景异常处理（一）

1、背景

小程序在运行过程当中不免会遇到一些异常状况，将会给用户带来很差的体验。针对于此，咱们总结出一些常见的case，总结成最佳实践，帮助开发者合理处理异常，提高小程序体验。javascript

2、最佳实践

场景一：用户拒绝受权定位，二次进入页面不友好

一些小程序须要在进入首屏的时候，需向用户获取地理位置权限，可是若用户一旦误点击【拒绝】按钮，那么下次再次进入该小程序时，页面直接显示没法定位。那么对于通常用户，很难知道如何再次开启权限，并所以没法使用小程序，给用户形成了很差的体验。html

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

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

那咱们如何解决这个场景的问题呢？这里提出一种优化建议：api

在用户进入页面时，对当前用户的权限进行判断；
若用户没有对应权限，则弹出设置页面来引导用户开启权限。

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，这是咱们不提倡的。微信

api	功能	官网地址
swan.chooseAddress网络	获取收货地址	https://smartprogram.baidu.com/docs/develop/api/open/chooseaddress_swan-chooseAddress/
swan.getUserInfo	获取用户信息	https://smartprogram.baidu.com/docs/develop/api/open/userinfo_swan-getUserInfo/

官方文档中提供了一种经过 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有一系列好处：ui

在获取信息前，自动进行用户鉴权处理。
使用方式简单，更易于维护。

同时，为了更好的处理调用api的错误场景，下方列出了可能会出现的错误，以及对应的解决方案：

API	errcode	errMessage	解决方案
getUserInfo	10005	system deny	没有权限，需申请权限后调用
	402	访问控制校验失败	游客帐号登陆，调用login解决
	10001	internal error	小程序服务器异常，可重试一次解决
chooseAddress	1003	close failed	执行异常，可重试一次解决
	10001	Internal error	小程序不在前台，禁止调用ui相关api。开发者调用前须要判断小程序先后台状态。
	10002	网络异常

开发者能够在错误回调中，经过错误码来处理不一样类别的错误。

场景三：支付及异常处理

在不少的小程序中，须要接入支付功能，官网上提供了百度收银台这样的功能，能够直接接入业务，具体的使用方式见：

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

在开发中，咱们会使用 swan.requestPolymerPayment 这个 api 来打开百度收银台。这个方式有两个好处：

它聚合了多种主流的支付方式，包括：百度钱包、微信、支付宝、网银等，方便开发者一站式快速接入多种支付渠道。
就是全流程的支付环节的错误都会被收集到，这样有利于对整理支付闭环的监控。

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

因此，针对于使用了这种方式来实现支付功能的小程序，咱们能够获取更完整的与支付相关的错误信息。

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

api	errorCode	errMsg
requestPolymerPayment	0	支付成功
	1	支付中
	2	支付取消
	3	支付状态不支持
	4	支付token不合法
	5	支付登陆错误
	6	支付错误