Javascript 要重定向到公用目录的Strapi自定义路由

我将我的react应用程序部署到strapi的

/public

目录，一切正常，但当我刷新页面时，strapi覆盖了我的

react路由器

路由

所以。。。当我使用特定路由时，如何将strapi重定向到打开公共目录

---

e、 g重定向

/posts

到公共目录？

Strapi

/public

文件夹用于服务公共资产，而不是承载前端应用程序。这不是一个好的做法。 我必须在回答你的问题之前写下这些

下面是静态文件的服务方式。 它使用公共中间件

因此，您必须按照本文档创建自己的中间件。

因此，在

/middelware/custom/index.js

中添加以下代码：

{
  "myCustomConfiguration": "This configuration is accessible through strapi.config.myCustomConfiguration",
  "custom": {
    "enabled": true
  }
}

const path=require（'path'）；
module.exports=strapi=>{
返回{
初始化：函数（cb）{
路由({
方法：“GET”，
路径：'/post'，
处理程序：[
异步（ctx，下一步）=>{
ctx.url=path.basename（`${ctx.url}/index.html`）；
等待下一个（）；
},
static（strapi.config.middleware.settings.public.path | | strapi.config.paths.static{
maxage:strapi.config.middleware.settings.public.maxage，
延迟：对
})
]
});
cb（）；
}
};
};

然后，您必须启用中间件。 您必须使用以下代码更新

/config/custom.json

文件：

{
  "myCustomConfiguration": "This configuration is accessible through strapi.config.myCustomConfiguration",
  "custom": {
    "enabled": true
  }
}

就这样

我在构建时构建了我的Strapi和CRA（创建react应用程序），并说我想在

/dashboard

路径下装载我的react应用程序

文件结构为：

yourapp/
└── apps/
    ├── frontend (react app)
    └── backend (strapi)

在前端的

包.json中添加
主页
属性

如果您使用CRA，这将告诉Webpack为静态资产添加前缀，例如

将您构建的react应用程序移动到后端项目的子文件夹

/dashboard

，通过修改

纱线构建

脚本，我这样做，复制/粘贴我的代码之前要小心，有一个

rm-rf

cmd

在Strapi中添加一个自定义中间件作为您的“查看路由器”，它将处理到

/dashboard/*

的所有请求，以便为

应用程序/后端/仪表板下的react应用程序资产提供服务

在

/middleware/viewRouter/index.js下创建一个文件

const path=require（“路径”）；
const koaStatic=require（“koa static”）；
常数fs=要求（“fs”）；
module.exports=strapi=>{
返回{
异步初始化（）{
const{maxAge}=strapi.config.middleware.settings.public；
const basename=“/dashboard”；
const dashboardDir=path.resolve（strapi.dir，“dashboard”）；
//服务于仪表板资产。
strapi.router.get(
`${basename}/*`，
异步（ctx，下一步）=>{
ctx.url=ctx.url.replace（/^\/dashboard/，“”）；
如果（！ctx.url）ctx.url=basename；
等待下一个（）；
},
koaStatic（仪表盘目录{
索引：“index.html”，
maxage:maxage，
延迟：假
})
);
常量安定剂=[
“/仪表板”，
“/子路径1”，
“/子路径2”
];
//服务器仪表板资产和所有路由器
strapi.router.get（`${basename}*`，ctx=>{
const routePath=ctx.url.split（“？”[0]；
让fileName=ctx.url；
if（validRootes.includes（routePath））fileName=“index.html”；
ctx.type=“html”；
ctx.body=fs.createReadStream(
join（dashboardDir+`/${fileName}`）
);
});
}
};
};

在
/config/custom.json
并访问
http://localhost:1337/dashboard
您将看到反应页面。
我正在做类似的事情。为此，我遵循这个链接。当我将enable设置为true时，我的管理面板和其他路由将抛出404。你能帮我把这个修好吗。很抱歉，因为我在hear中添加了commnet。让我知道如果你有我的问题，我可以发布一个新问题。如果我不了解你的中间件，我真的帮不了你。确保为中间件使用
wait
和
async
功能。而且还要确保你没有设置一个空的主体。是的，我在应用程序中使用了
async
和
wait
。让我知道您要检查的数据/文件。所以我可以和你分享。你能在你的路线中添加一个console.log并确保你的
ctx.body
不是空的吗。如果您的路由被调用，并且您收到了一个
404
，这是因为正文是空的。因此，如果
/public
不是前端应用程序的正确宿主位置，它应该放在哪里？您必须在此处手动添加有效路由。我只希望它允许任何路由，但保持/admin运行strapiadmin@xaunlopez为什么您不能编写一个中间件来接受任何路由？@chishaku我尝试过，但在为前端资产选择“/admin”之外的任何路由时遇到了问题。我找不到路由器的可接受排除模式。get string arg。也许你能弄明白？但最后，我意识到它可能应该是分离的，并使用nginx反向代理。
// package.json in root path
{
  ...
  "scripts": {
    "build": "yarn build:front && yarn build:back && rm -rf apps/backend/dashboard && mv apps/frontend/build apps/backend/dashboard",
    ...
  }
}

{
  "myCustomConfiguration": "This configuration is accessible through strapi.config.myCustomConfiguration",
  "viewRouter": { // use the middleware name
    "enabled": true
  }
}