Question

我正在构建一个带有角度的SPA应用程序，我希望得到我的Angular服务＆＃34; WebService＆＃34;与网络工作者共享。目标是拥有一个＆＃34; WebService＆＃34;共享，以便我可以在后台（在Web工作者中）和前端（角度应用程序）中使用相同的服务。这可行吗？

其他信息：这里的想法是用于远程服务器上的数据同步，因此您可以让主应用程序使用＆＃34; online | offline＆＃34;模式，将数据保存到本地Web存储和/或远程服务器（使用＆＃34; WebService＆＃34;）和工作人员透明地使用相同的服务来同步数据......

你能展示一些在工作者中运行应用程序的代码吗？感谢您的反馈

Answer 1

是的，这是可能的。通过Web工作环境的一些攻击，您可以在Web worker中运行Angular，并拥有一个在前台和工作者Angular应用程序中使用的模块。这个答案需要和扩展another of my answers regarding unit testing

的代码

在主应用程序中，在工厂/服务中，您可以使用类似

的内容

var worker = new $window.Worker('worker.js');

然后在worker.js中，您可以修改全局范围，以便加载Angular：

// Angular needs a global window object
self.window = self;

// Skeleton properties to get Angular to load and bootstrap.
self.history = {};
self.document = {
  readyState: 'complete',
  querySelector: function() {},
  createElement: function() {
    return {
      pathname: '',
      setAttribute: function() {}
    }
  }
};

// Load Angular: must be on same domain as this script
self.importScripts('angular.js');

// Put angular on global scope
self.angular = window.angular;

// Standard angular module definitions
self.importScripts('worker-app.js');
self.importScripts('shared-module.js');

// No root element seems to work fine
self.angular.bootstrap(null, ['worker-app']);

您可以像其他任何人一样定义shared-module：

angular.module('shared-module', [])
.factory('SharedFactory', function() {
  return {
    myFunc: function() {
      return 'some-data';
    }
  };
});

在worker-app.js中，您可以使用共享模块

定义主应用

var workerApp = angular.module('worker-app', ['shared-module']);

将共享组件注入工作者应用程序的run回调中。

workerApp.run(function(SharedFactory, $window) {
  $window.onmessage = function(e) {
    var workerResult = SharedFactory.myFunc();
    $window.postMessage(workerResult);
  };
});

在前景Angular应用程序中，您可以通过常用脚本标记包含shared-module.js，并使用依赖注入来照常访问其组件

var foregroundApp = angular.module('forground-app', ['shared-module']);
foregroundApp.controller(function(SharedFactory, $scope) {
  // Use SharedFactory as needed
});

要确认，前台和工作人员应用中shared-module的实例不同。

Answer 2

是的，这是可能的，但请考虑您遇到的所有问题。您有两个不同的Angular应用程序，两个不同的上下文（意味着只能共享外部数据），并且在一个上下文（服务）中，绝对不需要99％的Angular功能

您没有描述您打算做什么，但我强烈建议您考虑其他选择。这里的标准方法是使用服务器并具有许多API端点，这些端点将作为您提到的服务而起作用。但是，如果您需要与服务进行持续通信，也许您可以使用Web套接字。

你可能应该用更多信息更新你的问题，因为在这一点上，我真的看不到让另一个应用程序在网络上运行只是为了能够使用服务的任何好处。

是否可以在Web worker中运行Angular？

2 个答案: