Angular在线/离线应用程序

乔什施罗德

我正在Angular中开发一个应用程序,该应用程序会调用多个Web服务。我想为应用程序开发一个脱机组件,以便它将某些Web服务结果缓存到LocalStorage并在连接脱机时使用它们。

该部分非常简单,而我最困扰的部分是当应用程序离线时如何进行逻辑分支。

这是我当前的流程:

  1. 用户加载页面
  2. Web服务调用照常发生
  3. $ http拦截器会查找404错误并标记一个$rootScope.isOnline布尔值标志以指示我们处于离线状态,否则,如果没有404,则我们会将其标记为在线

我希望我的代码以可维护的方式根据此标志分支。因此,我正在考虑使用依赖项注入来注入对网络服务进行调用的“在线”服务,或注入与LocalStorage结果(如果存在)对接的“离线”服务。

我可以基于在线/离线标志来进行依赖项注入吗,以便像这样注入正确的服务?

.factory('AuthService', ['$rootScope', '$injector', function($rootScope, $injector) {
    if($rootScope.isOnline) {
        return $injector.get('OnlineAuthService');
    }
    else {
        return $injector.get('OfflineAuthService');
    }
}])

.service('OnlineAuthService', ['$rootScope', '$http', '$location', 'serviceEndpoint', 'securityEndpoint', 'organisationId', function ($rootScope, $http, $location, serviceEndpoint, securityEndpoint, organisationId) {
    this.ensureSession = function (data) {
        // Do some connection to the webservice
    };
}])

.service('OfflineAuthService', ['$rootScope', function ($rootScope) {
    this.ensureSession = function (data) {
        // Do some LocalStorage stuff
    };
}])

AuthService.ensureSession(data);

我遇到的问题是,$rootScope.isOnline在第一次调用我的Web服务之前没有将其标记为脱机,因此即使连接处于脱机状态,依赖项注入$rootScope.isOnline也会查看并注入OnlineAuthService。

这是在Angular中开发在线/离线应用程序的正确方法还是有更好的方法?

dtabuenc

有很多方法可以做到这一点。看一下这个简化的插件:

http://plnkr.co/edit/CpiJaF480Mai050b63RC?p=preview

这里的想法是,您有服务返回的单例服务对象,但是随着联机/脱机更改,您将复制不同的函数方法。

还有许多其他方法可以执行此操作,例如添加间接级别(例如,创建可从中请求当前活动服务的服务)。

您不能简单地使用角度注入来完成此操作,因为工厂调用和服务调用都只会被调用一次,并且只会为服务名称注册一个实例(每次注入时都不会调用)。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

离线和在线管理iPhone应用程序

来自分类Dev

Nodejs套接字聊天应用程序:需要显示在线和离线状态

来自分类Dev

如何在Android应用程序中以在线和离线模式加载或检索网页?

来自分类Dev

如何使用基于REST的应用程序实现在线/离线功能?

来自分类Dev

Nodejs Socket聊天应用程序:需要显示在线和离线状态

来自分类Dev

在离线模式下运行 Angular6 应用程序

来自分类Dev

如何检测离线的Meteor Cordova应用程序,然后使用GroundDB临时存储数据直到恢复在线状态?

来自分类Dev

在Worklight应用程序中离线测试

来自分类Dev

离线地图应用程序开发Android

来自分类Dev

在Worklight应用程序中离线测试

来自分类Dev

在线Web应用程序的Phonegap

来自分类Dev

是否可以制作可离线运行的网络应用程序?

来自分类Dev

启动离线ClickOnce应用程序,然后等待退出

来自分类Dev

如何创建Rails 4离线Web应用程序?

来自分类Dev

仅在离线时使用应用程序缓存

来自分类Dev

在Android上离线运行Web应用程序

来自分类Dev

如何在离线应用程序中使用mysql?

来自分类Dev

如何离线本地开发Meteor.js应用程序?

来自分类Dev

安卓应用程序的离线词典数据库

来自分类Dev

Cordova-Like混合应用程序框架-但离线

来自分类Dev

为什么离线Web应用程序不起作用?

来自分类Dev

如何维护离线应用程序android的会话

来自分类Dev

哪些应用程序可用于离线阅读Python文档?

来自分类Dev

哪些应用程序可用于离线阅读Python文档?

来自分类Dev

启动离线ClickOnce应用程序,然后等待退出

来自分类Dev

如何在离线应用程序中使用mysql?

来自分类Dev

离线iPhone应用程序照片和数据下载问题

来自分类Dev

如何使用ReactJs实施离线应用程序?

来自分类Dev

如何离线验证Windows应用程序的产品密钥?

Related 相关文章

  1. 1

    离线和在线管理iPhone应用程序

  2. 2

    Nodejs套接字聊天应用程序:需要显示在线和离线状态

  3. 3

    如何在Android应用程序中以在线和离线模式加载或检索网页?

  4. 4

    如何使用基于REST的应用程序实现在线/离线功能?

  5. 5

    Nodejs Socket聊天应用程序:需要显示在线和离线状态

  6. 6

    在离线模式下运行 Angular6 应用程序

  7. 7

    如何检测离线的Meteor Cordova应用程序,然后使用GroundDB临时存储数据直到恢复在线状态?

  8. 8

    在Worklight应用程序中离线测试

  9. 9

    离线地图应用程序开发Android

  10. 10

    在Worklight应用程序中离线测试

  11. 11

    在线Web应用程序的Phonegap

  12. 12

    是否可以制作可离线运行的网络应用程序?

  13. 13

    启动离线ClickOnce应用程序,然后等待退出

  14. 14

    如何创建Rails 4离线Web应用程序?

  15. 15

    仅在离线时使用应用程序缓存

  16. 16

    在Android上离线运行Web应用程序

  17. 17

    如何在离线应用程序中使用mysql?

  18. 18

    如何离线本地开发Meteor.js应用程序?

  19. 19

    安卓应用程序的离线词典数据库

  20. 20

    Cordova-Like混合应用程序框架-但离线

  21. 21

    为什么离线Web应用程序不起作用?

  22. 22

    如何维护离线应用程序android的会话

  23. 23

    哪些应用程序可用于离线阅读Python文档?

  24. 24

    哪些应用程序可用于离线阅读Python文档?

  25. 25

    启动离线ClickOnce应用程序,然后等待退出

  26. 26

    如何在离线应用程序中使用mysql?

  27. 27

    离线iPhone应用程序照片和数据下载问题

  28. 28

    如何使用ReactJs实施离线应用程序?

  29. 29

    如何离线验证Windows应用程序的产品密钥?

热门标签

归档