Sinatra 和客户端路由答案

【问题标题】：Sinatra and a client-side routingSinatra 和客户端路由
【发布时间】：2016-09-13 16:12:59
【问题描述】：

我有一个简单的应用程序（服务器端是 Sinatra，客户端是 ReactJS）。

工作流程非常基本：Sinatra 处理 get "/" 请求并使用静态样式表和脚本向客户端发送 index.html。

脚本是由几个组件和一个 ReactRouter 组成的 ReactJS 应用程序。就 ReactRouter 而言，每个 React 的组件都是一个不同的“页面”，具有自己的路由/路径。

例如：

"/" => "index.html" (real html page with renered components inside),
"/form" => (ReactRouter points to component <Form/>, in fact render happens inside selector of "index.html"),
"/finish" => (ReactRouter points to component <Finish/>, in fact render happens inside selector of "index.html")。

虽然我只实现客户端，但它运行良好。但是现在，当我尝试将 Sinatra 用于服务器端的东西时，这被打破了：当我想转到 /form 时，我得到了 Sinatra 的默认 404 页面（“Sinatra 不知道这个小曲。”）。

我了解 Sinatra（或 Rack）在 ReactRouter 之前拦截了请求的路径（/form of /finish）。但我不明白如何修复它（为什么会这样，而路由器脚本已经在客户端上并且应该首先触发）。

感谢您的帮助。

【问题讨论】：

【解决方案1】：

使用通配符路由将 index.html 返回到所有路由。

类似这样的：

get '/*' do
  #return index.html
end

【讨论】：