rsnext/packages/next/build/webpack/loaders/next-middleware-ssr-loader/index.ts
Shu Ding 7b524c1b97
Properly support custom 500 page in the web server (#33729)
In the web runtime, currently we use `absolute500Path || absoluteErrorPath` to act like `/_error`. This PR fixes the behavior to use the `/pages/500.js` for 500 errors and `/pages/_error.js` for 500 fallback and other errors.

## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have helpful link attached, see `contributing.md`

## Feature

- [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.
- [ ] Errors have helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `yarn lint`
2022-01-27 16:20:16 +00:00

88 lines
2.6 KiB
TypeScript

import { stringifyRequest } from '../../stringify-request'
export default async function middlewareSSRLoader(this: any) {
const {
dev,
page,
buildId,
absolutePagePath,
absoluteAppPath,
absoluteDocumentPath,
absolute500Path,
absoluteErrorPath,
isServerComponent,
stringifiedConfig,
} = this.getOptions()
const stringifiedPagePath = stringifyRequest(this, absolutePagePath)
const stringifiedAppPath = stringifyRequest(this, absoluteAppPath)
const stringifiedErrorPath = stringifyRequest(this, absoluteErrorPath)
const stringifiedDocumentPath = stringifyRequest(this, absoluteDocumentPath)
const stringified500Path = absolute500Path
? stringifyRequest(this, absolute500Path)
: 'null'
const transformed = `
import { adapter } from 'next/dist/server/web/adapter'
import { RouterContext } from 'next/dist/shared/lib/router-context'
import { getRender } from 'next/dist/build/webpack/loaders/next-middleware-ssr-loader/render'
import App from ${stringifiedAppPath}
import Document from ${stringifiedDocumentPath}
const pageMod = require(${stringifiedPagePath})
const errorMod = require(${stringifiedErrorPath})
const error500Mod = ${stringified500Path} ? require(${stringified500Path}) : null
const buildManifest = self.__BUILD_MANIFEST
const reactLoadableManifest = self.__REACT_LOADABLE_MANIFEST
const rscManifest = self.__RSC_MANIFEST
if (typeof pageMod.default !== 'function') {
throw new Error('Your page must export a \`default\` component')
}
// Set server context
self.__current_route = ${JSON.stringify(page)}
self.__server_context = {
Component: pageMod.default,
pageConfig: pageMod.config || {},
buildManifest,
reactLoadableManifest,
Document,
App,
getStaticProps: pageMod.getStaticProps,
getServerSideProps: pageMod.getServerSideProps,
getStaticPaths: pageMod.getStaticPaths,
ComponentMod: undefined,
serverComponentManifest: ${isServerComponent} ? rscManifest : null,
// components
errorMod,
error500Mod,
// renderOpts
buildId: ${JSON.stringify(buildId)},
dev: ${dev},
env: process.env,
supportsDynamicHTML: true,
concurrentFeatures: true,
disableOptimizedLoading: true,
}
const render = getRender({
Document,
isServerComponent: ${isServerComponent},
config: ${stringifiedConfig},
})
export default function rscMiddleware(opts) {
return adapter({
...opts,
handler: render
})
}`
return transformed
}