为Java Spring后端API开发独立前端的最佳实践咨询

以下两种方案均满足「独立部署、自定义无后缀路由、高SEO」的核心要求：

一、React技术栈方案（解决SEO痛点） #

你担心的React客户端渲染SEO差是传统CSR模式的旧问题，目前已有成熟的工程化方案完全规避：

• 框架选型优先选Next.js，支持多渲染模式按需搭配，既保留React的开发效率，又能拉满SEO表现：
  • 静态站点生成（SSG）：针对内容变动频率低的公开页面（比如文章详情、官方介绍页），构建时直接生成完整静态HTML，SEO效果和纯静态站完全一致，权重表现不会弱于原有WordPress站点
  • 服务端渲染（SSR）：针对动态内容多的公开页面，请求时由服务端生成完整HTML返回，爬虫抓取时可以直接拿到全量内容，不会出现内容为空的问题
  • 客户端渲染（CSR）：仅用于登录后个性化页面等非公开路径，不影响核心SEO效果
• 路由配置：Next.js默认支持自定义路由规则，所有路径天然为无后缀的/path格式，可完全自主控制路径规则，不需要额外适配
• 部署：构建后的产物可直接部署在任意独立静态服务器/Node服务器，和Spring后端完全解耦，跨域问题可通过前端服务配置/api前缀反向代理解决，不需要修改后端配置

二、纯HTML+CSS+轻量JS方案 #

该方案天然具备最优SEO表现，适配需求的实现成本极低：

• 无后缀路由实现：所有页面按路径规则存为.html文件，部署时在Nginx中配置如下规则即可：

  try_files $uri $uri.html $uri/ =404;
  

  用户访问/path时Nginx会自动返回/path.html的内容，地址栏不会显示后缀，完全符合路径规则要求
• 动态内容对接：少量需要从Spring API拉取的动态内容，用原生fetch封装请求渲染即可，如果动态内容需要纳入SEO范围，可以用EJS、Pug等轻量模板工具在构建时把接口内容注入HTML，不需要额外运行时开销
• 部署：所有静态文件直接部署在Nginx、Apache等独立静态服务器即可，和后端完全解耦，加载速度远高于框架类站点，SEO表现和原有WordPress站点完全一致

内容的提问来源于stack exchange，提问作者Mustafa