Question

所以有一点背景知识，我有这个项目并正在开发第2版，其中涉及添加离线功能。我被困在下面的堆栈中，因为现在改变它将涉及很多开销：

Laravel API MYSQL 离子

我听说过很多关于使用Pouch / CouchDB进行同步的问题，但不幸的是我无法改变一切来使用这个堆栈。

我决定在我有限的AngularJS / JS知识中使用HTTP Interceptor来拦截所有请求，检查它是否是POST / PUT请求，检查设备是否在线/离线并将数据保存在本地存储中或携带随着请求。这是问题的开始。

这是我的APIInterceptor：

App.factory('APIInterceptor', function ($q) {

    return {
        request: function (config) {

            if(config.method == 'POST' || config.method == 'PUT')
            {
                //Add data to localstorage

                //Exit without actually sending the request to the server.
                return $q.reject();
            }

            return config || $q.when(config);
        }
    };
});

正如您所看到的，我正在返回.reject()，但我需要的是模仿API响应并传回我的服务，就像请求已成功处理一样，以便我的应用可以正常进行。在数据存储在localstorage之后，基本上返回成功，状态代码200。

关于我如何做到这一点的任何建议？

Answer 1

创建一个管理所有http请求并最终返回数据库数据的服务会不会更容易？

Interceptors

出于全局错误处理，身份验证或任何类型的目的请求或的同步或异步预处理对响应进行后处理，希望能够进行拦截在将它们交给服务器和响应之前请求它们被移交给发起这些的应用程序代码要求。拦截器利用promise API来实现这一目标需要同步和异步预处理。

我想您不需要检查设备是否在线/离线，因为您在拦截器中获得了requestError。

由于你想在实际发生之前拦截通信，你可以使用这种拦截器：

.factory('APIInterceptor', function APIInterceptor($q) {
    return {
            request: function (config) {
                if(config.method == 'POST' || config.method == 'PUT')
                {
                    return $q.reject({status: 503, config: config});
                }
                return config || $q.when(config);
            },

            // response: function (httpResponse)
            // {
            //     return httpResponse || $q.when(httpResponse);
            // },

            responseError: function (rejection)
            {
                if (rejection.status === 503) {
                    rejection.status = 200;
                    rejection.statusText = "OK";
                    rejection.data = {};
                    return $q.resolve(rejection);
                }
                return $q.reject(rejection);
            }
        };
});

如果请求是 POST 或 PUT ，您可以拒绝添加状态并传递配置：

if(config.method == 'POST' || config.method == 'PUT')
{
    return $q.reject({status: 503, config: config});
}

responseError将被处理现在，您可以检查您的状态并解决承诺，以便$http调用不会出现异常：

if (rejection.status === 503) {
    rejection.status = 200;
    rejection.statusText = "OK";
    rejection.data = {};
    return $q.resolve(rejection);
}

我添加了一个data对象原因，这就是你的http调用可能期望的内容。基本上，我们在这里所做的是尝试重新创造一个正确的反应。

使用拦截器处理Ionic App中的离线数据

1 个答案: