0

我正在开发一个角度应用程序,我想在其中集成OfflineJS功能。我创建了一个通用服务,用于从 API 获取和发布数据,以及每个模块的特定服务。这是代码

    app.service('MethodProvider', function ($http) {
    var self = this;
    self.get = function (url) {
        var obj = {
            url: url,
            method: 'GET',
            async: true,
            headers: {
                'Content-Type': 'application/json'
            }
        };
        return $http(obj);
    };
    self.post = function (url, data) {
        var obj = {
            url: url,
            method: 'POST',
            async: true,
            data: JSON.stringify(data),
            headers: {
                'Content-Type': 'application/json'
            }
        };
        return $http(obj);
    };
    self.put = function (url, data) {
        var obj = {
            url: url,
            method: 'PUT',
            async: true,
            headers: {
                'Content-Type': 'application/json'
            }
        };

        if (typeof data != 'undefined' && data != null) {
            obj.data = JSON.stringify(data);
        }
        return $http(obj);
    };
    self.delete = function (url) {
        var obj = {
            url: url,
            method: 'POST',
            async: true,
            headers: {
                'Content-Type': 'application/json'
            }
        };
        return $http(obj);
    };
    return self;
});

以及像用户模块这样的特定模块服务

 app.service('UserSrvc', function (MethodProvider) {
    var self = this;
    self.create = function (data) {
        var url = apiUrl + '/user/add';
        return MethodProvider.post(url, data);
    };
    return self;
});

如何在此代码中集成OfflineJS,我想在网络连接断开时拦截 HTTP 请求,并在网络连接启动时恢复请求。我已经研究过这个例子,但无法将它整合到角度需要一个例子来开始。

4

1 回答 1

0

希望这对未来的用户有所帮助:Offlinejs 将Offline对象添加到全局窗口对象。

checkOnLoadOfflinejs 本身不会触发 check() (如果选项设置为 true ,它会触发一次)。
您可以Offline.check()在向服务器发出 ajax 请求并检查连接之前调用。
如果您的应用程序是 xhr 密集型的,您也可以进行轮询。

var run = function(){ 
    if(Offline.state=="up")
            Offline.check();
    };
setInterval(run, 20000); // check after 20sec
Offline.on('down',function(){ /**code to handle network down*/ });

正如@Adnan Umer 所指出的,您需要设置Offline.options = { interceptRequests: true, requests: true } 拦截失败的请求并在连接恢复后重试。这里需要注意的是,Offline 重新发送的请求将超出 Angular 的范围,因此,所有GET请求都将返回 nothing。这实际上很好,通常是用户发起获取请求。

Offline.options = {
    checks: {xhr: {url: "put_url_to_check_status_of_your_server"}}
}

默认情况下,Offlinejs 检查favicon.ico.

于 2016-10-10T07:44:08.977 回答