如何在一个主机上部署 Strapi 和 React？

Question

每个人。 我刚刚部署了 Strapi 和 React 项目。 但我主持个人，所以这似乎很奇怪。 如何在一台主机上进行部署。我找不到任何关于此的指南。

像这样：

绑带： https://nuclear-leagcy.herokuapp.com/admin https://nuclear-leagcy.herokuapp.com/graphql

反应 https://nuclear-leagcy.herokuapp.com

我想我必须用 express 定义 server.js。但我现在对此没有任何想法。

添加。 我想在生产中使用 graphql，但想在生产中禁用 Playground 界面，这样其他人就不能这样做了。

我该怎么办？

Answer 1

使用 3.0.0.beta.19.5 在同一台服务器上部署 Strapi + React 你需要做以下事情。

rootDir = 表示 Strapi 项目的根文件夹。

你需要创建一个新的中间件，rootDir/middlewares/serve-react，还有这2个文件。

1. defaults.json

{
  "serve-react": {
    "enabled": true
  }
}

1. index.js

'use strict';

/**
 * Module dependencies
 */

// Node.js core.
const fs = require('fs');
const path = require('path');
const koaStatic = require('koa-static');

/**
 * Serve react hook
 */

module.exports = strapi => {

  return {
    /**
     * Initialize the hook
     */

    async initialize() {
      const {maxAge, path: publicPath} = strapi.config.middleware.settings.public;
      const staticDir = path.resolve(strapi.dir, publicPath || strapi.config.paths.static);

      strapi.router.get(
        '/*',
        async (ctx, next) => {
          const parse = path.parse(ctx.url);
          ctx.url = path.join(parse.dir, parse.base);

          await next();
        },
        koaStatic(staticDir, {
          maxage: maxAge,
          defer: false, // do not allow other middleware to serve content before this one
        })
      );

      // if no resource is matched by koa-static, just default to serve index file
      // useful for SPA routes
      strapi.router.get('*', ctx => {
        ctx.type = 'html';
        ctx.body = fs.createReadStream(path.join(staticDir + '/index.html'));
      });
    },
  };
};

在链中添加刚刚创建的中间件。根目录/config/middleware.json。请注意，“after”属性末尾的“serve-react”是本例中唯一添加的内容。

{
  "timeout": 100,
  "load": {
    "before": [
      "responseTime",
      "logger",
      "cors",
      "responses",
      "gzip"
    ],
    "order": [
      "Define the middlewares' load order by putting their name in this array is the right order"
    ],
    "after": [
      "parser",
      "router",
      "serve-react"
    ]
  }
}