Javascript SPA:将后端管理与客户端分离

Javascript SPA:将后端管理与客户端分离,javascript,single-page-application,durandal,durandal-2.0,Javascript,Single Page Application,Durandal,Durandal 2.0,我正在用DurandalJS建造一个水疗中心,它位于app.example.com。API托管在API.example.com上。我们现在计划为自己添加后端管理,以忽略我们的客户。我们每个人都有一个帐户,我们将能够管理我们的客户的东西 我们想弄清楚的是在哪里托管后端 如果我们将其保留在app子域中,我们只需在现有应用程序中添加一个新角色(admin),但如果我们的凭据以某种方式泄漏,这将允许普通用户在后端登录 如果我们将现有应用程序克隆到admin.example.com,我们将始终担心代码是否

我正在用DurandalJS建造一个水疗中心,它位于
app.example.com
。API托管在
API.example.com
上。我们现在计划为自己添加后端管理,以忽略我们的客户。我们每个人都有一个帐户,我们将能够管理我们的客户的东西

我们想弄清楚的是在哪里托管后端

  • 如果我们将其保留在
    app
    子域中,我们只需在现有应用程序中添加一个新角色(admin),但如果我们的凭据以某种方式泄漏,这将允许普通用户在后端登录

  • 如果我们将现有应用程序克隆到
    admin.example.com
    ,我们将始终担心代码是否同步,但这样会更安全,因为
    admin
    子域将对公众关闭,管理员的登录将需要一组不同的api和私钥


  • 我们应该如何处理?如果我们使用#2,是否有更好的方法在两个应用程序之间共享代码而不产生额外的麻烦?

    我认为您需要区分创建指向同一应用程序的子域还是创建两个单独的应用程序

    我认为,为了给出完整的答案,我们需要首先确定应用程序的一些重要方面:

    • 您的身份验证和身份验证是如何实现的?这是温泉的一部分吗?是在装温泉之前吗

    • 应用程序的代码是否与管理员应用程序的代码100%相同?你说保持同步是什么意思

    假设我可以给你一些答案,可能不准确,但可以帮助你:

    子域很酷,您可以预先获得一些信息(用户试图访问哪个子域),这样您就可以轻松地限定请求,并在实际访问应用程序服务器之前确定一些内容。但是,我不认为这里的问题是应用程序应该位于哪个子域中

    您需要回答的第一件事是如何使用户从管理员和普通用户中脱颖而出。显然,您不应该依赖子域来实现这一点。这种逻辑可能存在于基于某些数据(可能来自数据库)的登录过程中

    您需要了解的下一件事是应用程序如何根据角色进行更改:

    • 如果您的应用程序将是100%相同(相同的代码),并且将根据记录的角色进行动态响应,那么您实际上不需要任何特殊的东西。您所需要的只是确保您的应用程序足够安全,不允许普通用户做管理工作

      • 您可以使用子域和一些额外的逻辑,这样只有管理员才能使用子域。然而,这只是一些“糖”的安全,使一些分离。应用程序仍然需要一致地管理角色和权限
      -

    • 如果应用程序未使用相同的代码库,则需要在web应用程序中的日志记录过程中确定哪个角色正在登录,以及哪个SPA应用程序应发送到浏览器。为此,您需要一个单独的日志页面,或者有一个模块化的SPA,可以动态加载模块

      • 您可能希望在应用程序(管理和面向用户的应用程序)之间重用一些代码。重用部分代码库会遇到一些挑战
      • 您不需要担心用户应用程序中的权限和角色,但您需要一个安全的日志记录过程

    (只是提醒一下)在任何情况下,SPA都应该包含管理角色和权限的逻辑,以确保一致性并避免用户混淆。主要的安全管理在API中。在任何具有身份验证和授权的SPA中,目标都是拥有一个安全的API。

    我个人喜欢第二种方法来处理不同的子域。 复制代码库并不是真正必要的,因为您可以利用RequireJS提供的酷特性将别名映射到您的模块。这里的重要性在于,通过将业务逻辑提取到模块中,您可以为不同的实现提供服务

    我创建了一个名为GitHub Repo的小型GitHub Repo,详细解释您将如何进行

    总的想法是:

  • 保持相同的视图模型/视图
  • 提取业务逻辑(无论如何都应按照适当的SoC进行)
  • 创建2个main.js实现(前端/后端)
  • 相应的main.js设置会将RequireJS映射到viewmodels请求的别名 然后交付具体的模块实现

  • 以下是我当前的应用程序结构:

    • /_css/
    • /_img/
    • /_js/
      • /应用程序/
      • /解放党/
    • index.html
    在阅读了这两个答案后,我最终将应用程序分开,同时将它们放在同一屋檐下

    • /_css/
    • /_img/
    • /_js/
      • /应用程序/
      • /backend/
      • /解放党/
    • 索引app.html
    • 索引backend.html
    这使得管理和切换应用程序变得更加简单。我不必担心保持css、图像和库的同步,也不必为后端创建新的git repo

    我还更新了我的
    Gruntfile.js
    ,为应用程序和后端添加了一个单独的构建过程。因此,本地应用程序将位于相同的
    /\u js
    文件夹下,但在服务器上,它们将位于不同的域上

    我应该更具体地回答我的问题,并说明我的问题更多的是如何在本地管理这两个应用程序,而不是在服务器上

    谢谢你的回答