Запрос Next.js: _next / webpack-hmr 404 - PullRequest
Новая
       9

Запрос Next.js: _next / webpack-hmr 404

0 голосов
/ 06 сентября 2018

Демонстрационное репо этого выпуска - https://github.com/hh54188/happy-server/tree/issue-demo

Я пытаюсь интегрировать Next.js с Hapi.js в качестве плагина. Вот основная структура моей папки проекта плагина next.js: 

--plugins
   |--app
        |--pages
            |--app
                |--a.js
        |--handlers
        |--public
             |--dist
        |--index.js
        |--next.config.js

А вот основной контент index.js, больше всего для регистрации маршрута 

const nextRenderService = next({
  dir: path.join(__dirname)
});

module.exports = {
  name: "AppService",
  version: "0.0.1",
  register: async function(server, options) {
    await nextRenderService.prepare();

    server.route({
      method: "GET",
      path: `/app/${assetPrefix}/_next/webpack-hmr`,
      handler: nextHandlerWrapper(nextRenderService)
    });

    server.route({
      method: "GET",
      path: "/app/{param*}",
      handler: defaultHandler(nextRenderService)
    });

    server.route({
      method: "GET",
      path: `/app/${assetPrefix}/_next/on-demand-entries-ping`,
      handler: nextHandlerWrapper(nextRenderService)
    });

    server.route({
      method: "GET",
      path: `/app/${assetPrefix}/_next/-/page/{param*}`,
      handler: {
        directory: {
          path: path.join(__dirname, pagesPath),
          listing: true
        }
      }
    });

    server.route({
      method: "GET",
      path: `/app/${assetPrefix}/_next/{param*}`,
      handler: {
        directory: {
          path: path.join(__dirname, distPath),
          listing: true
        }
      }
    });
  }
};

Однако, когда я запускаю сервер и посещаю http://127.0.0.1:4000/app/a,, страница может быть успешно обработана, и большинство файлов сценариев может успешно загрузиться. Но статус _next/webpack-hmr и _next/on-demand-entries-ping запросов - 404. И я заметил, что 404 статус от Next.js, а не Hapi.js

Так что не так с моим кодом? Как я могу решить эту проблему?

1 Ответ

0 голосов
/ 08 сентября 2018

Конфигурация assetPrefix предназначена только для использования CDN и является глобальной для NextJs ( документация ).Вы не хотите устанавливать это для чего-то другого, например, для изменения путей маршрутизатора NextJs.Если вы не планируете использовать CDN, просто проигнорируйте этот параметр. 

// in constants/index.js
const assetPrefix = process.env.NODE_ENV === "production" 
    ? "https://cdn.mydomain.com" 
    : "";

Вы также не хотите перечислять все внутренние маршруты NextJs и использовать обработчик запросов NextJs для обработки всех вызовов: 

// index.js
const next = require("next");
const path = require("path");

const nextRenderService = next({
  dir: path.join(__dirname),
  dev: process.env.NODE_ENV !== "production"
});

const { defaultHandler, nextHandlerWrapper } = require("./hanlders");

module.exports = {
  name: "AppService",
  version: "0.0.1",
  register: async function(server, options) {
    // https://github.com/zeit/next.js/blob/master/examples/custom-server-hapi/server.js
    await nextRenderService.prepare();

    // handle NextJs application requests
    const handler = nextRenderService.getRequestHandler();
    server.route({
      method: "GET",
      path: "/app/{p*}",
      handler: async ({ raw, url }, h) => {
        await handler(raw.req, raw.res, url);
        return h.close;
      }
    });

    // handle NextJs private routes
    server.route({
      method: "GET",
      path: "/_next/{p*}" /* next specific routes */,
      handler: nextHandlerWrapper(nextRenderService)
    });

    // Other routes
    server.route({
      method: "GET",
      path: "/{p*}" /* catch all route */,
      handler: defaultHandler(nextRenderService)
    });
  }
};
...