插件窝 干货文章 Android App内如何全局捕获Vue项目未处理的Promise异常?

Android App内如何全局捕获Vue项目未处理的Promise异常?

error 捕获 处理 可以 594    来源:    2025-03-19

在Android应用中,如果你使用的是Vue.js框架开发的前端项目,并且希望全局捕获未处理的Promise异常,可以通过以下几种方式来实现:

1. 使用 window.onunhandledrejection 事件

Vue.js 运行在浏览器环境中,因此可以通过监听 window.onunhandledrejection 事件来捕获未处理的Promise异常。

window.onunhandledrejection = function(event) {
    console.error('Unhandled rejection (promise: ', event.promise, ', reason: ', event.reason, ').');
    // 你可以在这里将错误信息发送到服务器或进行其他处理
};

2. 使用 Vue.config.errorHandler

Vue.js 提供了一个全局的错误处理钩子 Vue.config.errorHandler,可以用来捕获组件渲染函数或观察者中的未捕获异常。虽然它主要用于捕获Vue组件中的错误,但也可以捕获一些与Promise相关的错误。

Vue.config.errorHandler = function (err, vm, info) {
    console.error('Error: ', err);
    console.error('Component: ', vm);
    console.error('Info: ', info);
    // 你可以在这里将错误信息发送到服务器或进行其他处理
};

3. 使用 Promise.prototype.catch

对于每个Promise,你可以在链式调用中添加 .catch 方法来捕获异常。虽然这不是全局捕获,但可以在关键的地方确保异常被处理。

somePromise
    .then(response => {
        // 处理响应
    })
    .catch(error => {
        console.error('Promise error: ', error);
        // 你可以在这里将错误信息发送到服务器或进行其他处理
    });

4. 使用第三方库

你还可以使用一些第三方库来帮助捕获未处理的Promise异常,例如 bluebirdzone.js

使用 bluebird

const Promise = require('bluebird');

Promise.onPossiblyUnhandledRejection(function(error) {
    console.error('Unhandled rejection: ', error);
    // 你可以在这里将错误信息发送到服务器或进行其他处理
});

使用 zone.js

import 'zone.js';

Zone.current.fork({
    onHandleError: function(parentZoneDelegate, currentZone, targetZone, error) {
        console.error('Unhandled error: ', error);
        // 你可以在这里将错误信息发送到服务器或进行其他处理
        return true; // 阻止错误继续传播
    }
}).run(() => {
    // 你的应用代码
});

5. 在Android WebView中捕获异常

如果你的Vue项目是运行在Android的WebView中,你还可以通过WebView的 WebChromeClientWebViewClient 来捕获JavaScript错误。

webView.setWebChromeClient(new WebChromeClient() {
    @Override
    public boolean onConsoleMessage(ConsoleMessage consoleMessage) {
        if (consoleMessage.messageLevel() == ConsoleMessage.MessageLevel.ERROR) {
            Log.e("WebView Error", consoleMessage.message());
            // 你可以在这里将错误信息发送到服务器或进行其他处理
        }
        return true;
    }
});

webView.setWebViewClient(new WebViewClient() {
    @Override
    public void onReceivedError(WebView view, WebResourceRequest request, WebResourceError error) {
        super.onReceivedError(view, request, error);
        Log.e("WebView Error", error.getDescription().toString());
        // 你可以在这里将错误信息发送到服务器或进行其他处理
    }
});

总结

通过以上几种方式,你可以在Android应用中全局捕获Vue项目中未处理的Promise异常。根据你的具体需求和应用场景,选择合适的方式来处理这些异常。