Javascript 使用单页时，如何将header.html和footer.html添加到所有路由？

我们目前有一个header.html和一个footer.html，它们包含在base.html中，加载到我们网站的/route中。我们使用单页设计，因此除了最初加载页面时，我们不会在任何时候重新加载base.html。在base.html中，我们有一个id为的div，用于使用jQuery加载所有html内容。我们现在面临的问题是，访问路由直接绕过了头的负载，因此我们的jQuesry脚本和引导等等，然后页面看起来像垃圾，无法正常工作。 我们认为可以完全删除可视URL更改，并在路由中使用madeup路由名称。但这感觉像是一种过于复杂且不一定安全的方式。 理想情况下，我们希望能够知道请求是否来自它应该来自的地方

---

关于如何实现这一点有什么想法吗？或者你通常只是希望没有人自己去/注册吗？

我使用导航组件，在页面周围呈现“chrome”

export class Nav extends Component {
  render = () => {
    return (
      <div>
        <rb.Navbar>
          <rb.Navbar.Header>
            <rb.Navbar.Brand>
              <a href="#">aktai</a>
            </rb.Navbar.Brand>
          </rb.Navbar.Header>
        </rb.Navbar>
        {this.props.children}
      </div>)
  }
}

导出类导航扩展组件{
渲染=（）=>{
返回(
{this.props.children}
)
}
}

我将其装载到React路由器中的所有路由：

const router = (
  <Router history={browserHistory}>
      <Route component={Nav}>
        <Route path="/folders" component={Folders}/>
      </Route>
  </Router>
)

const路由器=(
)

您也可以这样称呼它：

<Nav>
  <h1>welcome to my site</h1>
  This is a place
</Nav>

欢迎来到我的网站
这是一个地方

---

任何呈现

this.props.children

的组件都会这样工作。

是的，我们不使用React，我们只允许使用Flask、Python、jQuery、HTML和CSS。我们也在寻找一种避免在不必要的情况下重新加载引导和jQuery的方法。