收到请求不会打到我的快速路线处理程序

时间:2019-03-02 10:31:27

标签: javascript express caching ssr

我正在使用express构建SSR应用,这是我的简单渲染服务器的入口点

src / server / server.ts

import * as express from 'express';
import renderer from 'src/server/renderer';
import proxy = require('express-http-proxy');
import createStore from 'src/helpers/createStore';
import config from '@config/index';
import 'express-async-errors';


const app = express();

const port = 3000 || process.env.PORT

app.use(function (req, res, next) {
  res.header('Cache-Control', 'private, no-cache, no-store, must-revalidate');
  res.header('Expires', '-1');
  res.header('Pragma', 'no-cache');
  next()
});

app.use('/api', proxy(config.API))

app.set("etag", false)

app.use(express.static('build/client/'))

app.get('*', async (req, res) => {

  console.log(`request headers`, req.headers)
  console.log('req.get.cookie', req.get("cookie"))
  const store = await createStore(req)

  const content = renderer(req, store);

  res.send(content);
})

process.on("unhandledRejection", err => {
  console.log("We have unhandleRejection", err)
})

process.on("uncaughtException", err => {
  console.log("We have uncaughtException", err)
})



app.listen(port, () => {
  console.log(`Render server running on port: ${port}`)
})

我对每个路由都有一个用于('*')的获取路由处理程序,如果请求命中该路由器,则转到渲染器函数并生成动态html字符串并返回它。这是我的渲染器功能

src / server / renderer.ts

import * as React from 'react';
import { renderToString } from 'react-dom/server';
import { StaticRouter } from 'react-router-dom';
import { renderRoutes } from 'react-router-config';
import Routes from '@client/Routes';
import { Request } from 'express';
import { ServerStyleSheet } from 'styled-components';
import { Store } from 'redux';
import { Provider } from 'react-redux';
import * as html from 'build/client/index.html';


export default (req: Request, store: Store) => {

  const tree = (
    <Provider store={store}>
      <StaticRouter location={req.path} context={{}}>
        <div>{renderRoutes(Routes)}</div>
      </StaticRouter>
    </Provider>
  );
  const sheet = new ServerStyleSheet();
  renderToString(sheet.collectStyles(tree));
  const styleTags = sheet.getStyleTags();
  console.log(styleTags)

  const content = renderToString(tree);

  return html.replace("$styleTags$", styleTags).replace("$content$", content);

}

它的作用基本上是找到匹配的路由组件,匹配的样式并注入html并将其返回。 但是,每当我请求本地路由(localhost:3000)时,它都不会打入我的路由处理函数并返回html和bundle.js在我的静态文件夹(“ build / client /”)目录中以处理静态资产。我不 知道原因,但是只是不打我唯一的路线处理器!我可以 检查它是否不执行我的路由处理程序中的console.log的事实 前两行,我也为此设置了调试器。它没有命中 返回假设之前创建的奇怪内容。

这是我在浏览器开发人员工具中的请求和响应(我使用的是chrome) enter image description here

我认为这与缓存有关,因此我在上面进行了研究并禁用了浏览器中的缓存选项(我想将缓存控制标头设置为no-cache)并在服务器上禁用了“ etag”并将响应设置为not做缓存。但还是一样。我该如何解决?

0 个答案:

没有答案