Question

我正在使用koa-static来提供带有根网址localhost:3000/的静态文件，使用koa-router来提供RESTful api，例如localhost:3000/api/account/login

使fakeBuild文件夹只包含一个文件index.html。一切正常。 root url和api url显示正确的内容。

// serve static file
const serve = require('koa-static')
const staticPath = path.join(__dirname,'..','Client','poker','fakeBuild')
log(staticPath)
app.use(serve(staticPath))

// router
const router = require('./router/Index.js')(app)

然后我尝试将Koa与React连接

我使用yarn build来构建React静态文件，React项目由create-react-app创建，未经修改。

然后我将koa-static的目标更改为build文件夹，只更改了一行

const staticPath = path.join(__dirname,'..','Client','poker','build')

然后访问localhost:3000/，chrome show React start page，works

然后访问localhost:3000/api/account/login，chrome show React start page，what ??

使用邮递员检查localhost:3000/api/account/login，它会响应我放入路由器的内容，很好。

所以我可以使用apis，只是忽略chrome的结果？

必须是React和Chrome做一些额外的事情。我尝试在React构建文件夹中删除service-worker.js，api url在chrome中正确呈现。

所以任何人都可以提供一些文件或解释，以帮助我了解做了什么反应，以保持所有网址呈现它。

为什么我的api localhost:3000/api/account/login不需要service-worker.js（只是在响应正文中返回一些文本），也让js工作了。只是因为koa-static提供了文件？

====

更新：我的路由器代码和here

上提供的项目

路由器/ Index.js

const Router = require('koa-router');

const R = (app)=>{
  const router = new Router();


  const api = require('./Api.js');
  router.use('/api', api.routes(), api.allowedMethods())


  app.use(router.routes())
    .use(router.allowedMethods());
};

module.exports = R;

路由器/ Api.js

const Router = require('koa-router')
const log = require('../helper/Utils').log;

module.exports = (function () {
  const Api = new Router();
  Api.get('/account/login', async (ctx, next)=>{
    log("hello");
    ctx.status = 200;
    ctx.body = `login`
  });

  Api.get('/account/register', async (ctx, next)=>{
    ctx.status = 200;
    ctx.body = `register`

  });

  return Api;
})();

Koa.js服务于React，api url也使用Chrome中的React页面进行渲染

0 个答案: