将落地页和单页面应用程序拆分是一个好主意吗?

5

我有一个应用程序架构问题。

我想用类似于Next.js的东西制作着陆页,因为它需要SEO。
然后我会制作不需要SEO但需要登录的React应用程序。

我的想法是用户可以从落地页重定向到应用程序登录页。
但是这应该如何托管,甚至这是个好主意吗?

两者是否应在不同的域上托管?


2
这是一个非常有趣的问题,但也许更适合于网站管理员SE? - hitchhiker
1
单页应用程序(SPA)可以被Google索引,参见答案。因此,从SEO的角度来看,无需将着陆页与其他页面分开。但是,在构建时对着陆/索引SPA页面进行预渲染确实是有意义的,更多信息请参见这里。我是作者。 - winwiz1
2个回答

4
在开始之前,我同意你的观点,这两个不同的网站具有完全不同的行为,因此需要不同的处理方法。
简单来说,让我们将你的问题分解成以下几个因素:
- 可用性 - 流量来源 - 定价
可用性
你的着陆页面多半应该通过 CDN 来提供全球范围的覆盖,而应用程序本身则可能使用 CDN。一些需要考虑的技术细节包括:
- 如果该页面也采用了现代技术栈构建,它也可以通过基于云的存储来托管。 - 你可以从你的托管云提供商(如 AWS、Azure、GCP 等)选择 CDN,或者使用完全外部的服务(如 MaxCDN)。这主要取决于你的网站所使用的技术堆栈。
流量来源
着陆页对公众开放并使用匿名访问(例如 - 不需要登录),因此它们处于高风险级别,易受 DDoS 和其他恶意攻击的攻击。这就是为什么这些网站大多数都位于 WAF、网关或任何其他层后面,以帮助这些网站保护自己免受劫持。此外,在大多数情况下,这些网站应该处理非常高的负载(远远超过登录受保护的应用程序)。以下是一些重要的要点:
- 着陆页的负载可能会发生剧烈变化并且没有任何警告,因此它们应该采用弹性高可用性方式部署,这意味着 - 当高负载发生时,请使用更多资源来处理这些负载(并在负载返回正常水平时自动减少它们)。 - 在处理身份识别用户和匿名访问时,流量来源日志不同,无论是在网络安全还是数据分析方面都如此。 - 需要登录的应用程序,大多数情况下需要使用坚实的网关和某种形式的身份管理解决方案。这些部分对着陆页面在功能和资源使用方面都没有好处。
定价
是的,我们希望获得尽可能多的灵活性,但我们也希望支付尽可能低的价格。将这两个不同的应用程序耦合起来可能导致使用昂贵的资源来处理着陆页面负载。另一方面,将它们解耦将允许我们跟踪每个资源组并仅支付我们正在使用的费用。因此,在定价方面也有道理。
简而言之,两个不同的应用程序应该具有不同的部署方式,每个应该有自己的技术堆栈和配置。这将为我们带来以下好处。
  • 灵活性 - 对一个环境的更改不会影响另一个环境
  • 部署 - 两个不同的管道 - 每个仅专用于单个解决方案
  • 定价 - 没有必要浪费资源(例如:过度使用消耗大量未使用时间的库),因此可以支付更少费用
  • DevOps - 在某些情况下 - 两个不同的DevOps人员可以处理每个管道,这可能是一个优势

希望这些信息有所帮助


0

网络部署架构很难。你最不需要的是两个版本。从以下两种样式中选择一种并承诺:

  • 网站
  • 单页应用程序

这两种架构都可以混合使用经过身份验证和未经身份验证的视图。

因素

  • 搜索引擎优化(SEO)
  • 浏览器安全性
  • 全球性能
  • 用户和开发人员体验

网站

在前两个领域表现良好,当正确执行时,预呈现页面对搜索引擎优化有利。

单页应用程序(SPA)

这些应用在所有四个领域都可以表现良好,包括使用CDN,正如ymz所指出的那样。有技术可以改善SPA的SEO,例如基于机器人用户代理返回 预渲染页面

安全性

在设计您的Web架构时,这可能是最重要的问题,在您实现其他好处之前。例如,如果您想在浏览器中使用安全Cookie并且还要使用CDN,则需要实现一个棘手的API驱动身份验证流程-请参阅我的博客文章以获取相关内容。

你完全可以在同一个项目中使用SPA和静态页面。唯一的区别是,一个页面基本上是一堆JavaScript,另一个是普通的HTML。 - Pithikos

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接