2021-11-28 17:48:43 +01:00
|
|
|
import type { __ApiPreviewProps } from '../api-utils'
|
|
|
|
import type { CustomRoutes } from '../../lib/load-custom-routes'
|
|
|
|
import type { FindComponentsResult } from '../next-server'
|
|
|
|
import type { LoadComponentsReturnType } from '../load-components'
|
|
|
|
import type { Options as ServerOptions } from '../next-server'
|
2022-05-19 17:46:21 +02:00
|
|
|
import type { Params } from '../../shared/lib/router/utils/route-matcher'
|
2022-05-27 20:29:04 +02:00
|
|
|
import type { ParsedUrl } from '../../shared/lib/router/utils/parse-url'
|
2021-11-28 17:48:43 +01:00
|
|
|
import type { ParsedUrlQuery } from 'querystring'
|
|
|
|
import type { Server as HTTPServer } from 'http'
|
|
|
|
import type { UrlWithParsedQuery } from 'url'
|
2022-02-11 20:56:25 +01:00
|
|
|
import type { BaseNextRequest, BaseNextResponse } from '../base-http'
|
feat(next): Support has match and locale option on middleware config (#39257)
## Feature
As the title, support `has` match, `local` that works the same with the `rewrites` and `redirects` of next.config.js on middleware config. With this PR, you can write the config like the following:
```js
export const config = {
matcher: [
"/foo",
{ source: "/bar" },
{
source: "/baz",
has: [
{
type: 'header',
key: 'x-my-header',
value: 'my-value',
}
]
},
{
source: "/en/asdf",
locale: false,
},
]
}
```
Also, fixes https://github.com/vercel/next.js/issues/39428
related https://github.com/vercel/edge-functions/issues/178, https://github.com/vercel/edge-functions/issues/179
- [x] 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`
- [x] 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`
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-08-31 18:23:30 +02:00
|
|
|
import type { MiddlewareRoutingItem, RoutingItem } from '../base-server'
|
|
|
|
import type { MiddlewareMatcher } from '../../build/analysis/get-page-static-info'
|
2021-11-28 17:48:43 +01:00
|
|
|
|
2020-02-12 02:16:42 +01:00
|
|
|
import crypto from 'crypto'
|
2019-10-04 18:11:39 +02:00
|
|
|
import fs from 'fs'
|
2022-01-17 16:17:22 +01:00
|
|
|
import { Worker } from 'next/dist/compiled/jest-worker'
|
2020-05-04 23:16:03 +02:00
|
|
|
import findUp from 'next/dist/compiled/find-up'
|
2020-06-01 23:00:22 +02:00
|
|
|
import { join as pathJoin, relative, resolve as pathResolve, sep } from 'path'
|
2019-10-04 18:11:39 +02:00
|
|
|
import React from 'react'
|
2021-12-21 16:13:45 +01:00
|
|
|
import Watchpack from 'next/dist/compiled/watchpack'
|
2021-06-30 13:44:40 +02:00
|
|
|
import { ampValidation } from '../../build/output'
|
|
|
|
import { PUBLIC_DIR_MIDDLEWARE_CONFLICT } from '../../lib/constants'
|
|
|
|
import { fileExists } from '../../lib/file-exists'
|
|
|
|
import { findPagesDir } from '../../lib/find-pages-dir'
|
2021-11-28 17:48:43 +01:00
|
|
|
import loadCustomRoutes from '../../lib/load-custom-routes'
|
2021-06-30 13:44:40 +02:00
|
|
|
import { verifyTypeScriptSetup } from '../../lib/verifyTypeScriptSetup'
|
2022-03-11 23:26:46 +01:00
|
|
|
import { verifyPartytownSetup } from '../../lib/verify-partytown-setup'
|
2020-08-13 14:39:36 +02:00
|
|
|
import {
|
|
|
|
PHASE_DEVELOPMENT_SERVER,
|
|
|
|
CLIENT_STATIC_FILES_PATH,
|
|
|
|
DEV_CLIENT_PAGES_MANIFEST,
|
2021-10-20 19:52:11 +02:00
|
|
|
DEV_MIDDLEWARE_MANIFEST,
|
2022-08-12 15:01:19 +02:00
|
|
|
COMPILER_NAMES,
|
2021-06-30 13:44:40 +02:00
|
|
|
} from '../../shared/lib/constants'
|
2021-11-28 17:48:43 +01:00
|
|
|
import Server, { WrappedBuildError } from '../next-server'
|
2022-05-19 17:46:21 +02:00
|
|
|
import { getRouteMatcher } from '../../shared/lib/router/utils/route-matcher'
|
feat(next): Support has match and locale option on middleware config (#39257)
## Feature
As the title, support `has` match, `local` that works the same with the `rewrites` and `redirects` of next.config.js on middleware config. With this PR, you can write the config like the following:
```js
export const config = {
matcher: [
"/foo",
{ source: "/bar" },
{
source: "/baz",
has: [
{
type: 'header',
key: 'x-my-header',
value: 'my-value',
}
]
},
{
source: "/en/asdf",
locale: false,
},
]
}
```
Also, fixes https://github.com/vercel/next.js/issues/39428
related https://github.com/vercel/edge-functions/issues/178, https://github.com/vercel/edge-functions/issues/179
- [x] 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`
- [x] 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`
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-08-31 18:23:30 +02:00
|
|
|
import { getMiddlewareRouteMatcher } from '../../shared/lib/router/utils/middleware-route-matcher'
|
2022-04-30 13:19:27 +02:00
|
|
|
import { normalizePagePath } from '../../shared/lib/page-path/normalize-page-path'
|
|
|
|
import { absolutePathToPage } from '../../shared/lib/page-path/absolute-path-to-page'
|
2022-04-27 11:50:29 +02:00
|
|
|
import Router from '../router'
|
|
|
|
import { getPathMatch } from '../../shared/lib/router/utils/path-match'
|
2022-05-27 20:29:04 +02:00
|
|
|
import { pathHasPrefix } from '../../shared/lib/router/utils/path-has-prefix'
|
|
|
|
import { removePathPrefix } from '../../shared/lib/router/utils/remove-path-prefix'
|
2021-06-30 13:44:40 +02:00
|
|
|
import { eventCliSession } from '../../telemetry/events'
|
|
|
|
import { Telemetry } from '../../telemetry/storage'
|
2021-09-13 15:49:29 +02:00
|
|
|
import { setGlobal } from '../../trace'
|
2019-10-04 18:11:39 +02:00
|
|
|
import HotReloader from './hot-reloader'
|
2022-08-26 20:21:53 +02:00
|
|
|
import { findPageFile, isLayoutsLeafPage } from '../lib/find-page-file'
|
2021-06-30 13:44:40 +02:00
|
|
|
import { getNodeOptionsWithoutInspect } from '../lib/utils'
|
2022-08-23 20:16:47 +02:00
|
|
|
import {
|
|
|
|
UnwrapPromise,
|
|
|
|
withCoalescedInvoke,
|
|
|
|
} from '../../lib/coalesced-function'
|
2021-11-28 17:48:43 +01:00
|
|
|
import { loadDefaultErrorComponents } from '../load-components'
|
2022-06-24 20:50:49 +02:00
|
|
|
import { DecodeError, MiddlewareNotFoundError } from '../../shared/lib/utils'
|
2021-08-27 14:29:30 +02:00
|
|
|
import {
|
|
|
|
createOriginalStackFrame,
|
2022-06-15 02:58:13 +02:00
|
|
|
getErrorSource,
|
2021-08-27 14:29:30 +02:00
|
|
|
getSourceById,
|
2021-12-21 16:13:45 +01:00
|
|
|
parseStack,
|
2022-05-31 02:05:27 +02:00
|
|
|
} from 'next/dist/compiled/@next/react-dev-overlay/dist/middleware'
|
2021-08-27 14:29:30 +02:00
|
|
|
import * as Log from '../../build/output/log'
|
2022-01-11 21:40:03 +01:00
|
|
|
import isError, { getProperError } from '../../lib/is-error'
|
feat(next): Support has match and locale option on middleware config (#39257)
## Feature
As the title, support `has` match, `local` that works the same with the `rewrites` and `redirects` of next.config.js on middleware config. With this PR, you can write the config like the following:
```js
export const config = {
matcher: [
"/foo",
{ source: "/bar" },
{
source: "/baz",
has: [
{
type: 'header',
key: 'x-my-header',
value: 'my-value',
}
]
},
{
source: "/en/asdf",
locale: false,
},
]
}
```
Also, fixes https://github.com/vercel/next.js/issues/39428
related https://github.com/vercel/edge-functions/issues/178, https://github.com/vercel/edge-functions/issues/179
- [x] 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`
- [x] 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`
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-08-31 18:23:30 +02:00
|
|
|
import { getRouteRegex } from '../../shared/lib/router/utils/route-regex'
|
2022-05-19 17:46:21 +02:00
|
|
|
import { getSortedRoutes, isDynamicRoute } from '../../shared/lib/router/utils'
|
|
|
|
import { runDependingOnPageType } from '../../build/entries'
|
2022-02-11 20:56:25 +01:00
|
|
|
import { NodeNextResponse, NodeNextRequest } from '../base-http/node'
|
2022-05-20 14:24:00 +02:00
|
|
|
import { getPageStaticInfo } from '../../build/analysis/get-page-static-info'
|
2022-05-03 12:37:23 +02:00
|
|
|
import { normalizePathSep } from '../../shared/lib/page-path/normalize-path-sep'
|
2022-05-25 11:46:26 +02:00
|
|
|
import { normalizeAppPath } from '../../shared/lib/router/utils/app-paths'
|
2022-06-08 16:10:05 +02:00
|
|
|
import {
|
|
|
|
getPossibleMiddlewareFilenames,
|
|
|
|
isMiddlewareFile,
|
2022-06-08 18:51:26 +02:00
|
|
|
NestedMiddlewareError,
|
2022-06-08 16:10:05 +02:00
|
|
|
} from '../../build/utils'
|
2022-08-13 18:55:55 +02:00
|
|
|
import { getDefineEnv } from '../../build/webpack-config'
|
2022-08-23 20:16:47 +02:00
|
|
|
import loadJsConfig from '../../build/load-jsconfig'
|
2019-04-04 23:47:17 +02:00
|
|
|
|
2021-04-18 12:28:09 +02:00
|
|
|
// Load ReactDevOverlay only when needed
|
|
|
|
let ReactDevOverlayImpl: React.FunctionComponent
|
|
|
|
const ReactDevOverlay = (props: any) => {
|
|
|
|
if (ReactDevOverlayImpl === undefined) {
|
2021-08-17 09:18:08 +02:00
|
|
|
ReactDevOverlayImpl =
|
2022-05-31 02:05:27 +02:00
|
|
|
require('next/dist/compiled/@next/react-dev-overlay/dist/client').ReactDevOverlay
|
2021-04-18 12:28:09 +02:00
|
|
|
}
|
|
|
|
return ReactDevOverlayImpl(props)
|
|
|
|
}
|
|
|
|
|
2021-11-28 17:48:43 +01:00
|
|
|
export interface Options extends ServerOptions {
|
|
|
|
/**
|
|
|
|
* Tells of Next.js is running from the `next dev` command
|
|
|
|
*/
|
|
|
|
isNextDevCommand?: boolean
|
|
|
|
}
|
|
|
|
|
2018-09-28 14:05:23 +02:00
|
|
|
export default class DevServer extends Server {
|
2019-10-04 18:11:39 +02:00
|
|
|
private devReady: Promise<void>
|
|
|
|
private setDevReady?: Function
|
|
|
|
private webpackWatcher?: Watchpack | null
|
|
|
|
private hotReloader?: HotReloader
|
2019-11-08 18:03:50 +01:00
|
|
|
private isCustomServer: boolean
|
2020-08-13 14:39:36 +02:00
|
|
|
protected sortedRoutes?: string[]
|
2021-10-15 09:09:54 +02:00
|
|
|
private addedUpgradeListener = false
|
2022-09-03 02:13:47 +02:00
|
|
|
private pagesDir?: string
|
2022-05-25 11:46:26 +02:00
|
|
|
private appDir?: string
|
2022-06-08 16:10:05 +02:00
|
|
|
private actualMiddlewareFile?: string
|
feat(next): Support has match and locale option on middleware config (#39257)
## Feature
As the title, support `has` match, `local` that works the same with the `rewrites` and `redirects` of next.config.js on middleware config. With this PR, you can write the config like the following:
```js
export const config = {
matcher: [
"/foo",
{ source: "/bar" },
{
source: "/baz",
has: [
{
type: 'header',
key: 'x-my-header',
value: 'my-value',
}
]
},
{
source: "/en/asdf",
locale: false,
},
]
}
```
Also, fixes https://github.com/vercel/next.js/issues/39428
related https://github.com/vercel/edge-functions/issues/178, https://github.com/vercel/edge-functions/issues/179
- [x] 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`
- [x] 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`
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-08-31 18:23:30 +02:00
|
|
|
private middleware?: MiddlewareRoutingItem
|
2022-06-21 21:04:48 +02:00
|
|
|
private edgeFunctions?: RoutingItem[]
|
2022-08-23 20:16:47 +02:00
|
|
|
private verifyingTypeScript?: boolean
|
|
|
|
private usingTypeScript?: boolean
|
2022-05-19 17:46:21 +02:00
|
|
|
|
2022-01-17 16:17:22 +01:00
|
|
|
protected staticPathsWorker?: { [key: string]: any } & {
|
2020-07-01 16:59:18 +02:00
|
|
|
loadStaticPaths: typeof import('./static-paths-worker').loadStaticPaths
|
|
|
|
}
|
2019-10-04 18:11:39 +02:00
|
|
|
|
2022-01-17 16:17:22 +01:00
|
|
|
private getStaticPathsWorker(): { [key: string]: any } & {
|
2021-11-24 13:40:08 +01:00
|
|
|
loadStaticPaths: typeof import('./static-paths-worker').loadStaticPaths
|
|
|
|
} {
|
|
|
|
if (this.staticPathsWorker) {
|
|
|
|
return this.staticPathsWorker
|
|
|
|
}
|
|
|
|
this.staticPathsWorker = new Worker(
|
|
|
|
require.resolve('./static-paths-worker'),
|
|
|
|
{
|
|
|
|
maxRetries: 1,
|
|
|
|
numWorkers: this.nextConfig.experimental.cpus,
|
|
|
|
enableWorkerThreads: this.nextConfig.experimental.workerThreads,
|
|
|
|
forkOptions: {
|
|
|
|
env: {
|
|
|
|
...process.env,
|
|
|
|
// discard --inspect/--inspect-brk flags from process.env.NODE_OPTIONS. Otherwise multiple Node.js debuggers
|
|
|
|
// would be started if user launch Next.js in debugging mode. The number of debuggers is linked to
|
|
|
|
// the number of workers Next.js tries to launch. The only worker users are interested in debugging
|
|
|
|
// is the main Next.js one
|
|
|
|
NODE_OPTIONS: getNodeOptionsWithoutInspect(),
|
|
|
|
},
|
|
|
|
},
|
|
|
|
}
|
|
|
|
) as Worker & {
|
|
|
|
loadStaticPaths: typeof import('./static-paths-worker').loadStaticPaths
|
|
|
|
}
|
|
|
|
|
|
|
|
this.staticPathsWorker.getStdout().pipe(process.stdout)
|
|
|
|
this.staticPathsWorker.getStderr().pipe(process.stderr)
|
|
|
|
|
|
|
|
return this.staticPathsWorker
|
|
|
|
}
|
|
|
|
|
2021-11-28 17:48:43 +01:00
|
|
|
constructor(options: Options) {
|
2019-09-24 10:50:04 +02:00
|
|
|
super({ ...options, dev: true })
|
2018-09-28 14:05:23 +02:00
|
|
|
this.renderOpts.dev = true
|
2020-05-15 20:14:44 +02:00
|
|
|
;(this.renderOpts as any).ErrorDebug = ReactDevOverlay
|
2020-05-18 21:24:37 +02:00
|
|
|
this.devReady = new Promise((resolve) => {
|
Improve dev experience by listening faster (#5902)
As I detailed in [this thread on Spectrum](https://spectrum.chat/?t=3df7b1fb-7331-4ca4-af35-d9a8b1cacb2c), the dev experience would be a lot nicer if the server started listening as soon as possible, before the slow initialization steps. That way, instead of manually polling the dev URL until the server's up (this can take a long time!), I can open it right away and the responses will be delivered when the dev server is done initializing.
This makes a few changes to the dev server:
* Move `HotReloader` creation to `prepare`. Ideally, more things (from the non-dev `Server`) would be moved to a later point as well, because creating `next({ ... })` is quite slow.
* In `run`, wait for a promise to resolve before doing anything. This promise automatically gets resolved whenever `prepare` finishes successfully.
And the `next dev` and `next start` scripts:
* Since we want to log that the server is ready/listening before the intensive build process kicks off, we return the app instance from `startServer` and the scripts call `app.prepare()`.
This should all be backwards compatible, including with all existing custom server recommendations that essentially say `app.prepare().then(listen)`. But now, we could make an even better recommendation: start listening right away, then call `app.prepare()` in the `listen` callback. Users would be free to make that change and get better DX.
Try it and I doubt you'll want to go back to the old way. :)
2018-12-17 12:09:44 +01:00
|
|
|
this.setDevReady = resolve
|
|
|
|
})
|
2020-03-24 09:31:04 +01:00
|
|
|
;(this.renderOpts as any).ampSkipValidation =
|
|
|
|
this.nextConfig.experimental?.amp?.skipValidation ?? false
|
2019-10-04 18:11:39 +02:00
|
|
|
;(this.renderOpts as any).ampValidator = (
|
|
|
|
html: string,
|
|
|
|
pathname: string
|
|
|
|
) => {
|
2019-11-26 10:47:55 +01:00
|
|
|
const validatorPath =
|
|
|
|
this.nextConfig.experimental &&
|
|
|
|
this.nextConfig.experimental.amp &&
|
|
|
|
this.nextConfig.experimental.amp.validator
|
2022-06-03 20:47:16 +02:00
|
|
|
const AmpHtmlValidator =
|
|
|
|
require('next/dist/compiled/amphtml-validator') as typeof import('next/dist/compiled/amphtml-validator')
|
2020-05-18 21:24:37 +02:00
|
|
|
return AmpHtmlValidator.getInstance(validatorPath).then((validator) => {
|
2019-04-11 20:59:26 +02:00
|
|
|
const result = validator.validateString(html)
|
|
|
|
ampValidation(
|
|
|
|
pathname,
|
|
|
|
result.errors
|
2020-05-18 21:24:37 +02:00
|
|
|
.filter((e) => e.severity === 'ERROR')
|
|
|
|
.filter((e) => this._filterAmpDevelopmentScript(html, e)),
|
|
|
|
result.errors.filter((e) => e.severity !== 'ERROR')
|
2019-04-11 20:59:26 +02:00
|
|
|
)
|
|
|
|
})
|
|
|
|
}
|
2020-06-01 23:00:22 +02:00
|
|
|
if (fs.existsSync(pathJoin(this.dir, 'static'))) {
|
2022-10-02 21:02:32 +02:00
|
|
|
Log.warn(
|
2021-03-29 10:25:00 +02:00
|
|
|
`The static directory has been deprecated in favor of the public directory. https://nextjs.org/docs/messages/static-dir-deprecated`
|
2019-10-06 13:57:41 +02:00
|
|
|
)
|
|
|
|
}
|
2021-10-15 09:09:54 +02:00
|
|
|
|
|
|
|
// setup upgrade listener eagerly when we can otherwise
|
|
|
|
// it will be done on the first request via req.socket.server
|
|
|
|
if (options.httpServer) {
|
|
|
|
this.setupWebSocketHandler(options.httpServer)
|
|
|
|
}
|
|
|
|
|
2019-11-08 18:03:50 +01:00
|
|
|
this.isCustomServer = !options.isNextDevCommand
|
2022-10-05 00:16:44 +02:00
|
|
|
|
2022-10-07 00:16:42 +02:00
|
|
|
const { pagesDir, appDir } = findPagesDir(
|
|
|
|
this.dir,
|
|
|
|
!!this.nextConfig.experimental.appDir
|
|
|
|
)
|
2022-05-02 15:07:21 +02:00
|
|
|
this.pagesDir = pagesDir
|
2022-05-25 11:46:26 +02:00
|
|
|
this.appDir = appDir
|
2018-09-28 14:05:23 +02:00
|
|
|
}
|
|
|
|
|
2021-12-07 02:14:55 +01:00
|
|
|
protected getBuildId(): string {
|
2018-09-28 14:05:23 +02:00
|
|
|
return 'development'
|
|
|
|
}
|
|
|
|
|
2019-10-04 18:11:39 +02:00
|
|
|
async addExportPathMapRoutes() {
|
2018-10-01 16:31:47 +02:00
|
|
|
// Makes `next export` exportPathMap work in development mode.
|
|
|
|
// So that the user doesn't have to define a custom server reading the exportPathMap
|
|
|
|
if (this.nextConfig.exportPathMap) {
|
2022-10-02 21:02:32 +02:00
|
|
|
Log.info('Defining routes from exportPathMap')
|
2019-05-27 20:20:33 +02:00
|
|
|
const exportPathMap = await this.nextConfig.exportPathMap(
|
|
|
|
{},
|
|
|
|
{
|
|
|
|
dev: true,
|
|
|
|
dir: this.dir,
|
|
|
|
outDir: null,
|
|
|
|
distDir: this.distDir,
|
2019-10-04 18:11:39 +02:00
|
|
|
buildId: this.buildId,
|
2019-05-27 20:20:33 +02:00
|
|
|
}
|
|
|
|
) // In development we can't give a default path mapping
|
2018-10-01 16:31:47 +02:00
|
|
|
for (const path in exportPathMap) {
|
2019-02-19 22:45:07 +01:00
|
|
|
const { page, query = {} } = exportPathMap[path]
|
2018-10-01 16:31:47 +02:00
|
|
|
|
2020-02-11 00:06:38 +01:00
|
|
|
this.router.addFsRoute({
|
2022-04-27 11:50:29 +02:00
|
|
|
match: getPathMatch(path),
|
2019-11-18 01:12:48 +01:00
|
|
|
type: 'route',
|
|
|
|
name: `${path} exportpathmap route`,
|
2020-06-03 17:58:58 +02:00
|
|
|
fn: async (req, res, _params, parsedUrl) => {
|
2018-10-01 16:31:47 +02:00
|
|
|
const { query: urlQuery } = parsedUrl
|
|
|
|
|
|
|
|
Object.keys(urlQuery)
|
2020-05-18 21:24:37 +02:00
|
|
|
.filter((key) => query[key] === undefined)
|
|
|
|
.forEach((key) =>
|
2022-10-02 21:02:32 +02:00
|
|
|
Log.warn(
|
2019-06-30 00:13:23 +02:00
|
|
|
`Url '${path}' defines a query parameter '${key}' that is missing in exportPathMap`
|
2019-05-27 20:20:33 +02:00
|
|
|
)
|
|
|
|
)
|
2018-10-01 16:31:47 +02:00
|
|
|
|
2019-02-19 22:45:07 +01:00
|
|
|
const mergedQuery = { ...urlQuery, ...query }
|
2018-10-01 16:31:47 +02:00
|
|
|
|
2022-01-21 21:38:59 +01:00
|
|
|
await this.render(req, res, page, mergedQuery, parsedUrl, true)
|
2019-11-18 01:12:48 +01:00
|
|
|
return {
|
|
|
|
finished: true,
|
|
|
|
}
|
2019-10-04 18:11:39 +02:00
|
|
|
},
|
2018-10-01 16:31:47 +02:00
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-05-18 19:31:06 +02:00
|
|
|
async startWatcher(): Promise<void> {
|
2019-06-25 16:28:48 +02:00
|
|
|
if (this.webpackWatcher) {
|
2019-05-27 20:20:33 +02:00
|
|
|
return
|
|
|
|
}
|
|
|
|
|
2020-02-19 17:13:04 +01:00
|
|
|
const regexPageExtension = new RegExp(
|
|
|
|
`\\.+(?:${this.nextConfig.pageExtensions.join('|')})$`
|
|
|
|
)
|
|
|
|
|
2019-07-10 17:45:53 +02:00
|
|
|
let resolved = false
|
2022-08-11 05:27:48 +02:00
|
|
|
return new Promise(async (resolve, reject) => {
|
2022-09-03 02:13:47 +02:00
|
|
|
if (this.pagesDir) {
|
|
|
|
// Watchpack doesn't emit an event for an empty directory
|
|
|
|
fs.readdir(this.pagesDir, (_, files) => {
|
|
|
|
if (files?.length) {
|
|
|
|
return
|
|
|
|
}
|
2019-07-10 17:45:53 +02:00
|
|
|
|
2022-09-03 02:13:47 +02:00
|
|
|
if (!resolved) {
|
|
|
|
resolve()
|
|
|
|
resolved = true
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
2019-07-10 17:45:53 +02:00
|
|
|
|
2022-09-03 02:13:47 +02:00
|
|
|
const pages = this.pagesDir ? [this.pagesDir] : []
|
2022-05-25 11:46:26 +02:00
|
|
|
const app = this.appDir ? [this.appDir] : []
|
|
|
|
const directories = [...pages, ...app]
|
2022-09-11 20:39:32 +02:00
|
|
|
|
2022-09-03 02:13:47 +02:00
|
|
|
const files = this.pagesDir
|
|
|
|
? getPossibleMiddlewareFilenames(
|
|
|
|
pathJoin(this.pagesDir, '..'),
|
|
|
|
this.nextConfig.pageExtensions
|
|
|
|
)
|
|
|
|
: []
|
2022-06-08 18:51:26 +02:00
|
|
|
let nestedMiddleware: string[] = []
|
2022-05-03 12:37:23 +02:00
|
|
|
|
2022-08-11 05:27:48 +02:00
|
|
|
const envFiles = [
|
|
|
|
'.env.development.local',
|
|
|
|
'.env.local',
|
|
|
|
'.env.development',
|
|
|
|
'.env',
|
|
|
|
].map((file) => pathJoin(this.dir, file))
|
|
|
|
|
|
|
|
files.push(...envFiles)
|
2022-08-23 20:16:47 +02:00
|
|
|
|
|
|
|
// tsconfig/jsonfig paths hot-reloading
|
|
|
|
const tsconfigPaths = [
|
|
|
|
pathJoin(this.dir, 'tsconfig.json'),
|
|
|
|
pathJoin(this.dir, 'jsconfig.json'),
|
|
|
|
]
|
|
|
|
files.push(...tsconfigPaths)
|
|
|
|
|
2022-09-11 20:39:32 +02:00
|
|
|
const wp = (this.webpackWatcher = new Watchpack({
|
|
|
|
ignored: (pathname: string) => {
|
|
|
|
return (
|
|
|
|
!files.some((file) => file.startsWith(pathname)) &&
|
|
|
|
!directories.some((dir) => pathname.startsWith(dir))
|
|
|
|
)
|
|
|
|
},
|
|
|
|
}))
|
|
|
|
|
2022-08-11 05:27:48 +02:00
|
|
|
wp.watch({ directories: [this.dir], startTime: 0 })
|
2022-08-23 20:16:47 +02:00
|
|
|
const fileWatchTimes = new Map()
|
|
|
|
let enabledTypeScript = this.usingTypeScript
|
2019-05-27 20:20:33 +02:00
|
|
|
|
2022-03-08 21:55:14 +01:00
|
|
|
wp.on('aggregated', async () => {
|
feat(next): Support has match and locale option on middleware config (#39257)
## Feature
As the title, support `has` match, `local` that works the same with the `rewrites` and `redirects` of next.config.js on middleware config. With this PR, you can write the config like the following:
```js
export const config = {
matcher: [
"/foo",
{ source: "/bar" },
{
source: "/baz",
has: [
{
type: 'header',
key: 'x-my-header',
value: 'my-value',
}
]
},
{
source: "/en/asdf",
locale: false,
},
]
}
```
Also, fixes https://github.com/vercel/next.js/issues/39428
related https://github.com/vercel/edge-functions/issues/178, https://github.com/vercel/edge-functions/issues/179
- [x] 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`
- [x] 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`
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-08-31 18:23:30 +02:00
|
|
|
let middlewareMatchers: MiddlewareMatcher[] | undefined
|
2022-05-03 12:37:23 +02:00
|
|
|
const routedPages: string[] = []
|
2019-05-27 20:20:33 +02:00
|
|
|
const knownFiles = wp.getTimeInfoEntries()
|
2022-09-06 19:03:21 +02:00
|
|
|
const appPaths: Record<string, string[]> = {}
|
2022-07-31 17:20:32 +02:00
|
|
|
const edgeRoutesSet = new Set<string>()
|
feat(next): Support has match and locale option on middleware config (#39257)
## Feature
As the title, support `has` match, `local` that works the same with the `rewrites` and `redirects` of next.config.js on middleware config. With this PR, you can write the config like the following:
```js
export const config = {
matcher: [
"/foo",
{ source: "/bar" },
{
source: "/baz",
has: [
{
type: 'header',
key: 'x-my-header',
value: 'my-value',
}
]
},
{
source: "/en/asdf",
locale: false,
},
]
}
```
Also, fixes https://github.com/vercel/next.js/issues/39428
related https://github.com/vercel/edge-functions/issues/178, https://github.com/vercel/edge-functions/issues/179
- [x] 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`
- [x] 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`
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-08-31 18:23:30 +02:00
|
|
|
|
2022-08-11 05:27:48 +02:00
|
|
|
let envChange = false
|
2022-08-23 20:16:47 +02:00
|
|
|
let tsconfigChange = false
|
2021-10-26 18:50:56 +02:00
|
|
|
|
2022-05-19 17:46:21 +02:00
|
|
|
for (const [fileName, meta] of knownFiles) {
|
2022-08-11 05:27:48 +02:00
|
|
|
if (
|
|
|
|
!files.includes(fileName) &&
|
|
|
|
!directories.some((dir) => fileName.startsWith(dir))
|
|
|
|
) {
|
|
|
|
continue
|
|
|
|
}
|
|
|
|
|
2022-08-23 20:16:47 +02:00
|
|
|
const watchTime = fileWatchTimes.get(fileName)
|
|
|
|
const watchTimeChange = watchTime && watchTime !== meta?.timestamp
|
|
|
|
fileWatchTimes.set(fileName, meta.timestamp)
|
|
|
|
|
2022-08-11 05:27:48 +02:00
|
|
|
if (envFiles.includes(fileName)) {
|
2022-08-23 20:16:47 +02:00
|
|
|
if (watchTimeChange) {
|
2022-08-11 05:27:48 +02:00
|
|
|
envChange = true
|
|
|
|
}
|
2022-08-23 20:16:47 +02:00
|
|
|
continue
|
|
|
|
}
|
|
|
|
|
|
|
|
if (tsconfigPaths.includes(fileName)) {
|
|
|
|
if (fileName.endsWith('tsconfig.json')) {
|
|
|
|
enabledTypeScript = true
|
|
|
|
}
|
|
|
|
if (watchTimeChange) {
|
|
|
|
tsconfigChange = true
|
|
|
|
}
|
2022-08-11 05:27:48 +02:00
|
|
|
continue
|
|
|
|
}
|
|
|
|
|
2022-05-19 17:46:21 +02:00
|
|
|
if (
|
|
|
|
meta?.accuracy === undefined ||
|
|
|
|
!regexPageExtension.test(fileName)
|
|
|
|
) {
|
2019-05-27 20:20:33 +02:00
|
|
|
continue
|
|
|
|
}
|
|
|
|
|
2022-05-25 11:46:26 +02:00
|
|
|
const isAppPath = Boolean(
|
|
|
|
this.appDir &&
|
2022-05-19 17:46:21 +02:00
|
|
|
normalizePathSep(fileName).startsWith(
|
2022-05-25 11:46:26 +02:00
|
|
|
normalizePathSep(this.appDir)
|
2022-05-19 17:46:21 +02:00
|
|
|
)
|
|
|
|
)
|
|
|
|
|
|
|
|
const rootFile = absolutePathToPage(fileName, {
|
|
|
|
pagesDir: this.dir,
|
|
|
|
extensions: this.nextConfig.pageExtensions,
|
|
|
|
})
|
|
|
|
|
2022-06-03 18:35:44 +02:00
|
|
|
const staticInfo = await getPageStaticInfo({
|
|
|
|
pageFilePath: fileName,
|
|
|
|
nextConfig: this.nextConfig,
|
|
|
|
page: rootFile,
|
2022-09-07 22:12:13 +02:00
|
|
|
isDev: true,
|
2022-06-03 18:35:44 +02:00
|
|
|
})
|
|
|
|
|
2022-06-08 16:10:05 +02:00
|
|
|
if (isMiddlewareFile(rootFile)) {
|
|
|
|
this.actualMiddlewareFile = rootFile
|
feat(next): Support has match and locale option on middleware config (#39257)
## Feature
As the title, support `has` match, `local` that works the same with the `rewrites` and `redirects` of next.config.js on middleware config. With this PR, you can write the config like the following:
```js
export const config = {
matcher: [
"/foo",
{ source: "/bar" },
{
source: "/baz",
has: [
{
type: 'header',
key: 'x-my-header',
value: 'my-value',
}
]
},
{
source: "/en/asdf",
locale: false,
},
]
}
```
Also, fixes https://github.com/vercel/next.js/issues/39428
related https://github.com/vercel/edge-functions/issues/178, https://github.com/vercel/edge-functions/issues/179
- [x] 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`
- [x] 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`
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-08-31 18:23:30 +02:00
|
|
|
middlewareMatchers = staticInfo.middleware?.matchers || [
|
|
|
|
{ regexp: '.*' },
|
|
|
|
]
|
2022-05-19 17:46:21 +02:00
|
|
|
continue
|
2022-05-03 12:37:23 +02:00
|
|
|
}
|
|
|
|
|
2022-08-23 20:16:47 +02:00
|
|
|
if (fileName.endsWith('.ts') || fileName.endsWith('.tsx')) {
|
|
|
|
enabledTypeScript = true
|
|
|
|
}
|
|
|
|
|
2022-05-19 17:46:21 +02:00
|
|
|
let pageName = absolutePathToPage(fileName, {
|
2022-09-03 02:13:47 +02:00
|
|
|
pagesDir: isAppPath ? this.appDir! : this.pagesDir!,
|
2022-05-19 17:46:21 +02:00
|
|
|
extensions: this.nextConfig.pageExtensions,
|
2022-05-25 11:46:26 +02:00
|
|
|
keepIndex: isAppPath,
|
2022-05-19 17:46:21 +02:00
|
|
|
})
|
|
|
|
|
2022-05-25 11:46:26 +02:00
|
|
|
if (isAppPath) {
|
2022-08-26 20:21:53 +02:00
|
|
|
if (!isLayoutsLeafPage(fileName)) {
|
|
|
|
continue
|
|
|
|
}
|
|
|
|
|
2022-05-03 12:37:23 +02:00
|
|
|
const originalPageName = pageName
|
2022-07-01 19:15:27 +02:00
|
|
|
pageName = normalizeAppPath(pageName) || '/'
|
2022-09-06 19:03:21 +02:00
|
|
|
if (!appPaths[pageName]) {
|
|
|
|
appPaths[pageName] = []
|
|
|
|
}
|
|
|
|
appPaths[pageName].push(originalPageName)
|
2022-05-03 12:37:23 +02:00
|
|
|
|
|
|
|
if (routedPages.includes(pageName)) {
|
|
|
|
continue
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
// /index is preserved for root folder
|
|
|
|
pageName = pageName.replace(/\/index$/, '') || '/'
|
|
|
|
}
|
2022-04-30 13:19:27 +02:00
|
|
|
|
2022-05-19 17:46:21 +02:00
|
|
|
/**
|
|
|
|
* If there is a middleware that is not declared in the root we will
|
|
|
|
* warn without adding it so it doesn't make its way into the system.
|
|
|
|
*/
|
|
|
|
if (/[\\\\/]_middleware$/.test(pageName)) {
|
2022-06-08 18:51:26 +02:00
|
|
|
nestedMiddleware.push(pageName)
|
2021-10-20 19:52:11 +02:00
|
|
|
continue
|
|
|
|
}
|
|
|
|
|
2022-08-12 15:01:19 +02:00
|
|
|
await runDependingOnPageType({
|
2022-05-19 17:46:21 +02:00
|
|
|
page: pageName,
|
2022-05-20 14:24:00 +02:00
|
|
|
pageRuntime: staticInfo.runtime,
|
2022-05-19 17:46:21 +02:00
|
|
|
onClient: () => {},
|
2022-08-14 23:51:11 +02:00
|
|
|
onServer: () => {
|
|
|
|
routedPages.push(pageName)
|
|
|
|
},
|
2022-05-19 17:46:21 +02:00
|
|
|
onEdgeServer: () => {
|
2022-08-16 20:05:03 +02:00
|
|
|
routedPages.push(pageName)
|
2022-07-31 17:20:32 +02:00
|
|
|
edgeRoutesSet.add(pageName)
|
2022-05-19 17:46:21 +02:00
|
|
|
},
|
|
|
|
})
|
2019-05-27 20:20:33 +02:00
|
|
|
}
|
2020-08-13 14:39:36 +02:00
|
|
|
|
2022-08-23 20:16:47 +02:00
|
|
|
if (!this.usingTypeScript && enabledTypeScript) {
|
|
|
|
// we tolerate the error here as this is best effort
|
|
|
|
// and the manual install command will be shown
|
|
|
|
await this.verifyTypeScript()
|
|
|
|
.then(() => {
|
|
|
|
tsconfigChange = true
|
|
|
|
})
|
|
|
|
.catch(() => {})
|
|
|
|
}
|
|
|
|
|
|
|
|
if (envChange || tsconfigChange) {
|
|
|
|
if (envChange) {
|
|
|
|
this.loadEnvConfig({ dev: true, forceReload: true })
|
|
|
|
}
|
|
|
|
let tsconfigResult:
|
|
|
|
| UnwrapPromise<ReturnType<typeof loadJsConfig>>
|
|
|
|
| undefined
|
|
|
|
|
|
|
|
if (tsconfigChange) {
|
|
|
|
try {
|
|
|
|
tsconfigResult = await loadJsConfig(this.dir, this.nextConfig)
|
|
|
|
} catch (_) {
|
|
|
|
/* do we want to log if there are syntax errors in tsconfig while editing? */
|
|
|
|
}
|
|
|
|
}
|
2022-08-13 18:55:55 +02:00
|
|
|
|
|
|
|
this.hotReloader?.activeConfigs?.forEach((config, idx) => {
|
|
|
|
const isClient = idx === 0
|
|
|
|
const isNodeServer = idx === 1
|
|
|
|
const isEdgeServer = idx === 2
|
|
|
|
const hasRewrites =
|
|
|
|
this.customRoutes.rewrites.afterFiles.length > 0 ||
|
|
|
|
this.customRoutes.rewrites.beforeFiles.length > 0 ||
|
|
|
|
this.customRoutes.rewrites.fallback.length > 0
|
|
|
|
|
2022-08-23 20:16:47 +02:00
|
|
|
if (tsconfigChange) {
|
|
|
|
config.resolve?.plugins?.forEach((plugin: any) => {
|
|
|
|
// look for the JsConfigPathsPlugin and update with
|
|
|
|
// the latest paths/baseUrl config
|
|
|
|
if (plugin && plugin.jsConfigPlugin && tsconfigResult) {
|
|
|
|
const { resolvedBaseUrl, jsConfig } = tsconfigResult
|
|
|
|
const currentResolvedBaseUrl = plugin.resolvedBaseUrl
|
|
|
|
const resolvedUrlIndex = config.resolve?.modules?.findIndex(
|
|
|
|
(item) => item === currentResolvedBaseUrl
|
|
|
|
)
|
|
|
|
|
|
|
|
if (
|
|
|
|
resolvedBaseUrl &&
|
|
|
|
resolvedBaseUrl !== currentResolvedBaseUrl
|
|
|
|
) {
|
|
|
|
// remove old baseUrl and add new one
|
|
|
|
if (resolvedUrlIndex && resolvedUrlIndex > -1) {
|
|
|
|
config.resolve?.modules?.splice(resolvedUrlIndex, 1)
|
|
|
|
}
|
|
|
|
config.resolve?.modules?.push(resolvedBaseUrl)
|
2022-08-13 18:55:55 +02:00
|
|
|
}
|
2022-08-23 20:16:47 +02:00
|
|
|
|
|
|
|
if (jsConfig?.compilerOptions?.paths && resolvedBaseUrl) {
|
|
|
|
Object.keys(plugin.paths).forEach((key) => {
|
|
|
|
delete plugin.paths[key]
|
|
|
|
})
|
|
|
|
Object.assign(plugin.paths, jsConfig.compilerOptions.paths)
|
|
|
|
plugin.resolvedBaseUrl = resolvedBaseUrl
|
|
|
|
}
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
if (envChange) {
|
|
|
|
config.plugins?.forEach((plugin: any) => {
|
|
|
|
// we look for the DefinePlugin definitions so we can
|
|
|
|
// update them on the active compilers
|
|
|
|
if (
|
|
|
|
plugin &&
|
|
|
|
typeof plugin.definitions === 'object' &&
|
|
|
|
plugin.definitions.__NEXT_DEFINE_ENV
|
|
|
|
) {
|
|
|
|
const newDefine = getDefineEnv({
|
|
|
|
dev: true,
|
|
|
|
config: this.nextConfig,
|
|
|
|
distDir: this.distDir,
|
|
|
|
isClient,
|
|
|
|
hasRewrites,
|
|
|
|
hasReactRoot: this.hotReloader?.hasReactRoot,
|
|
|
|
isNodeServer,
|
|
|
|
isEdgeServer,
|
|
|
|
})
|
|
|
|
|
|
|
|
Object.keys(plugin.definitions).forEach((key) => {
|
|
|
|
if (!(key in newDefine)) {
|
|
|
|
delete plugin.definitions[key]
|
|
|
|
}
|
|
|
|
})
|
|
|
|
Object.assign(plugin.definitions, newDefine)
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
2022-08-13 18:55:55 +02:00
|
|
|
})
|
|
|
|
this.hotReloader?.invalidate()
|
2022-08-11 05:27:48 +02:00
|
|
|
}
|
|
|
|
|
2022-06-08 18:51:26 +02:00
|
|
|
if (nestedMiddleware.length > 0) {
|
|
|
|
Log.error(
|
2022-09-03 02:13:47 +02:00
|
|
|
new NestedMiddlewareError(
|
|
|
|
nestedMiddleware,
|
|
|
|
this.dir,
|
|
|
|
this.pagesDir!
|
|
|
|
).message
|
2022-06-08 18:51:26 +02:00
|
|
|
)
|
|
|
|
nestedMiddleware = []
|
|
|
|
}
|
|
|
|
|
2022-09-06 19:03:21 +02:00
|
|
|
// Make sure to sort parallel routes to make the result deterministic.
|
|
|
|
this.appPathRoutes = Object.fromEntries(
|
|
|
|
Object.entries(appPaths).map(([k, v]) => [k, v.sort()])
|
|
|
|
)
|
2022-07-31 17:20:32 +02:00
|
|
|
const edgeRoutes = Array.from(edgeRoutesSet)
|
feat(next): Support has match and locale option on middleware config (#39257)
## Feature
As the title, support `has` match, `local` that works the same with the `rewrites` and `redirects` of next.config.js on middleware config. With this PR, you can write the config like the following:
```js
export const config = {
matcher: [
"/foo",
{ source: "/bar" },
{
source: "/baz",
has: [
{
type: 'header',
key: 'x-my-header',
value: 'my-value',
}
]
},
{
source: "/en/asdf",
locale: false,
},
]
}
```
Also, fixes https://github.com/vercel/next.js/issues/39428
related https://github.com/vercel/edge-functions/issues/178, https://github.com/vercel/edge-functions/issues/179
- [x] 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`
- [x] 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`
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-08-31 18:23:30 +02:00
|
|
|
this.edgeFunctions = getSortedRoutes(edgeRoutes).map((page) => {
|
2022-09-06 19:03:21 +02:00
|
|
|
const matchedAppPaths = this.getOriginalAppPaths(page)
|
|
|
|
if (Array.isArray(matchedAppPaths)) {
|
|
|
|
page = matchedAppPaths[0]
|
2022-08-24 21:49:47 +02:00
|
|
|
}
|
feat(next): Support has match and locale option on middleware config (#39257)
## Feature
As the title, support `has` match, `local` that works the same with the `rewrites` and `redirects` of next.config.js on middleware config. With this PR, you can write the config like the following:
```js
export const config = {
matcher: [
"/foo",
{ source: "/bar" },
{
source: "/baz",
has: [
{
type: 'header',
key: 'x-my-header',
value: 'my-value',
}
]
},
{
source: "/en/asdf",
locale: false,
},
]
}
```
Also, fixes https://github.com/vercel/next.js/issues/39428
related https://github.com/vercel/edge-functions/issues/178, https://github.com/vercel/edge-functions/issues/179
- [x] 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`
- [x] 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`
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-08-31 18:23:30 +02:00
|
|
|
const edgeRegex = getRouteRegex(page)
|
|
|
|
return {
|
|
|
|
match: getRouteMatcher(edgeRegex),
|
2022-06-03 18:35:44 +02:00
|
|
|
page,
|
feat(next): Support has match and locale option on middleware config (#39257)
## Feature
As the title, support `has` match, `local` that works the same with the `rewrites` and `redirects` of next.config.js on middleware config. With this PR, you can write the config like the following:
```js
export const config = {
matcher: [
"/foo",
{ source: "/bar" },
{
source: "/baz",
has: [
{
type: 'header',
key: 'x-my-header',
value: 'my-value',
}
]
},
{
source: "/en/asdf",
locale: false,
},
]
}
```
Also, fixes https://github.com/vercel/next.js/issues/39428
related https://github.com/vercel/edge-functions/issues/178, https://github.com/vercel/edge-functions/issues/179
- [x] 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`
- [x] 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`
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-08-31 18:23:30 +02:00
|
|
|
re: edgeRegex.re,
|
2022-06-03 18:35:44 +02:00
|
|
|
}
|
|
|
|
})
|
2021-10-20 19:52:11 +02:00
|
|
|
|
feat(next): Support has match and locale option on middleware config (#39257)
## Feature
As the title, support `has` match, `local` that works the same with the `rewrites` and `redirects` of next.config.js on middleware config. With this PR, you can write the config like the following:
```js
export const config = {
matcher: [
"/foo",
{ source: "/bar" },
{
source: "/baz",
has: [
{
type: 'header',
key: 'x-my-header',
value: 'my-value',
}
]
},
{
source: "/en/asdf",
locale: false,
},
]
}
```
Also, fixes https://github.com/vercel/next.js/issues/39428
related https://github.com/vercel/edge-functions/issues/178, https://github.com/vercel/edge-functions/issues/179
- [x] 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`
- [x] 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`
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-08-31 18:23:30 +02:00
|
|
|
this.middleware = middlewareMatchers
|
|
|
|
? {
|
|
|
|
match: getMiddlewareRouteMatcher(middlewareMatchers),
|
|
|
|
page: '/',
|
|
|
|
matchers: middlewareMatchers,
|
|
|
|
}
|
|
|
|
: undefined
|
|
|
|
|
2020-05-18 15:47:13 +02:00
|
|
|
try {
|
2020-08-13 14:39:36 +02:00
|
|
|
// we serve a separate manifest with all pages for the client in
|
|
|
|
// dev mode so that we can match a page after a rewrite on the client
|
|
|
|
// before it has been built and is populated in the _buildManifest
|
2022-04-06 16:35:52 +02:00
|
|
|
const sortedRoutes = getSortedRoutes(routedPages)
|
2020-08-13 14:39:36 +02:00
|
|
|
|
|
|
|
if (
|
|
|
|
!this.sortedRoutes?.every((val, idx) => val === sortedRoutes[idx])
|
|
|
|
) {
|
|
|
|
// emit the change so clients fetch the update
|
|
|
|
this.hotReloader!.send(undefined, { devPagesManifest: true })
|
|
|
|
}
|
|
|
|
this.sortedRoutes = sortedRoutes
|
|
|
|
|
2022-04-06 16:35:52 +02:00
|
|
|
this.dynamicRoutes = this.sortedRoutes
|
|
|
|
.filter(isDynamicRoute)
|
|
|
|
.map((page) => ({
|
|
|
|
page,
|
|
|
|
match: getRouteMatcher(getRouteRegex(page)),
|
|
|
|
}))
|
2019-05-27 20:20:33 +02:00
|
|
|
|
2020-05-18 15:47:13 +02:00
|
|
|
this.router.setDynamicRoutes(this.dynamicRoutes)
|
2022-06-10 19:35:12 +02:00
|
|
|
this.router.setCatchallMiddleware(
|
|
|
|
this.generateCatchAllMiddlewareRoute(true)
|
|
|
|
)
|
2020-05-18 15:47:13 +02:00
|
|
|
|
|
|
|
if (!resolved) {
|
|
|
|
resolve()
|
|
|
|
resolved = true
|
|
|
|
}
|
|
|
|
} catch (e) {
|
|
|
|
if (!resolved) {
|
|
|
|
reject(e)
|
|
|
|
resolved = true
|
|
|
|
} else {
|
2022-10-02 21:02:32 +02:00
|
|
|
Log.warn('Failed to reload dynamic routes:', e)
|
2020-05-18 15:47:13 +02:00
|
|
|
}
|
2019-07-10 17:45:53 +02:00
|
|
|
}
|
2019-05-27 20:20:33 +02:00
|
|
|
})
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
2020-05-18 19:31:06 +02:00
|
|
|
async stopWatcher(): Promise<void> {
|
2019-05-27 20:20:33 +02:00
|
|
|
if (!this.webpackWatcher) {
|
|
|
|
return
|
|
|
|
}
|
|
|
|
|
|
|
|
this.webpackWatcher.close()
|
|
|
|
this.webpackWatcher = null
|
|
|
|
}
|
|
|
|
|
2022-08-23 20:16:47 +02:00
|
|
|
private async verifyTypeScript() {
|
|
|
|
if (this.verifyingTypeScript) {
|
|
|
|
return
|
|
|
|
}
|
|
|
|
try {
|
|
|
|
this.verifyingTypeScript = true
|
|
|
|
const verifyResult = await verifyTypeScriptSetup({
|
|
|
|
dir: this.dir,
|
2022-09-03 02:13:47 +02:00
|
|
|
intentDirs: [this.pagesDir, this.appDir].filter(Boolean) as string[],
|
2022-08-23 20:16:47 +02:00
|
|
|
typeCheckPreflight: false,
|
|
|
|
tsconfigPath: this.nextConfig.typescript.tsconfigPath,
|
|
|
|
disableStaticImages: this.nextConfig.images.disableStaticImages,
|
|
|
|
})
|
|
|
|
|
|
|
|
if (verifyResult.version) {
|
|
|
|
this.usingTypeScript = true
|
|
|
|
}
|
|
|
|
} finally {
|
|
|
|
this.verifyingTypeScript = false
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-05-18 19:31:06 +02:00
|
|
|
async prepare(): Promise<void> {
|
2021-10-05 12:52:45 +02:00
|
|
|
setGlobal('distDir', this.distDir)
|
|
|
|
setGlobal('phase', PHASE_DEVELOPMENT_SERVER)
|
2019-11-09 23:34:53 +01:00
|
|
|
|
2022-08-23 20:16:47 +02:00
|
|
|
await this.verifyTypeScript()
|
2020-06-09 22:16:23 +02:00
|
|
|
this.customRoutes = await loadCustomRoutes(this.nextConfig)
|
2019-11-09 23:34:53 +01:00
|
|
|
|
2020-06-09 22:16:23 +02:00
|
|
|
// reload router
|
|
|
|
const { redirects, rewrites, headers } = this.customRoutes
|
2021-03-26 16:19:48 +01:00
|
|
|
|
|
|
|
if (
|
|
|
|
rewrites.beforeFiles.length ||
|
|
|
|
rewrites.afterFiles.length ||
|
|
|
|
rewrites.fallback.length ||
|
|
|
|
redirects.length ||
|
|
|
|
headers.length
|
|
|
|
) {
|
2020-06-09 22:16:23 +02:00
|
|
|
this.router = new Router(this.generateRoutes())
|
2019-11-09 23:34:53 +01:00
|
|
|
}
|
2019-05-09 04:51:23 +02:00
|
|
|
|
2019-05-27 20:20:33 +02:00
|
|
|
this.hotReloader = new HotReloader(this.dir, {
|
2022-04-30 13:19:27 +02:00
|
|
|
pagesDir: this.pagesDir,
|
2022-02-25 13:40:24 +01:00
|
|
|
distDir: this.distDir,
|
2019-05-27 20:20:33 +02:00
|
|
|
config: this.nextConfig,
|
2020-02-12 02:16:42 +01:00
|
|
|
previewProps: this.getPreviewProps(),
|
2019-10-04 18:11:39 +02:00
|
|
|
buildId: this.buildId,
|
2021-03-26 16:19:48 +01:00
|
|
|
rewrites,
|
2022-05-25 11:46:26 +02:00
|
|
|
appDir: this.appDir,
|
2019-05-27 20:20:33 +02:00
|
|
|
})
|
2018-09-28 14:05:23 +02:00
|
|
|
await super.prepare()
|
2018-10-01 16:31:47 +02:00
|
|
|
await this.addExportPathMapRoutes()
|
2022-08-13 18:55:55 +02:00
|
|
|
await this.hotReloader.start(true)
|
2019-05-27 20:20:33 +02:00
|
|
|
await this.startWatcher()
|
2019-10-04 18:11:39 +02:00
|
|
|
this.setDevReady!()
|
2019-08-29 18:43:06 +02:00
|
|
|
|
2022-03-11 23:26:46 +01:00
|
|
|
if (this.nextConfig.experimental.nextScriptWorkers) {
|
|
|
|
await verifyPartytownSetup(
|
|
|
|
this.dir,
|
|
|
|
pathJoin(this.distDir, CLIENT_STATIC_FILES_PATH)
|
|
|
|
)
|
|
|
|
}
|
|
|
|
|
2019-10-10 19:18:07 +02:00
|
|
|
const telemetry = new Telemetry({ distDir: this.distDir })
|
2019-10-23 04:42:16 +02:00
|
|
|
telemetry.record(
|
2021-10-16 14:22:42 +02:00
|
|
|
eventCliSession(this.distDir, this.nextConfig, {
|
2021-10-07 01:46:46 +02:00
|
|
|
webpackVersion: 5,
|
2019-10-23 04:42:16 +02:00
|
|
|
cliCommand: 'dev',
|
2022-09-03 02:13:47 +02:00
|
|
|
isSrcDir:
|
|
|
|
(!!this.pagesDir &&
|
|
|
|
relative(this.dir, this.pagesDir).startsWith('src')) ||
|
|
|
|
(!!this.appDir && relative(this.dir, this.appDir).startsWith('src')),
|
2019-11-08 18:03:50 +01:00
|
|
|
hasNowJson: !!(await findUp('now.json', { cwd: this.dir })),
|
|
|
|
isCustomServer: this.isCustomServer,
|
2019-10-23 04:42:16 +02:00
|
|
|
})
|
|
|
|
)
|
Telemetry-compatible tracing (#22713)
A number of changes here. I recommend viewing the diff with the <a href="?w=1">whitespace flag enabled</a>.
- OpenTelemetry is replaced with a custom and lightweight tracing solution.
- Three trace targets are currently supported: console, Zipkin, and NextJS.
- Tracing is now governed by environment variables rather than `--require instrument.js`.
+ `TRACE_TARGET`: one of `CONSOLE`, `ZIPKIN`, or `TELEMETRY`; defaults to `TELEMETRY` if unset or invalid.
+ `TRACE_ID`: an 8-byte hex-encoded value used as the Zipkin trace ID; if not provided, this value will be randomly generated and passed down to subprocesses.
Other sundry:
- I'm missing something, probably a setup step, with the Zipkin target. Traces are captured successfully, but you have to manually enter the Trace ID in order to view the trace - it doesn't show up in queries.
- I'm generally unhappy with [this commit](https://github.com/vercel/next.js/pull/22713/commits/235cedcb3ead76b630b4c8aa695f904489da2831). It is... untidy to provide a telemetry object via `setGlobal`, but I don't have a ready alternative. Is `distDir` strictly required when creating a new Telemetry object? I didn't dig too deep here.
As noted, there are a lot of changes, so it'd be great if a reviewer could:
- [ ] pull down the branch and try to break it
- [ ] check the Zipkin traces and identify possible regressions in the functionality
Closes #22570
Fixes #22574
2021-03-10 22:00:20 +01:00
|
|
|
// This is required by the tracing subsystem.
|
|
|
|
setGlobal('telemetry', telemetry)
|
2021-08-27 14:29:30 +02:00
|
|
|
|
|
|
|
process.on('unhandledRejection', (reason) => {
|
|
|
|
this.logErrorWithOriginalStack(reason, 'unhandledRejection').catch(
|
|
|
|
() => {}
|
|
|
|
)
|
|
|
|
})
|
|
|
|
process.on('uncaughtException', (err) => {
|
|
|
|
this.logErrorWithOriginalStack(err, 'uncaughtException').catch(() => {})
|
|
|
|
})
|
2018-09-28 14:05:23 +02:00
|
|
|
}
|
|
|
|
|
2020-05-18 19:31:06 +02:00
|
|
|
protected async close(): Promise<void> {
|
2019-05-27 20:20:33 +02:00
|
|
|
await this.stopWatcher()
|
2021-11-24 13:40:08 +01:00
|
|
|
await this.getStaticPathsWorker().end()
|
Improve dev experience by listening faster (#5902)
As I detailed in [this thread on Spectrum](https://spectrum.chat/?t=3df7b1fb-7331-4ca4-af35-d9a8b1cacb2c), the dev experience would be a lot nicer if the server started listening as soon as possible, before the slow initialization steps. That way, instead of manually polling the dev URL until the server's up (this can take a long time!), I can open it right away and the responses will be delivered when the dev server is done initializing.
This makes a few changes to the dev server:
* Move `HotReloader` creation to `prepare`. Ideally, more things (from the non-dev `Server`) would be moved to a later point as well, because creating `next({ ... })` is quite slow.
* In `run`, wait for a promise to resolve before doing anything. This promise automatically gets resolved whenever `prepare` finishes successfully.
And the `next dev` and `next start` scripts:
* Since we want to log that the server is ready/listening before the intensive build process kicks off, we return the app instance from `startServer` and the scripts call `app.prepare()`.
This should all be backwards compatible, including with all existing custom server recommendations that essentially say `app.prepare().then(listen)`. But now, we could make an even better recommendation: start listening right away, then call `app.prepare()` in the `listen` callback. Users would be free to make that change and get better DX.
Try it and I doubt you'll want to go back to the old way. :)
2018-12-17 12:09:44 +01:00
|
|
|
if (this.hotReloader) {
|
|
|
|
await this.hotReloader.stop()
|
|
|
|
}
|
2018-09-28 14:05:23 +02:00
|
|
|
}
|
|
|
|
|
2019-12-10 16:08:42 +01:00
|
|
|
protected async hasPage(pathname: string): Promise<boolean> {
|
2020-05-04 18:58:19 +02:00
|
|
|
let normalizedPath: string
|
|
|
|
try {
|
|
|
|
normalizedPath = normalizePagePath(pathname)
|
|
|
|
} catch (err) {
|
|
|
|
console.error(err)
|
|
|
|
// if normalizing the page fails it means it isn't valid
|
|
|
|
// so it doesn't exist so don't throw and return false
|
|
|
|
// to ensure we return 404 instead of 500
|
|
|
|
return false
|
|
|
|
}
|
|
|
|
|
2022-06-08 16:10:05 +02:00
|
|
|
if (isMiddlewareFile(normalizedPath)) {
|
2022-05-19 17:46:21 +02:00
|
|
|
return findPageFile(
|
|
|
|
this.dir,
|
|
|
|
normalizedPath,
|
2022-09-03 02:13:47 +02:00
|
|
|
this.nextConfig.pageExtensions,
|
|
|
|
false
|
2022-05-19 17:46:21 +02:00
|
|
|
).then(Boolean)
|
|
|
|
}
|
|
|
|
|
2022-05-25 11:46:26 +02:00
|
|
|
// check appDir first if enabled
|
|
|
|
if (this.appDir) {
|
2022-05-03 12:37:23 +02:00
|
|
|
const pageFile = await findPageFile(
|
2022-05-25 11:46:26 +02:00
|
|
|
this.appDir,
|
2022-05-03 12:37:23 +02:00
|
|
|
normalizedPath,
|
2022-09-03 02:13:47 +02:00
|
|
|
this.nextConfig.pageExtensions,
|
|
|
|
true
|
2022-05-03 12:37:23 +02:00
|
|
|
)
|
|
|
|
if (pageFile) return true
|
|
|
|
}
|
|
|
|
|
2022-09-03 02:13:47 +02:00
|
|
|
if (this.pagesDir) {
|
|
|
|
const pageFile = await findPageFile(
|
|
|
|
this.pagesDir,
|
|
|
|
normalizedPath,
|
|
|
|
this.nextConfig.pageExtensions,
|
|
|
|
false
|
|
|
|
)
|
|
|
|
return !!pageFile
|
|
|
|
}
|
|
|
|
return false
|
2019-12-10 16:08:42 +01:00
|
|
|
}
|
|
|
|
|
2019-11-18 01:12:48 +01:00
|
|
|
protected async _beforeCatchAllRender(
|
2022-01-14 22:01:35 +01:00
|
|
|
req: BaseNextRequest,
|
|
|
|
res: BaseNextResponse,
|
2020-01-10 03:56:05 +01:00
|
|
|
params: Params,
|
2019-10-04 18:11:39 +02:00
|
|
|
parsedUrl: UrlWithParsedQuery
|
2020-05-18 19:31:06 +02:00
|
|
|
): Promise<boolean> {
|
2019-09-16 23:06:30 +02:00
|
|
|
const { pathname } = parsedUrl
|
2020-03-26 17:58:15 +01:00
|
|
|
const pathParts = params.path || []
|
|
|
|
const path = `/${pathParts.join('/')}`
|
2019-09-16 23:06:30 +02:00
|
|
|
// check for a public file, throwing error if there's a
|
|
|
|
// conflicting page
|
2020-09-24 08:05:40 +02:00
|
|
|
let decodedPath: string
|
|
|
|
|
|
|
|
try {
|
|
|
|
decodedPath = decodeURIComponent(path)
|
|
|
|
} catch (_) {
|
2021-07-05 18:31:32 +02:00
|
|
|
throw new DecodeError('failed to decode param')
|
2020-09-24 08:05:40 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
if (await this.hasPublicFile(decodedPath)) {
|
2019-12-10 16:08:42 +01:00
|
|
|
if (await this.hasPage(pathname!)) {
|
2019-10-06 13:44:03 +02:00
|
|
|
const err = new Error(
|
2021-03-29 10:25:00 +02:00
|
|
|
`A conflicting public file and page file was found for path ${pathname} https://nextjs.org/docs/messages/conflicting-public-file-page`
|
2019-09-16 23:06:30 +02:00
|
|
|
)
|
2019-10-06 13:44:03 +02:00
|
|
|
res.statusCode = 500
|
2019-11-18 01:12:48 +01:00
|
|
|
await this.renderError(err, req, res, pathname!, {})
|
|
|
|
return true
|
2019-09-16 23:06:30 +02:00
|
|
|
}
|
2020-03-26 17:58:15 +01:00
|
|
|
await this.servePublic(req, res, pathParts)
|
2019-11-18 01:12:48 +01:00
|
|
|
return true
|
|
|
|
}
|
|
|
|
|
|
|
|
return false
|
|
|
|
}
|
|
|
|
|
2022-01-14 22:01:35 +01:00
|
|
|
private setupWebSocketHandler(server?: HTTPServer, _req?: NodeNextRequest) {
|
2021-10-15 09:09:54 +02:00
|
|
|
if (!this.addedUpgradeListener) {
|
|
|
|
this.addedUpgradeListener = true
|
2022-01-14 22:01:35 +01:00
|
|
|
server = server || (_req?.originalRequest.socket as any)?.server
|
2021-10-15 09:09:54 +02:00
|
|
|
|
|
|
|
if (!server) {
|
|
|
|
// this is very unlikely to happen but show an error in case
|
|
|
|
// it does somehow
|
|
|
|
Log.error(
|
|
|
|
`Invalid IncomingMessage received, make sure http.createServer is being used to handle requests.`
|
|
|
|
)
|
|
|
|
} else {
|
2021-11-04 10:34:37 +01:00
|
|
|
const { basePath } = this.nextConfig
|
|
|
|
|
2021-10-15 09:09:54 +02:00
|
|
|
server.on('upgrade', (req, socket, head) => {
|
2021-11-04 10:34:37 +01:00
|
|
|
let assetPrefix = (this.nextConfig.assetPrefix || '').replace(
|
|
|
|
/^\/+/,
|
|
|
|
''
|
|
|
|
)
|
|
|
|
|
|
|
|
// assetPrefix can be a proxy server with a url locally
|
|
|
|
// if so, it's needed to send these HMR requests with a rewritten url directly to /_next/webpack-hmr
|
|
|
|
// otherwise account for a path-like prefix when listening to socket events
|
|
|
|
if (assetPrefix.startsWith('http')) {
|
|
|
|
assetPrefix = ''
|
|
|
|
} else if (assetPrefix) {
|
|
|
|
assetPrefix = `/${assetPrefix}`
|
|
|
|
}
|
|
|
|
|
2021-10-15 09:09:54 +02:00
|
|
|
if (
|
|
|
|
req.url?.startsWith(
|
2021-11-04 10:34:37 +01:00
|
|
|
`${basePath || assetPrefix || ''}/_next/webpack-hmr`
|
2021-10-15 09:09:54 +02:00
|
|
|
)
|
|
|
|
) {
|
|
|
|
this.hotReloader?.onHMR(req, socket, head)
|
2022-08-10 19:00:30 +02:00
|
|
|
} else {
|
|
|
|
this.handleUpgrade(req, socket, head)
|
2021-10-15 09:09:54 +02:00
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-10-20 19:52:11 +02:00
|
|
|
async runMiddleware(params: {
|
2022-01-14 22:01:35 +01:00
|
|
|
request: BaseNextRequest
|
|
|
|
response: BaseNextResponse
|
2022-05-27 20:29:04 +02:00
|
|
|
parsedUrl: ParsedUrl
|
2021-10-20 19:52:11 +02:00
|
|
|
parsed: UrlWithParsedQuery
|
feat(next): Support has match and locale option on middleware config (#39257)
## Feature
As the title, support `has` match, `local` that works the same with the `rewrites` and `redirects` of next.config.js on middleware config. With this PR, you can write the config like the following:
```js
export const config = {
matcher: [
"/foo",
{ source: "/bar" },
{
source: "/baz",
has: [
{
type: 'header',
key: 'x-my-header',
value: 'my-value',
}
]
},
{
source: "/en/asdf",
locale: false,
},
]
}
```
Also, fixes https://github.com/vercel/next.js/issues/39428
related https://github.com/vercel/edge-functions/issues/178, https://github.com/vercel/edge-functions/issues/179
- [x] 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`
- [x] 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`
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-08-31 18:23:30 +02:00
|
|
|
middlewareList: MiddlewareRoutingItem[]
|
2022-06-15 02:58:13 +02:00
|
|
|
}) {
|
2021-10-20 19:52:11 +02:00
|
|
|
try {
|
2021-11-05 21:48:43 +01:00
|
|
|
const result = await super.runMiddleware({
|
|
|
|
...params,
|
|
|
|
onWarning: (warn) => {
|
2022-06-15 02:58:13 +02:00
|
|
|
this.logErrorWithOriginalStack(warn, 'warning')
|
2021-11-05 21:48:43 +01:00
|
|
|
},
|
|
|
|
})
|
|
|
|
|
2022-06-15 02:58:13 +02:00
|
|
|
if ('finished' in result) {
|
|
|
|
return result
|
|
|
|
}
|
|
|
|
|
|
|
|
result.waitUntil.catch((error) => {
|
|
|
|
this.logErrorWithOriginalStack(error, 'unhandledRejection')
|
|
|
|
})
|
2021-10-20 19:52:11 +02:00
|
|
|
return result
|
|
|
|
} catch (error) {
|
2022-05-22 05:25:51 +02:00
|
|
|
if (error instanceof DecodeError) {
|
|
|
|
throw error
|
|
|
|
}
|
2022-06-24 20:50:49 +02:00
|
|
|
|
|
|
|
/**
|
|
|
|
* We only log the error when it is not a MiddlewareNotFound error as
|
|
|
|
* in that case we should be already displaying a compilation error
|
|
|
|
* which is what makes the module not found.
|
|
|
|
*/
|
|
|
|
if (!(error instanceof MiddlewareNotFoundError)) {
|
|
|
|
this.logErrorWithOriginalStack(error)
|
|
|
|
}
|
|
|
|
|
2022-01-11 21:40:03 +01:00
|
|
|
const err = getProperError(error)
|
2021-10-20 19:52:11 +02:00
|
|
|
;(err as any).middleware = true
|
|
|
|
const { request, response, parsedUrl } = params
|
2022-06-15 02:58:13 +02:00
|
|
|
|
|
|
|
/**
|
|
|
|
* When there is a failure for an internal Next.js request from
|
|
|
|
* middleware we bypass the error without finishing the request
|
|
|
|
* so we can serve the required chunks to render the error.
|
|
|
|
*/
|
|
|
|
if (
|
|
|
|
request.url.includes('/_next/static') ||
|
|
|
|
request.url.includes('/__nextjs_original-stack-frame')
|
|
|
|
) {
|
|
|
|
return { finished: false }
|
|
|
|
}
|
|
|
|
|
2022-03-08 20:51:08 +01:00
|
|
|
response.statusCode = 500
|
2021-10-20 19:52:11 +02:00
|
|
|
this.renderError(err, request, response, parsedUrl.pathname)
|
2022-06-15 02:58:13 +02:00
|
|
|
return { finished: true }
|
2021-10-20 19:52:11 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-06-21 21:04:48 +02:00
|
|
|
async runEdgeFunction(params: {
|
|
|
|
req: BaseNextRequest
|
|
|
|
res: BaseNextResponse
|
|
|
|
query: ParsedUrlQuery
|
|
|
|
params: Params | undefined
|
|
|
|
page: string
|
2022-09-06 19:03:21 +02:00
|
|
|
appPaths: string[] | null
|
2022-09-03 02:13:47 +02:00
|
|
|
isAppPath: boolean
|
2022-06-21 21:04:48 +02:00
|
|
|
}) {
|
|
|
|
try {
|
fix(edge): error handling for edge route and middleware is inconsistent (#38401)
## What’s in there?
This PR brings more consistency in how errors and warnings are reported when running code in the Edge Runtime:
- Dynamic code evaluation (`eval()`, `new Function()`, `WebAssembly.instantiate()`, `WebAssembly.compile()`…)
- Usage of Node.js global APIs (`BroadcastChannel`, `Buffer`, `TextDecoderStream`, `setImmediate()`...)
- Usage of Node.js modules (`fs`, `path`, `child_process`…)
The new error messages should mention *Edge Runtime* instead of *Middleware*, so they are valid in both cases.
It also fixes a bug where the process polyfill would issue a warning for `process.cwd` (which is `undefined` but legit). Now, one has to invoke the function `process.cwd()` to trigger the error.
It finally fixes the react-dev-overlay, where links from middleware and Edge API route files could not be opened because of the `(middleware)/` prefix in their name.
About the later, please note that we can’t easily remove the prefix or change it for Edge API routes. It comes from the Webpack layer, which is the same for both. We may consider renaming it to *edge* instead in the future.
## How to test?
These changes are almost fully covered with tests:
```bash
pnpm testheadless --testPathPattern runtime-dynamic
pnpm testheadless --testPathPattern runtime-with-node
pnpm testheadless --testPathPattern runtime-module
pnpm testheadless --testPathPattern middleware-dev-errors
```
To try them out manually, you can write a middleware and Edge route files like these:
```jsx
// middleware.js
import { NextResponse } from 'next/server'
import { basename } from 'path'
export default async function middleware() {
eval('2+2')
setImmediate(() => {})
basename()
return NextResponse.next()
}
export const config = { matcher: '/' }
```
```jsx
// pages/api/route.js
import { basename } from 'path'
export default async function handle() {
eval('2+2')
setImmediate(() => {})
basename()
return Response.json({ ok: true })
}
export const config = { runtime: 'experimental-edge' }
```
The expected behaviours are:
- [x] dev, middleware/edge route is using a node.js module: error at runtime (logs + read-dev-overlay):
```bash
error - (middleware)/pages/api/route.js (1:0) @ Object.handle [as handler]
error - The edge runtime does not support Node.js 'path' module.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
> 1 | import { basename } from "path";
2 | export default async function handle() {
```
- [x] build, middleware/edge route is using a node.js module: warning but succeeds
```bash
warn - Compiled with warnings
./middleware.js
A Node.js module is loaded ('path' at line 4) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
./pages/api/route.js
A Node.js module is loaded ('path' at line 1) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
```
- [x] production, middleware/edge route is using a node.js module: error at runtime (logs + 500 error)
```bash
Error: The edge runtime does not support Node.js 'path' module.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
at <unknown> (file:///Users/damien/dev/next.js/packages/next/server/web/sandbox/context.ts:149)
```
- [x] dev, middleware/edge route is using a node.js global API: error at runtime (logs + read-dev-overlay):
```bash
error - (middleware)/pages/api/route.js (4:2) @ Object.handle [as handler]
error - A Node.js API is used (setImmediate) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime
2 |
3 | export default async function handle() {
> 4 | setImmediate(() => {})
| ^
```
- [x] build, middleware/edge route is using a node.js global API: warning but succeeds
```bash
warn - Compiled with warnings
./middleware.js
A Node.js API is used (setImmediate at line: 6) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime
./pages/api/route.js
A Node.js API is used (setImmediate at line: 3) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime
```
- [x] production, middleware/edge route is using a node.js module: error at runtime (logs + 500 error)
```bash
Error: A Node.js API is used (setImmediate) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime
at <unknown> (file:///Users/damien/dev/next.js/packages/next/server/web/sandbox/context.ts:330)
```
- [x] dev, middleware/edge route is loading dynamic code: warning at runtime (logs + read-dev-overlay) and request succeeds (we allow dynamic code in dev only):
```bash
warn - (middleware)/middleware.js (7:2) @ Object.middleware [as handler]
warn - Dynamic Code Evaluation (e. g. 'eval', 'new Function') not allowed in Edge Runtime
5 |
6 | export default async function middleware() {
> 7 | eval('2+2')
```
- [x] build, middleware/edge route is loading dynamic code: build fails with error:
```bash
Failed to compile.
./middleware.js
Dynamic Code Evaluation (e. g. 'eval', 'new Function', 'WebAssembly.compile') not allowed in Edge Runtime
Used by default
./pages/api/route.js
Dynamic Code Evaluation (e. g. 'eval', 'new Function', 'WebAssembly.compile') not allowed in Edge Runtime
Used by default
```
## Notes to reviewers
Edge-related errors are either issued from `next/server/web/sandbox/context.ts` file (runtime errors) or from `next/build/webpack/plugins/middleware-plugin.ts` (webpack compilation).
The previous implementation (I’m pleading guilty here) was way too verbose: some errors (Node.js global APIs like using `process.cwd()`) could be reported several times, and the previous mechanism to dedupe them (in middleware-plugin) wasn’t really effective.
Changes in tests are due to renaming existing tests such as `test/integration/middleware-with-node.js-apis` into `test/integration/edge-runtime-with-node.js-apis`. I extended them to cover Edge API route.
@hanneslund I’ve pushed the improvement you did in https://github.com/vercel/next.js/pull/38289/ one step further to avoid duplication.
2022-07-21 16:53:23 +02:00
|
|
|
return super.runEdgeFunction({
|
|
|
|
...params,
|
|
|
|
onWarning: (warn) => {
|
|
|
|
this.logErrorWithOriginalStack(warn, 'warning')
|
|
|
|
},
|
|
|
|
})
|
2022-06-21 21:04:48 +02:00
|
|
|
} catch (error) {
|
|
|
|
if (error instanceof DecodeError) {
|
|
|
|
throw error
|
|
|
|
}
|
|
|
|
this.logErrorWithOriginalStack(error, 'warning')
|
|
|
|
const err = getProperError(error)
|
|
|
|
const { req, res, page } = params
|
|
|
|
res.statusCode = 500
|
|
|
|
this.renderError(err, req, res, page)
|
|
|
|
return null
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-11-18 01:12:48 +01:00
|
|
|
async run(
|
2022-01-14 22:01:35 +01:00
|
|
|
req: NodeNextRequest,
|
|
|
|
res: NodeNextResponse,
|
2019-11-18 01:12:48 +01:00
|
|
|
parsedUrl: UrlWithParsedQuery
|
2020-05-18 19:31:06 +02:00
|
|
|
): Promise<void> {
|
2019-11-18 01:12:48 +01:00
|
|
|
await this.devReady
|
2021-10-15 09:09:54 +02:00
|
|
|
this.setupWebSocketHandler(undefined, req)
|
2020-07-12 21:03:49 +02:00
|
|
|
|
|
|
|
const { basePath } = this.nextConfig
|
2020-07-13 16:59:40 +02:00
|
|
|
let originalPathname: string | null = null
|
2020-07-12 21:03:49 +02:00
|
|
|
|
2022-05-27 20:29:04 +02:00
|
|
|
if (basePath && pathHasPrefix(parsedUrl.pathname || '/', basePath)) {
|
2020-07-12 21:03:49 +02:00
|
|
|
// strip basePath before handling dev bundles
|
|
|
|
// If replace ends up replacing the full url it'll be `undefined`, meaning we have to default it to `/`
|
2020-07-13 16:59:40 +02:00
|
|
|
originalPathname = parsedUrl.pathname
|
2022-05-27 20:29:04 +02:00
|
|
|
parsedUrl.pathname = removePathPrefix(parsedUrl.pathname || '/', basePath)
|
2020-07-12 21:03:49 +02:00
|
|
|
}
|
|
|
|
|
2019-11-18 01:12:48 +01:00
|
|
|
const { pathname } = parsedUrl
|
|
|
|
|
|
|
|
if (pathname!.startsWith('/_next')) {
|
2020-06-10 22:35:34 +02:00
|
|
|
if (await fileExists(pathJoin(this.publicDir, '_next'))) {
|
2019-11-18 01:12:48 +01:00
|
|
|
throw new Error(PUBLIC_DIR_MIDDLEWARE_CONFLICT)
|
2020-06-10 22:35:34 +02:00
|
|
|
}
|
2019-09-16 23:06:30 +02:00
|
|
|
}
|
|
|
|
|
2020-07-13 16:59:40 +02:00
|
|
|
const { finished = false } = await this.hotReloader!.run(
|
2022-01-14 22:01:35 +01:00
|
|
|
req.originalRequest,
|
|
|
|
res.originalResponse,
|
2020-07-13 16:59:40 +02:00
|
|
|
parsedUrl
|
|
|
|
)
|
|
|
|
|
2018-09-28 14:32:26 +02:00
|
|
|
if (finished) {
|
|
|
|
return
|
2018-09-28 14:05:23 +02:00
|
|
|
}
|
|
|
|
|
2020-07-13 16:59:40 +02:00
|
|
|
if (originalPathname) {
|
|
|
|
// restore the path before continuing so that custom-routes can accurately determine
|
|
|
|
// if they should match against the basePath or not
|
|
|
|
parsedUrl.pathname = originalPathname
|
2020-07-12 21:03:49 +02:00
|
|
|
}
|
2021-08-27 14:29:30 +02:00
|
|
|
try {
|
|
|
|
return await super.run(req, res, parsedUrl)
|
2021-09-16 18:06:57 +02:00
|
|
|
} catch (error) {
|
2022-01-11 21:40:03 +01:00
|
|
|
const err = getProperError(error)
|
2022-10-06 20:56:13 +02:00
|
|
|
this.logErrorWithOriginalStack(err).catch(() => {})
|
|
|
|
if (!res.sent) {
|
|
|
|
res.statusCode = 500
|
|
|
|
try {
|
|
|
|
return await this.renderError(err, req, res, pathname!, {
|
|
|
|
__NEXT_PAGE: (isError(err) && err.page) || pathname || '',
|
|
|
|
})
|
|
|
|
} catch (internalErr) {
|
|
|
|
console.error(internalErr)
|
|
|
|
res.body('Internal Server Error').send()
|
|
|
|
}
|
2021-08-27 14:29:30 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2020-07-12 21:03:49 +02:00
|
|
|
|
2021-08-27 14:29:30 +02:00
|
|
|
private async logErrorWithOriginalStack(
|
2021-09-16 18:06:57 +02:00
|
|
|
err?: unknown,
|
2022-06-15 02:58:13 +02:00
|
|
|
type?: 'unhandledRejection' | 'uncaughtException' | 'warning'
|
2021-08-27 14:29:30 +02:00
|
|
|
) {
|
|
|
|
let usedOriginalStack = false
|
|
|
|
|
2022-05-11 19:02:15 +02:00
|
|
|
if (isError(err) && err.stack) {
|
2021-08-27 14:29:30 +02:00
|
|
|
try {
|
2021-09-16 18:06:57 +02:00
|
|
|
const frames = parseStack(err.stack!)
|
feat: build edge functions with node.js modules and fail at runtime (#38234)
## What's in there?
The Edge runtime [does not support Node.js modules](https://edge-runtime.vercel.app/features/available-apis#unsupported-apis).
When building Next.js application, we currently fail the build when detecting node.js module imported from middleware.
This is an blocker for using code that is conditionally loading node.js modules (based on platform/env detection), as @cramforce reported.
This PR implements a new strategy where:
- we can build such middleware/Edge API route code **with a warning**
- we fail at run time, with graceful errors in dev (console & react-dev-overlay error)
- we fail at run time, with console errors in production
## How to test?
All cases are covered with integration tests.
To try them live, create a simple app with a page, a `middleware.js` file and a `pages/api/route.js`file.
Here are iconic examples:
### node.js modules
```js
// middleware.js
import { NextResponse } from 'next/server'
// static
import { basename } from 'path'
export default async function middleware() {
// dynamic
const { basename } = await import('path')
basename()
return NextResponse.next()
}
export const config = { matcher: '/' }
```
```js
// pags/api/route.js
// static
import { isAbsolute } from 'path'
export default async function handle() {
// dynamic
const { isAbsolute } = await import('path')
return Response.json({ useNodeModule: isAbsolute('/test') })
}
export const config = { runtime: 'experimental-edge' }
```
Desired error (+ source code highlight in dev):
> The edge runtime does not support Node.js 'path' module
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
Desired warning at build time:
> A Node.js module is loaded ('path' at line 2) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
- [x] in dev middleware, static, shows desired error on stderr
- [x] in dev route, static, shows desired error on stderr
- [x] in dev middleware, dynamic, shows desired error on stderr
- [x] in dev route, dynamic, shows desired error on stderr
- [x] in dev middleware, static, shows desired error on react error overlay
- [x] in dev route, static, shows desired error on react error overlay
- [x] in dev middleware, dynamic, shows desired error on react error overlay
- [x] in dev route, dynamic, shows desired error on react error overlay
- [x] builds middleware successfully, shows build warning, shows desired error on stderr on call
- [x] builds route successfully, shows build warning, shows desired error on stderr on call
### 3rd party modules not found
```js
// middleware.js
import { NextResponse } from 'next/server'
// static
import Unknown from 'unknown'
export default async function middleware() {
// dynamic
const Unknown = await import('unknown')
new Unknown()
return NextResponse.next()
}
```
export const config = { matcher: '/' }
```
```js
// pags/api/route.js
// static
import Unknown from 'unknown'
export default async function handle() {
// dynamic
const Unknown = await import('unknown')
return Response.json({ use3rdPartyModule: Unknown() })
}
export const config = { runtime: 'experimental-edge' }
```
Desired error (+ source code highlight in dev):
> Module not found: Can't resolve 'does-not-exist'
Learn More: https://nextjs.org/docs/messages/module-not-found
- [x] in dev middleware, static, shows desired error on stderr
- [x] in dev route, static, shows desired error on stderr
- [x] in dev middleware, dynamic, shows desired error on stderr
- [x] in dev route, dynamic, shows desired error on stderr
- [x] in dev middleware, static, shows desired error on react error overlay
- [x] in dev route, static, shows desired error on react error overlay
- [x] in dev middleware, dynamic, shows desired error on react error overlay
- [x] in dev route, dynamic, shows desired error on react error overlay
- [x] fails to build middleware, with desired error on stderr
- [x] fails to build route, with desired error on stderr
### unused node.js modules
```js
// middleware.js
import { NextResponse } from 'next/server'
export default async function middleware() {
if (process.exit) {
const { basename } = await import('path')
basename()
}
return NextResponse.next()
}
```
```js
// pags/api/route.js
export default async function handle() {
if (process.exit) {
const { basename } = await import('path')
basename()
}
return Response.json({ useNodeModule: false })
}
export const config = { runtime: 'experimental-edge' }
```
Desired warning at build time:
> A Node.js module is loaded ('path' at line 2) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
- [x] invoke middleware in dev with no error
- [x] invoke route in dev with no error
- [x] builds successfully, shows build warning, invoke middleware with no error
- [x] builds successfully, shows build warning, invoke api-route with no error
## Notes to reviewers
The strategy to implement this feature is to leverages webpack [externals](https://webpack.js.org/configuration/externals/#externals) and run a global `__unsupported_module()` function when using a node.js module from edge function's code.
For the record, I tried using [webpack resolve.fallback](https://webpack.js.org/configuration/resolve/#resolvefallback) and [Webpack.IgnorePlugin](https://webpack.js.org/plugins/ignore-plugin/) but they do not allow throwing proper errors at runtime that would contain the loaded module name for reporting.
`__unsupported_module()` is defined in `EdgeRuntime`, and returns a proxy that's throw on use (whether it's property access, function call, new operator... synchronous & promise-based styles).
However there's an issue with error reporting: webpack does not includes the import lines in the generated sourcemaps, preventing from displaying useful errors.
I extended our middleware-plugin to supplement the sourcemaps (when analyzing edge function code, it saves which module is imported from which file, together with line/column/source)
The react-dev-overlay was adapted to look for this additional information when the caught error relates to modules, instead of looking at sourcemaps.
I removed the previous mechanism (built by @nkzawa ) which caught webpack errors at built time to change the displayed error message (files `next/build/index.js`, `next/build/utils.ts` and `wellknown-errors-plugin`)
2022-07-06 22:54:44 +02:00
|
|
|
const frame = frames.find(
|
|
|
|
({ file }) =>
|
fix(edge): error handling for edge route and middleware is inconsistent (#38401)
## What’s in there?
This PR brings more consistency in how errors and warnings are reported when running code in the Edge Runtime:
- Dynamic code evaluation (`eval()`, `new Function()`, `WebAssembly.instantiate()`, `WebAssembly.compile()`…)
- Usage of Node.js global APIs (`BroadcastChannel`, `Buffer`, `TextDecoderStream`, `setImmediate()`...)
- Usage of Node.js modules (`fs`, `path`, `child_process`…)
The new error messages should mention *Edge Runtime* instead of *Middleware*, so they are valid in both cases.
It also fixes a bug where the process polyfill would issue a warning for `process.cwd` (which is `undefined` but legit). Now, one has to invoke the function `process.cwd()` to trigger the error.
It finally fixes the react-dev-overlay, where links from middleware and Edge API route files could not be opened because of the `(middleware)/` prefix in their name.
About the later, please note that we can’t easily remove the prefix or change it for Edge API routes. It comes from the Webpack layer, which is the same for both. We may consider renaming it to *edge* instead in the future.
## How to test?
These changes are almost fully covered with tests:
```bash
pnpm testheadless --testPathPattern runtime-dynamic
pnpm testheadless --testPathPattern runtime-with-node
pnpm testheadless --testPathPattern runtime-module
pnpm testheadless --testPathPattern middleware-dev-errors
```
To try them out manually, you can write a middleware and Edge route files like these:
```jsx
// middleware.js
import { NextResponse } from 'next/server'
import { basename } from 'path'
export default async function middleware() {
eval('2+2')
setImmediate(() => {})
basename()
return NextResponse.next()
}
export const config = { matcher: '/' }
```
```jsx
// pages/api/route.js
import { basename } from 'path'
export default async function handle() {
eval('2+2')
setImmediate(() => {})
basename()
return Response.json({ ok: true })
}
export const config = { runtime: 'experimental-edge' }
```
The expected behaviours are:
- [x] dev, middleware/edge route is using a node.js module: error at runtime (logs + read-dev-overlay):
```bash
error - (middleware)/pages/api/route.js (1:0) @ Object.handle [as handler]
error - The edge runtime does not support Node.js 'path' module.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
> 1 | import { basename } from "path";
2 | export default async function handle() {
```
- [x] build, middleware/edge route is using a node.js module: warning but succeeds
```bash
warn - Compiled with warnings
./middleware.js
A Node.js module is loaded ('path' at line 4) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
./pages/api/route.js
A Node.js module is loaded ('path' at line 1) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
```
- [x] production, middleware/edge route is using a node.js module: error at runtime (logs + 500 error)
```bash
Error: The edge runtime does not support Node.js 'path' module.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
at <unknown> (file:///Users/damien/dev/next.js/packages/next/server/web/sandbox/context.ts:149)
```
- [x] dev, middleware/edge route is using a node.js global API: error at runtime (logs + read-dev-overlay):
```bash
error - (middleware)/pages/api/route.js (4:2) @ Object.handle [as handler]
error - A Node.js API is used (setImmediate) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime
2 |
3 | export default async function handle() {
> 4 | setImmediate(() => {})
| ^
```
- [x] build, middleware/edge route is using a node.js global API: warning but succeeds
```bash
warn - Compiled with warnings
./middleware.js
A Node.js API is used (setImmediate at line: 6) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime
./pages/api/route.js
A Node.js API is used (setImmediate at line: 3) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime
```
- [x] production, middleware/edge route is using a node.js module: error at runtime (logs + 500 error)
```bash
Error: A Node.js API is used (setImmediate) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime
at <unknown> (file:///Users/damien/dev/next.js/packages/next/server/web/sandbox/context.ts:330)
```
- [x] dev, middleware/edge route is loading dynamic code: warning at runtime (logs + read-dev-overlay) and request succeeds (we allow dynamic code in dev only):
```bash
warn - (middleware)/middleware.js (7:2) @ Object.middleware [as handler]
warn - Dynamic Code Evaluation (e. g. 'eval', 'new Function') not allowed in Edge Runtime
5 |
6 | export default async function middleware() {
> 7 | eval('2+2')
```
- [x] build, middleware/edge route is loading dynamic code: build fails with error:
```bash
Failed to compile.
./middleware.js
Dynamic Code Evaluation (e. g. 'eval', 'new Function', 'WebAssembly.compile') not allowed in Edge Runtime
Used by default
./pages/api/route.js
Dynamic Code Evaluation (e. g. 'eval', 'new Function', 'WebAssembly.compile') not allowed in Edge Runtime
Used by default
```
## Notes to reviewers
Edge-related errors are either issued from `next/server/web/sandbox/context.ts` file (runtime errors) or from `next/build/webpack/plugins/middleware-plugin.ts` (webpack compilation).
The previous implementation (I’m pleading guilty here) was way too verbose: some errors (Node.js global APIs like using `process.cwd()`) could be reported several times, and the previous mechanism to dedupe them (in middleware-plugin) wasn’t really effective.
Changes in tests are due to renaming existing tests such as `test/integration/middleware-with-node.js-apis` into `test/integration/edge-runtime-with-node.js-apis`. I extended them to cover Edge API route.
@hanneslund I’ve pushed the improvement you did in https://github.com/vercel/next.js/pull/38289/ one step further to avoid duplication.
2022-07-21 16:53:23 +02:00
|
|
|
!file?.startsWith('eval') &&
|
|
|
|
!file?.includes('web/adapter') &&
|
|
|
|
!file?.includes('sandbox/context')
|
feat: build edge functions with node.js modules and fail at runtime (#38234)
## What's in there?
The Edge runtime [does not support Node.js modules](https://edge-runtime.vercel.app/features/available-apis#unsupported-apis).
When building Next.js application, we currently fail the build when detecting node.js module imported from middleware.
This is an blocker for using code that is conditionally loading node.js modules (based on platform/env detection), as @cramforce reported.
This PR implements a new strategy where:
- we can build such middleware/Edge API route code **with a warning**
- we fail at run time, with graceful errors in dev (console & react-dev-overlay error)
- we fail at run time, with console errors in production
## How to test?
All cases are covered with integration tests.
To try them live, create a simple app with a page, a `middleware.js` file and a `pages/api/route.js`file.
Here are iconic examples:
### node.js modules
```js
// middleware.js
import { NextResponse } from 'next/server'
// static
import { basename } from 'path'
export default async function middleware() {
// dynamic
const { basename } = await import('path')
basename()
return NextResponse.next()
}
export const config = { matcher: '/' }
```
```js
// pags/api/route.js
// static
import { isAbsolute } from 'path'
export default async function handle() {
// dynamic
const { isAbsolute } = await import('path')
return Response.json({ useNodeModule: isAbsolute('/test') })
}
export const config = { runtime: 'experimental-edge' }
```
Desired error (+ source code highlight in dev):
> The edge runtime does not support Node.js 'path' module
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
Desired warning at build time:
> A Node.js module is loaded ('path' at line 2) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
- [x] in dev middleware, static, shows desired error on stderr
- [x] in dev route, static, shows desired error on stderr
- [x] in dev middleware, dynamic, shows desired error on stderr
- [x] in dev route, dynamic, shows desired error on stderr
- [x] in dev middleware, static, shows desired error on react error overlay
- [x] in dev route, static, shows desired error on react error overlay
- [x] in dev middleware, dynamic, shows desired error on react error overlay
- [x] in dev route, dynamic, shows desired error on react error overlay
- [x] builds middleware successfully, shows build warning, shows desired error on stderr on call
- [x] builds route successfully, shows build warning, shows desired error on stderr on call
### 3rd party modules not found
```js
// middleware.js
import { NextResponse } from 'next/server'
// static
import Unknown from 'unknown'
export default async function middleware() {
// dynamic
const Unknown = await import('unknown')
new Unknown()
return NextResponse.next()
}
```
export const config = { matcher: '/' }
```
```js
// pags/api/route.js
// static
import Unknown from 'unknown'
export default async function handle() {
// dynamic
const Unknown = await import('unknown')
return Response.json({ use3rdPartyModule: Unknown() })
}
export const config = { runtime: 'experimental-edge' }
```
Desired error (+ source code highlight in dev):
> Module not found: Can't resolve 'does-not-exist'
Learn More: https://nextjs.org/docs/messages/module-not-found
- [x] in dev middleware, static, shows desired error on stderr
- [x] in dev route, static, shows desired error on stderr
- [x] in dev middleware, dynamic, shows desired error on stderr
- [x] in dev route, dynamic, shows desired error on stderr
- [x] in dev middleware, static, shows desired error on react error overlay
- [x] in dev route, static, shows desired error on react error overlay
- [x] in dev middleware, dynamic, shows desired error on react error overlay
- [x] in dev route, dynamic, shows desired error on react error overlay
- [x] fails to build middleware, with desired error on stderr
- [x] fails to build route, with desired error on stderr
### unused node.js modules
```js
// middleware.js
import { NextResponse } from 'next/server'
export default async function middleware() {
if (process.exit) {
const { basename } = await import('path')
basename()
}
return NextResponse.next()
}
```
```js
// pags/api/route.js
export default async function handle() {
if (process.exit) {
const { basename } = await import('path')
basename()
}
return Response.json({ useNodeModule: false })
}
export const config = { runtime: 'experimental-edge' }
```
Desired warning at build time:
> A Node.js module is loaded ('path' at line 2) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
- [x] invoke middleware in dev with no error
- [x] invoke route in dev with no error
- [x] builds successfully, shows build warning, invoke middleware with no error
- [x] builds successfully, shows build warning, invoke api-route with no error
## Notes to reviewers
The strategy to implement this feature is to leverages webpack [externals](https://webpack.js.org/configuration/externals/#externals) and run a global `__unsupported_module()` function when using a node.js module from edge function's code.
For the record, I tried using [webpack resolve.fallback](https://webpack.js.org/configuration/resolve/#resolvefallback) and [Webpack.IgnorePlugin](https://webpack.js.org/plugins/ignore-plugin/) but they do not allow throwing proper errors at runtime that would contain the loaded module name for reporting.
`__unsupported_module()` is defined in `EdgeRuntime`, and returns a proxy that's throw on use (whether it's property access, function call, new operator... synchronous & promise-based styles).
However there's an issue with error reporting: webpack does not includes the import lines in the generated sourcemaps, preventing from displaying useful errors.
I extended our middleware-plugin to supplement the sourcemaps (when analyzing edge function code, it saves which module is imported from which file, together with line/column/source)
The react-dev-overlay was adapted to look for this additional information when the caught error relates to modules, instead of looking at sourcemaps.
I removed the previous mechanism (built by @nkzawa ) which caught webpack errors at built time to change the displayed error message (files `next/build/index.js`, `next/build/utils.ts` and `wellknown-errors-plugin`)
2022-07-06 22:54:44 +02:00
|
|
|
)!
|
2021-08-27 14:29:30 +02:00
|
|
|
|
|
|
|
if (frame.lineNumber && frame?.file) {
|
|
|
|
const moduleId = frame.file!.replace(
|
|
|
|
/^(webpack-internal:\/\/\/|file:\/\/)/,
|
|
|
|
''
|
|
|
|
)
|
|
|
|
|
feat: build edge functions with node.js modules and fail at runtime (#38234)
## What's in there?
The Edge runtime [does not support Node.js modules](https://edge-runtime.vercel.app/features/available-apis#unsupported-apis).
When building Next.js application, we currently fail the build when detecting node.js module imported from middleware.
This is an blocker for using code that is conditionally loading node.js modules (based on platform/env detection), as @cramforce reported.
This PR implements a new strategy where:
- we can build such middleware/Edge API route code **with a warning**
- we fail at run time, with graceful errors in dev (console & react-dev-overlay error)
- we fail at run time, with console errors in production
## How to test?
All cases are covered with integration tests.
To try them live, create a simple app with a page, a `middleware.js` file and a `pages/api/route.js`file.
Here are iconic examples:
### node.js modules
```js
// middleware.js
import { NextResponse } from 'next/server'
// static
import { basename } from 'path'
export default async function middleware() {
// dynamic
const { basename } = await import('path')
basename()
return NextResponse.next()
}
export const config = { matcher: '/' }
```
```js
// pags/api/route.js
// static
import { isAbsolute } from 'path'
export default async function handle() {
// dynamic
const { isAbsolute } = await import('path')
return Response.json({ useNodeModule: isAbsolute('/test') })
}
export const config = { runtime: 'experimental-edge' }
```
Desired error (+ source code highlight in dev):
> The edge runtime does not support Node.js 'path' module
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
Desired warning at build time:
> A Node.js module is loaded ('path' at line 2) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
- [x] in dev middleware, static, shows desired error on stderr
- [x] in dev route, static, shows desired error on stderr
- [x] in dev middleware, dynamic, shows desired error on stderr
- [x] in dev route, dynamic, shows desired error on stderr
- [x] in dev middleware, static, shows desired error on react error overlay
- [x] in dev route, static, shows desired error on react error overlay
- [x] in dev middleware, dynamic, shows desired error on react error overlay
- [x] in dev route, dynamic, shows desired error on react error overlay
- [x] builds middleware successfully, shows build warning, shows desired error on stderr on call
- [x] builds route successfully, shows build warning, shows desired error on stderr on call
### 3rd party modules not found
```js
// middleware.js
import { NextResponse } from 'next/server'
// static
import Unknown from 'unknown'
export default async function middleware() {
// dynamic
const Unknown = await import('unknown')
new Unknown()
return NextResponse.next()
}
```
export const config = { matcher: '/' }
```
```js
// pags/api/route.js
// static
import Unknown from 'unknown'
export default async function handle() {
// dynamic
const Unknown = await import('unknown')
return Response.json({ use3rdPartyModule: Unknown() })
}
export const config = { runtime: 'experimental-edge' }
```
Desired error (+ source code highlight in dev):
> Module not found: Can't resolve 'does-not-exist'
Learn More: https://nextjs.org/docs/messages/module-not-found
- [x] in dev middleware, static, shows desired error on stderr
- [x] in dev route, static, shows desired error on stderr
- [x] in dev middleware, dynamic, shows desired error on stderr
- [x] in dev route, dynamic, shows desired error on stderr
- [x] in dev middleware, static, shows desired error on react error overlay
- [x] in dev route, static, shows desired error on react error overlay
- [x] in dev middleware, dynamic, shows desired error on react error overlay
- [x] in dev route, dynamic, shows desired error on react error overlay
- [x] fails to build middleware, with desired error on stderr
- [x] fails to build route, with desired error on stderr
### unused node.js modules
```js
// middleware.js
import { NextResponse } from 'next/server'
export default async function middleware() {
if (process.exit) {
const { basename } = await import('path')
basename()
}
return NextResponse.next()
}
```
```js
// pags/api/route.js
export default async function handle() {
if (process.exit) {
const { basename } = await import('path')
basename()
}
return Response.json({ useNodeModule: false })
}
export const config = { runtime: 'experimental-edge' }
```
Desired warning at build time:
> A Node.js module is loaded ('path' at line 2) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
- [x] invoke middleware in dev with no error
- [x] invoke route in dev with no error
- [x] builds successfully, shows build warning, invoke middleware with no error
- [x] builds successfully, shows build warning, invoke api-route with no error
## Notes to reviewers
The strategy to implement this feature is to leverages webpack [externals](https://webpack.js.org/configuration/externals/#externals) and run a global `__unsupported_module()` function when using a node.js module from edge function's code.
For the record, I tried using [webpack resolve.fallback](https://webpack.js.org/configuration/resolve/#resolvefallback) and [Webpack.IgnorePlugin](https://webpack.js.org/plugins/ignore-plugin/) but they do not allow throwing proper errors at runtime that would contain the loaded module name for reporting.
`__unsupported_module()` is defined in `EdgeRuntime`, and returns a proxy that's throw on use (whether it's property access, function call, new operator... synchronous & promise-based styles).
However there's an issue with error reporting: webpack does not includes the import lines in the generated sourcemaps, preventing from displaying useful errors.
I extended our middleware-plugin to supplement the sourcemaps (when analyzing edge function code, it saves which module is imported from which file, together with line/column/source)
The react-dev-overlay was adapted to look for this additional information when the caught error relates to modules, instead of looking at sourcemaps.
I removed the previous mechanism (built by @nkzawa ) which caught webpack errors at built time to change the displayed error message (files `next/build/index.js`, `next/build/utils.ts` and `wellknown-errors-plugin`)
2022-07-06 22:54:44 +02:00
|
|
|
const src = getErrorSource(err as Error)
|
|
|
|
const compilation = (
|
2022-08-12 15:01:19 +02:00
|
|
|
src === COMPILER_NAMES.edgeServer
|
feat: build edge functions with node.js modules and fail at runtime (#38234)
## What's in there?
The Edge runtime [does not support Node.js modules](https://edge-runtime.vercel.app/features/available-apis#unsupported-apis).
When building Next.js application, we currently fail the build when detecting node.js module imported from middleware.
This is an blocker for using code that is conditionally loading node.js modules (based on platform/env detection), as @cramforce reported.
This PR implements a new strategy where:
- we can build such middleware/Edge API route code **with a warning**
- we fail at run time, with graceful errors in dev (console & react-dev-overlay error)
- we fail at run time, with console errors in production
## How to test?
All cases are covered with integration tests.
To try them live, create a simple app with a page, a `middleware.js` file and a `pages/api/route.js`file.
Here are iconic examples:
### node.js modules
```js
// middleware.js
import { NextResponse } from 'next/server'
// static
import { basename } from 'path'
export default async function middleware() {
// dynamic
const { basename } = await import('path')
basename()
return NextResponse.next()
}
export const config = { matcher: '/' }
```
```js
// pags/api/route.js
// static
import { isAbsolute } from 'path'
export default async function handle() {
// dynamic
const { isAbsolute } = await import('path')
return Response.json({ useNodeModule: isAbsolute('/test') })
}
export const config = { runtime: 'experimental-edge' }
```
Desired error (+ source code highlight in dev):
> The edge runtime does not support Node.js 'path' module
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
Desired warning at build time:
> A Node.js module is loaded ('path' at line 2) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
- [x] in dev middleware, static, shows desired error on stderr
- [x] in dev route, static, shows desired error on stderr
- [x] in dev middleware, dynamic, shows desired error on stderr
- [x] in dev route, dynamic, shows desired error on stderr
- [x] in dev middleware, static, shows desired error on react error overlay
- [x] in dev route, static, shows desired error on react error overlay
- [x] in dev middleware, dynamic, shows desired error on react error overlay
- [x] in dev route, dynamic, shows desired error on react error overlay
- [x] builds middleware successfully, shows build warning, shows desired error on stderr on call
- [x] builds route successfully, shows build warning, shows desired error on stderr on call
### 3rd party modules not found
```js
// middleware.js
import { NextResponse } from 'next/server'
// static
import Unknown from 'unknown'
export default async function middleware() {
// dynamic
const Unknown = await import('unknown')
new Unknown()
return NextResponse.next()
}
```
export const config = { matcher: '/' }
```
```js
// pags/api/route.js
// static
import Unknown from 'unknown'
export default async function handle() {
// dynamic
const Unknown = await import('unknown')
return Response.json({ use3rdPartyModule: Unknown() })
}
export const config = { runtime: 'experimental-edge' }
```
Desired error (+ source code highlight in dev):
> Module not found: Can't resolve 'does-not-exist'
Learn More: https://nextjs.org/docs/messages/module-not-found
- [x] in dev middleware, static, shows desired error on stderr
- [x] in dev route, static, shows desired error on stderr
- [x] in dev middleware, dynamic, shows desired error on stderr
- [x] in dev route, dynamic, shows desired error on stderr
- [x] in dev middleware, static, shows desired error on react error overlay
- [x] in dev route, static, shows desired error on react error overlay
- [x] in dev middleware, dynamic, shows desired error on react error overlay
- [x] in dev route, dynamic, shows desired error on react error overlay
- [x] fails to build middleware, with desired error on stderr
- [x] fails to build route, with desired error on stderr
### unused node.js modules
```js
// middleware.js
import { NextResponse } from 'next/server'
export default async function middleware() {
if (process.exit) {
const { basename } = await import('path')
basename()
}
return NextResponse.next()
}
```
```js
// pags/api/route.js
export default async function handle() {
if (process.exit) {
const { basename } = await import('path')
basename()
}
return Response.json({ useNodeModule: false })
}
export const config = { runtime: 'experimental-edge' }
```
Desired warning at build time:
> A Node.js module is loaded ('path' at line 2) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
- [x] invoke middleware in dev with no error
- [x] invoke route in dev with no error
- [x] builds successfully, shows build warning, invoke middleware with no error
- [x] builds successfully, shows build warning, invoke api-route with no error
## Notes to reviewers
The strategy to implement this feature is to leverages webpack [externals](https://webpack.js.org/configuration/externals/#externals) and run a global `__unsupported_module()` function when using a node.js module from edge function's code.
For the record, I tried using [webpack resolve.fallback](https://webpack.js.org/configuration/resolve/#resolvefallback) and [Webpack.IgnorePlugin](https://webpack.js.org/plugins/ignore-plugin/) but they do not allow throwing proper errors at runtime that would contain the loaded module name for reporting.
`__unsupported_module()` is defined in `EdgeRuntime`, and returns a proxy that's throw on use (whether it's property access, function call, new operator... synchronous & promise-based styles).
However there's an issue with error reporting: webpack does not includes the import lines in the generated sourcemaps, preventing from displaying useful errors.
I extended our middleware-plugin to supplement the sourcemaps (when analyzing edge function code, it saves which module is imported from which file, together with line/column/source)
The react-dev-overlay was adapted to look for this additional information when the caught error relates to modules, instead of looking at sourcemaps.
I removed the previous mechanism (built by @nkzawa ) which caught webpack errors at built time to change the displayed error message (files `next/build/index.js`, `next/build/utils.ts` and `wellknown-errors-plugin`)
2022-07-06 22:54:44 +02:00
|
|
|
? this.hotReloader?.edgeServerStats?.compilation
|
|
|
|
: this.hotReloader?.serverStats?.compilation
|
|
|
|
)!
|
2022-06-15 02:58:13 +02:00
|
|
|
|
2021-08-27 14:29:30 +02:00
|
|
|
const source = await getSourceById(
|
|
|
|
!!frame.file?.startsWith(sep) || !!frame.file?.startsWith('file:'),
|
|
|
|
moduleId,
|
2021-10-07 01:46:46 +02:00
|
|
|
compilation
|
2021-08-27 14:29:30 +02:00
|
|
|
)
|
|
|
|
|
|
|
|
const originalFrame = await createOriginalStackFrame({
|
|
|
|
line: frame.lineNumber!,
|
|
|
|
column: frame.column,
|
|
|
|
source,
|
|
|
|
frame,
|
|
|
|
modulePath: moduleId,
|
|
|
|
rootDirectory: this.dir,
|
feat: build edge functions with node.js modules and fail at runtime (#38234)
## What's in there?
The Edge runtime [does not support Node.js modules](https://edge-runtime.vercel.app/features/available-apis#unsupported-apis).
When building Next.js application, we currently fail the build when detecting node.js module imported from middleware.
This is an blocker for using code that is conditionally loading node.js modules (based on platform/env detection), as @cramforce reported.
This PR implements a new strategy where:
- we can build such middleware/Edge API route code **with a warning**
- we fail at run time, with graceful errors in dev (console & react-dev-overlay error)
- we fail at run time, with console errors in production
## How to test?
All cases are covered with integration tests.
To try them live, create a simple app with a page, a `middleware.js` file and a `pages/api/route.js`file.
Here are iconic examples:
### node.js modules
```js
// middleware.js
import { NextResponse } from 'next/server'
// static
import { basename } from 'path'
export default async function middleware() {
// dynamic
const { basename } = await import('path')
basename()
return NextResponse.next()
}
export const config = { matcher: '/' }
```
```js
// pags/api/route.js
// static
import { isAbsolute } from 'path'
export default async function handle() {
// dynamic
const { isAbsolute } = await import('path')
return Response.json({ useNodeModule: isAbsolute('/test') })
}
export const config = { runtime: 'experimental-edge' }
```
Desired error (+ source code highlight in dev):
> The edge runtime does not support Node.js 'path' module
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
Desired warning at build time:
> A Node.js module is loaded ('path' at line 2) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
- [x] in dev middleware, static, shows desired error on stderr
- [x] in dev route, static, shows desired error on stderr
- [x] in dev middleware, dynamic, shows desired error on stderr
- [x] in dev route, dynamic, shows desired error on stderr
- [x] in dev middleware, static, shows desired error on react error overlay
- [x] in dev route, static, shows desired error on react error overlay
- [x] in dev middleware, dynamic, shows desired error on react error overlay
- [x] in dev route, dynamic, shows desired error on react error overlay
- [x] builds middleware successfully, shows build warning, shows desired error on stderr on call
- [x] builds route successfully, shows build warning, shows desired error on stderr on call
### 3rd party modules not found
```js
// middleware.js
import { NextResponse } from 'next/server'
// static
import Unknown from 'unknown'
export default async function middleware() {
// dynamic
const Unknown = await import('unknown')
new Unknown()
return NextResponse.next()
}
```
export const config = { matcher: '/' }
```
```js
// pags/api/route.js
// static
import Unknown from 'unknown'
export default async function handle() {
// dynamic
const Unknown = await import('unknown')
return Response.json({ use3rdPartyModule: Unknown() })
}
export const config = { runtime: 'experimental-edge' }
```
Desired error (+ source code highlight in dev):
> Module not found: Can't resolve 'does-not-exist'
Learn More: https://nextjs.org/docs/messages/module-not-found
- [x] in dev middleware, static, shows desired error on stderr
- [x] in dev route, static, shows desired error on stderr
- [x] in dev middleware, dynamic, shows desired error on stderr
- [x] in dev route, dynamic, shows desired error on stderr
- [x] in dev middleware, static, shows desired error on react error overlay
- [x] in dev route, static, shows desired error on react error overlay
- [x] in dev middleware, dynamic, shows desired error on react error overlay
- [x] in dev route, dynamic, shows desired error on react error overlay
- [x] fails to build middleware, with desired error on stderr
- [x] fails to build route, with desired error on stderr
### unused node.js modules
```js
// middleware.js
import { NextResponse } from 'next/server'
export default async function middleware() {
if (process.exit) {
const { basename } = await import('path')
basename()
}
return NextResponse.next()
}
```
```js
// pags/api/route.js
export default async function handle() {
if (process.exit) {
const { basename } = await import('path')
basename()
}
return Response.json({ useNodeModule: false })
}
export const config = { runtime: 'experimental-edge' }
```
Desired warning at build time:
> A Node.js module is loaded ('path' at line 2) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
- [x] invoke middleware in dev with no error
- [x] invoke route in dev with no error
- [x] builds successfully, shows build warning, invoke middleware with no error
- [x] builds successfully, shows build warning, invoke api-route with no error
## Notes to reviewers
The strategy to implement this feature is to leverages webpack [externals](https://webpack.js.org/configuration/externals/#externals) and run a global `__unsupported_module()` function when using a node.js module from edge function's code.
For the record, I tried using [webpack resolve.fallback](https://webpack.js.org/configuration/resolve/#resolvefallback) and [Webpack.IgnorePlugin](https://webpack.js.org/plugins/ignore-plugin/) but they do not allow throwing proper errors at runtime that would contain the loaded module name for reporting.
`__unsupported_module()` is defined in `EdgeRuntime`, and returns a proxy that's throw on use (whether it's property access, function call, new operator... synchronous & promise-based styles).
However there's an issue with error reporting: webpack does not includes the import lines in the generated sourcemaps, preventing from displaying useful errors.
I extended our middleware-plugin to supplement the sourcemaps (when analyzing edge function code, it saves which module is imported from which file, together with line/column/source)
The react-dev-overlay was adapted to look for this additional information when the caught error relates to modules, instead of looking at sourcemaps.
I removed the previous mechanism (built by @nkzawa ) which caught webpack errors at built time to change the displayed error message (files `next/build/index.js`, `next/build/utils.ts` and `wellknown-errors-plugin`)
2022-07-06 22:54:44 +02:00
|
|
|
errorMessage: err.message,
|
|
|
|
compilation,
|
2021-08-27 14:29:30 +02:00
|
|
|
})
|
|
|
|
|
|
|
|
if (originalFrame) {
|
|
|
|
const { originalCodeFrame, originalStackFrame } = originalFrame
|
|
|
|
const { file, lineNumber, column, methodName } = originalStackFrame
|
|
|
|
|
2022-07-05 23:33:58 +02:00
|
|
|
Log[type === 'warning' ? 'warn' : 'error'](
|
|
|
|
`${file} (${lineNumber}:${column}) @ ${methodName}`
|
2021-08-27 14:29:30 +02:00
|
|
|
)
|
2022-08-12 15:01:19 +02:00
|
|
|
if (src === COMPILER_NAMES.edgeServer) {
|
fix(edge): error handling for edge route and middleware is inconsistent (#38401)
## What’s in there?
This PR brings more consistency in how errors and warnings are reported when running code in the Edge Runtime:
- Dynamic code evaluation (`eval()`, `new Function()`, `WebAssembly.instantiate()`, `WebAssembly.compile()`…)
- Usage of Node.js global APIs (`BroadcastChannel`, `Buffer`, `TextDecoderStream`, `setImmediate()`...)
- Usage of Node.js modules (`fs`, `path`, `child_process`…)
The new error messages should mention *Edge Runtime* instead of *Middleware*, so they are valid in both cases.
It also fixes a bug where the process polyfill would issue a warning for `process.cwd` (which is `undefined` but legit). Now, one has to invoke the function `process.cwd()` to trigger the error.
It finally fixes the react-dev-overlay, where links from middleware and Edge API route files could not be opened because of the `(middleware)/` prefix in their name.
About the later, please note that we can’t easily remove the prefix or change it for Edge API routes. It comes from the Webpack layer, which is the same for both. We may consider renaming it to *edge* instead in the future.
## How to test?
These changes are almost fully covered with tests:
```bash
pnpm testheadless --testPathPattern runtime-dynamic
pnpm testheadless --testPathPattern runtime-with-node
pnpm testheadless --testPathPattern runtime-module
pnpm testheadless --testPathPattern middleware-dev-errors
```
To try them out manually, you can write a middleware and Edge route files like these:
```jsx
// middleware.js
import { NextResponse } from 'next/server'
import { basename } from 'path'
export default async function middleware() {
eval('2+2')
setImmediate(() => {})
basename()
return NextResponse.next()
}
export const config = { matcher: '/' }
```
```jsx
// pages/api/route.js
import { basename } from 'path'
export default async function handle() {
eval('2+2')
setImmediate(() => {})
basename()
return Response.json({ ok: true })
}
export const config = { runtime: 'experimental-edge' }
```
The expected behaviours are:
- [x] dev, middleware/edge route is using a node.js module: error at runtime (logs + read-dev-overlay):
```bash
error - (middleware)/pages/api/route.js (1:0) @ Object.handle [as handler]
error - The edge runtime does not support Node.js 'path' module.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
> 1 | import { basename } from "path";
2 | export default async function handle() {
```
- [x] build, middleware/edge route is using a node.js module: warning but succeeds
```bash
warn - Compiled with warnings
./middleware.js
A Node.js module is loaded ('path' at line 4) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
./pages/api/route.js
A Node.js module is loaded ('path' at line 1) which is not supported in the Edge Runtime.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
```
- [x] production, middleware/edge route is using a node.js module: error at runtime (logs + 500 error)
```bash
Error: The edge runtime does not support Node.js 'path' module.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
at <unknown> (file:///Users/damien/dev/next.js/packages/next/server/web/sandbox/context.ts:149)
```
- [x] dev, middleware/edge route is using a node.js global API: error at runtime (logs + read-dev-overlay):
```bash
error - (middleware)/pages/api/route.js (4:2) @ Object.handle [as handler]
error - A Node.js API is used (setImmediate) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime
2 |
3 | export default async function handle() {
> 4 | setImmediate(() => {})
| ^
```
- [x] build, middleware/edge route is using a node.js global API: warning but succeeds
```bash
warn - Compiled with warnings
./middleware.js
A Node.js API is used (setImmediate at line: 6) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime
./pages/api/route.js
A Node.js API is used (setImmediate at line: 3) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime
```
- [x] production, middleware/edge route is using a node.js module: error at runtime (logs + 500 error)
```bash
Error: A Node.js API is used (setImmediate) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime
at <unknown> (file:///Users/damien/dev/next.js/packages/next/server/web/sandbox/context.ts:330)
```
- [x] dev, middleware/edge route is loading dynamic code: warning at runtime (logs + read-dev-overlay) and request succeeds (we allow dynamic code in dev only):
```bash
warn - (middleware)/middleware.js (7:2) @ Object.middleware [as handler]
warn - Dynamic Code Evaluation (e. g. 'eval', 'new Function') not allowed in Edge Runtime
5 |
6 | export default async function middleware() {
> 7 | eval('2+2')
```
- [x] build, middleware/edge route is loading dynamic code: build fails with error:
```bash
Failed to compile.
./middleware.js
Dynamic Code Evaluation (e. g. 'eval', 'new Function', 'WebAssembly.compile') not allowed in Edge Runtime
Used by default
./pages/api/route.js
Dynamic Code Evaluation (e. g. 'eval', 'new Function', 'WebAssembly.compile') not allowed in Edge Runtime
Used by default
```
## Notes to reviewers
Edge-related errors are either issued from `next/server/web/sandbox/context.ts` file (runtime errors) or from `next/build/webpack/plugins/middleware-plugin.ts` (webpack compilation).
The previous implementation (I’m pleading guilty here) was way too verbose: some errors (Node.js global APIs like using `process.cwd()`) could be reported several times, and the previous mechanism to dedupe them (in middleware-plugin) wasn’t really effective.
Changes in tests are due to renaming existing tests such as `test/integration/middleware-with-node.js-apis` into `test/integration/edge-runtime-with-node.js-apis`. I extended them to cover Edge API route.
@hanneslund I’ve pushed the improvement you did in https://github.com/vercel/next.js/pull/38289/ one step further to avoid duplication.
2022-07-21 16:53:23 +02:00
|
|
|
err = err.message
|
|
|
|
}
|
|
|
|
if (type === 'warning') {
|
2022-07-05 23:33:58 +02:00
|
|
|
Log.warn(err)
|
|
|
|
} else if (type) {
|
|
|
|
Log.error(`${type}:`, err)
|
|
|
|
} else {
|
|
|
|
Log.error(err)
|
|
|
|
}
|
|
|
|
console[type === 'warning' ? 'warn' : 'error'](originalCodeFrame)
|
2021-08-27 14:29:30 +02:00
|
|
|
usedOriginalStack = true
|
|
|
|
}
|
|
|
|
}
|
|
|
|
} catch (_) {
|
|
|
|
// failed to load original stack using source maps
|
|
|
|
// this un-actionable by users so we don't show the
|
|
|
|
// internal error and only show the provided stack
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
if (!usedOriginalStack) {
|
2021-11-05 21:48:43 +01:00
|
|
|
if (type === 'warning') {
|
2022-05-11 19:02:15 +02:00
|
|
|
Log.warn(err)
|
2021-11-05 21:48:43 +01:00
|
|
|
} else if (type) {
|
2022-05-11 19:02:15 +02:00
|
|
|
Log.error(`${type}:`, err)
|
2021-08-27 14:29:30 +02:00
|
|
|
} else {
|
2022-05-11 19:02:15 +02:00
|
|
|
Log.error(err)
|
2021-08-27 14:29:30 +02:00
|
|
|
}
|
|
|
|
}
|
2018-09-28 14:05:23 +02:00
|
|
|
}
|
|
|
|
|
2019-11-09 23:34:53 +01:00
|
|
|
// override production loading of routes-manifest
|
2020-06-09 22:16:23 +02:00
|
|
|
protected getCustomRoutes(): CustomRoutes {
|
|
|
|
// actual routes will be loaded asynchronously during .prepare()
|
2021-03-26 16:19:48 +01:00
|
|
|
return {
|
|
|
|
redirects: [],
|
|
|
|
rewrites: { beforeFiles: [], afterFiles: [], fallback: [] },
|
|
|
|
headers: [],
|
|
|
|
}
|
2019-11-09 23:34:53 +01:00
|
|
|
}
|
|
|
|
|
2020-02-12 02:16:42 +01:00
|
|
|
private _devCachedPreviewProps: __ApiPreviewProps | undefined
|
|
|
|
protected getPreviewProps() {
|
|
|
|
if (this._devCachedPreviewProps) {
|
|
|
|
return this._devCachedPreviewProps
|
|
|
|
}
|
|
|
|
return (this._devCachedPreviewProps = {
|
|
|
|
previewModeId: crypto.randomBytes(16).toString('hex'),
|
|
|
|
previewModeSigningKey: crypto.randomBytes(32).toString('hex'),
|
|
|
|
previewModeEncryptionKey: crypto.randomBytes(32).toString('hex'),
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
2021-12-07 02:14:55 +01:00
|
|
|
protected getPagesManifest(): undefined {
|
|
|
|
return undefined
|
|
|
|
}
|
|
|
|
|
2022-05-25 11:46:26 +02:00
|
|
|
protected getAppPathsManifest(): undefined {
|
2022-05-03 12:37:23 +02:00
|
|
|
return undefined
|
|
|
|
}
|
|
|
|
|
2022-05-19 17:46:21 +02:00
|
|
|
protected getMiddleware() {
|
2022-07-30 01:37:59 +02:00
|
|
|
return this.middleware
|
2021-12-07 02:14:55 +01:00
|
|
|
}
|
|
|
|
|
2022-06-21 21:04:48 +02:00
|
|
|
protected getEdgeFunctions() {
|
|
|
|
return this.edgeFunctions ?? []
|
|
|
|
}
|
|
|
|
|
2022-02-08 14:16:46 +01:00
|
|
|
protected getServerComponentManifest() {
|
|
|
|
return undefined
|
|
|
|
}
|
|
|
|
|
2022-08-12 15:01:19 +02:00
|
|
|
protected getServerCSSManifest() {
|
|
|
|
return undefined
|
|
|
|
}
|
|
|
|
|
2022-09-22 07:12:59 +02:00
|
|
|
protected getFontLoaderManifest() {
|
|
|
|
return undefined
|
|
|
|
}
|
|
|
|
|
2022-07-30 23:45:58 +02:00
|
|
|
protected async hasMiddleware(): Promise<boolean> {
|
|
|
|
return this.hasPage(this.actualMiddlewareFile!)
|
2021-10-20 19:52:11 +02:00
|
|
|
}
|
|
|
|
|
2022-07-30 23:45:58 +02:00
|
|
|
protected async ensureMiddleware() {
|
2022-09-06 19:03:21 +02:00
|
|
|
return this.hotReloader!.ensurePage({
|
|
|
|
page: this.actualMiddlewareFile!,
|
|
|
|
clientOnly: false,
|
|
|
|
})
|
2022-07-30 23:45:58 +02:00
|
|
|
}
|
|
|
|
|
2022-09-06 19:03:21 +02:00
|
|
|
protected async ensureEdgeFunction({
|
|
|
|
page,
|
|
|
|
appPaths,
|
|
|
|
}: {
|
|
|
|
page: string
|
|
|
|
appPaths: string[] | null
|
|
|
|
}) {
|
|
|
|
return this.hotReloader!.ensurePage({ page, appPaths, clientOnly: false })
|
2021-10-20 19:52:11 +02:00
|
|
|
}
|
|
|
|
|
2019-10-04 18:11:39 +02:00
|
|
|
generateRoutes() {
|
2022-04-06 16:35:52 +02:00
|
|
|
const { fsRoutes, ...otherRoutes } = super.generateRoutes()
|
2018-09-28 14:05:23 +02:00
|
|
|
|
|
|
|
// In development we expose all compiled files for react-error-overlay's line show feature
|
|
|
|
// We use unshift so that we're sure the routes is defined before Next's default routes
|
2022-04-06 16:35:52 +02:00
|
|
|
fsRoutes.unshift({
|
2022-04-27 11:50:29 +02:00
|
|
|
match: getPathMatch('/_next/development/:path*'),
|
2019-11-18 01:12:48 +01:00
|
|
|
type: 'route',
|
|
|
|
name: '_next/development catchall',
|
2018-09-28 14:05:23 +02:00
|
|
|
fn: async (req, res, params) => {
|
2020-06-01 23:00:22 +02:00
|
|
|
const p = pathJoin(this.distDir, ...(params.path || []))
|
2018-09-28 14:05:23 +02:00
|
|
|
await this.serveStatic(req, res, p)
|
2019-11-18 01:12:48 +01:00
|
|
|
return {
|
|
|
|
finished: true,
|
|
|
|
}
|
2019-10-04 18:11:39 +02:00
|
|
|
},
|
2018-09-28 14:05:23 +02:00
|
|
|
})
|
|
|
|
|
2022-04-06 16:35:52 +02:00
|
|
|
fsRoutes.unshift({
|
2022-04-27 11:50:29 +02:00
|
|
|
match: getPathMatch(
|
2020-08-13 14:39:36 +02:00
|
|
|
`/_next/${CLIENT_STATIC_FILES_PATH}/${this.buildId}/${DEV_CLIENT_PAGES_MANIFEST}`
|
|
|
|
),
|
|
|
|
type: 'route',
|
|
|
|
name: `_next/${CLIENT_STATIC_FILES_PATH}/${this.buildId}/${DEV_CLIENT_PAGES_MANIFEST}`,
|
|
|
|
fn: async (_req, res) => {
|
|
|
|
res.statusCode = 200
|
|
|
|
res.setHeader('Content-Type', 'application/json; charset=utf-8')
|
2022-01-14 22:01:35 +01:00
|
|
|
res
|
|
|
|
.body(
|
|
|
|
JSON.stringify({
|
|
|
|
pages: this.sortedRoutes,
|
|
|
|
})
|
|
|
|
)
|
|
|
|
.send()
|
2020-08-13 14:39:36 +02:00
|
|
|
return {
|
|
|
|
finished: true,
|
|
|
|
}
|
|
|
|
},
|
|
|
|
})
|
|
|
|
|
2022-04-06 16:35:52 +02:00
|
|
|
fsRoutes.unshift({
|
2022-04-27 11:50:29 +02:00
|
|
|
match: getPathMatch(
|
2021-10-22 08:40:57 +02:00
|
|
|
`/_next/${CLIENT_STATIC_FILES_PATH}/${this.buildId}/${DEV_MIDDLEWARE_MANIFEST}`
|
|
|
|
),
|
|
|
|
type: 'route',
|
|
|
|
name: `_next/${CLIENT_STATIC_FILES_PATH}/${this.buildId}/${DEV_MIDDLEWARE_MANIFEST}`,
|
|
|
|
fn: async (_req, res) => {
|
|
|
|
res.statusCode = 200
|
|
|
|
res.setHeader('Content-Type', 'application/json; charset=utf-8')
|
feat(next): Support has match and locale option on middleware config (#39257)
## Feature
As the title, support `has` match, `local` that works the same with the `rewrites` and `redirects` of next.config.js on middleware config. With this PR, you can write the config like the following:
```js
export const config = {
matcher: [
"/foo",
{ source: "/bar" },
{
source: "/baz",
has: [
{
type: 'header',
key: 'x-my-header',
value: 'my-value',
}
]
},
{
source: "/en/asdf",
locale: false,
},
]
}
```
Also, fixes https://github.com/vercel/next.js/issues/39428
related https://github.com/vercel/edge-functions/issues/178, https://github.com/vercel/edge-functions/issues/179
- [x] 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`
- [x] 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`
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-08-31 18:23:30 +02:00
|
|
|
res.body(JSON.stringify(this.getMiddleware()?.matchers ?? [])).send()
|
2021-10-22 08:40:57 +02:00
|
|
|
return {
|
|
|
|
finished: true,
|
|
|
|
}
|
|
|
|
},
|
|
|
|
})
|
2021-10-20 19:52:11 +02:00
|
|
|
|
2020-02-11 00:06:38 +01:00
|
|
|
fsRoutes.push({
|
2022-04-27 11:50:29 +02:00
|
|
|
match: getPathMatch('/:path*'),
|
2020-02-11 00:06:38 +01:00
|
|
|
type: 'route',
|
2020-07-12 21:03:49 +02:00
|
|
|
name: 'catchall public directory route',
|
2020-02-11 00:06:38 +01:00
|
|
|
fn: async (req, res, params, parsedUrl) => {
|
|
|
|
const { pathname } = parsedUrl
|
|
|
|
if (!pathname) {
|
|
|
|
throw new Error('pathname is undefined')
|
|
|
|
}
|
|
|
|
|
|
|
|
// Used in development to check public directory paths
|
|
|
|
if (await this._beforeCatchAllRender(req, res, params, parsedUrl)) {
|
|
|
|
return {
|
|
|
|
finished: true,
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
return {
|
|
|
|
finished: false,
|
|
|
|
}
|
|
|
|
},
|
|
|
|
})
|
|
|
|
|
2022-04-06 16:35:52 +02:00
|
|
|
return { fsRoutes, ...otherRoutes }
|
2018-09-28 14:05:23 +02:00
|
|
|
}
|
|
|
|
|
2019-05-03 18:57:47 +02:00
|
|
|
// In development public files are not added to the router but handled as a fallback instead
|
2020-05-18 19:31:06 +02:00
|
|
|
protected generatePublicRoutes(): never[] {
|
2019-05-03 18:57:47 +02:00
|
|
|
return []
|
|
|
|
}
|
|
|
|
|
2019-05-27 20:20:33 +02:00
|
|
|
// In development dynamic routes cannot be known ahead of time
|
2020-05-18 19:31:06 +02:00
|
|
|
protected getDynamicRoutes(): never[] {
|
2019-05-27 20:20:33 +02:00
|
|
|
return []
|
|
|
|
}
|
|
|
|
|
2019-10-04 18:11:39 +02:00
|
|
|
_filterAmpDevelopmentScript(
|
|
|
|
html: string,
|
|
|
|
event: { line: number; col: number; code: string }
|
2020-05-18 19:31:06 +02:00
|
|
|
): boolean {
|
2019-03-19 00:21:18 +01:00
|
|
|
if (event.code !== 'DISALLOWED_SCRIPT_TAG') {
|
|
|
|
return true
|
|
|
|
}
|
|
|
|
|
|
|
|
const snippetChunks = html.split('\n')
|
|
|
|
|
|
|
|
let snippet
|
|
|
|
if (
|
|
|
|
!(snippet = html.split('\n')[event.line - 1]) ||
|
|
|
|
!(snippet = snippet.substring(event.col))
|
|
|
|
) {
|
|
|
|
return true
|
|
|
|
}
|
|
|
|
|
|
|
|
snippet = snippet + snippetChunks.slice(event.line).join('\n')
|
|
|
|
snippet = snippet.substring(0, snippet.indexOf('</script>'))
|
|
|
|
|
|
|
|
return !snippet.includes('data-amp-development-mode-only')
|
|
|
|
}
|
|
|
|
|
2022-09-19 20:05:28 +02:00
|
|
|
protected async getStaticPaths({
|
|
|
|
pathname,
|
|
|
|
originalAppPath,
|
|
|
|
}: {
|
|
|
|
pathname: string
|
|
|
|
originalAppPath?: string
|
|
|
|
}): Promise<{
|
|
|
|
staticPaths?: string[]
|
|
|
|
fallbackMode?: false | 'static' | 'blocking'
|
2020-07-01 16:59:18 +02:00
|
|
|
}> {
|
|
|
|
// we lazy load the staticPaths to prevent the user
|
|
|
|
// from waiting on them for the page to load in dev mode
|
|
|
|
|
|
|
|
const __getStaticPaths = async () => {
|
2021-10-22 01:04:40 +02:00
|
|
|
const {
|
|
|
|
configFileName,
|
|
|
|
publicRuntimeConfig,
|
|
|
|
serverRuntimeConfig,
|
|
|
|
httpAgentOptions,
|
2022-09-27 22:37:28 +02:00
|
|
|
experimental: { enableUndici },
|
2021-10-22 01:04:40 +02:00
|
|
|
} = this.nextConfig
|
2020-10-27 16:30:34 +01:00
|
|
|
const { locales, defaultLocale } = this.nextConfig.i18n || {}
|
2020-08-04 18:47:37 +02:00
|
|
|
|
2022-09-19 20:05:28 +02:00
|
|
|
const pathsResult = await this.getStaticPathsWorker().loadStaticPaths({
|
|
|
|
distDir: this.distDir,
|
2020-07-01 16:59:18 +02:00
|
|
|
pathname,
|
2022-09-19 20:05:28 +02:00
|
|
|
serverless: !this.renderOpts.dev && this._isLikeServerless,
|
|
|
|
config: {
|
2021-10-22 01:04:40 +02:00
|
|
|
configFileName,
|
2020-08-04 18:47:37 +02:00
|
|
|
publicRuntimeConfig,
|
|
|
|
serverRuntimeConfig,
|
2020-10-07 23:11:01 +02:00
|
|
|
},
|
2021-08-03 02:38:42 +02:00
|
|
|
httpAgentOptions,
|
2022-09-27 22:37:28 +02:00
|
|
|
enableUndici,
|
2020-10-07 23:11:01 +02:00
|
|
|
locales,
|
2022-09-19 20:05:28 +02:00
|
|
|
defaultLocale,
|
|
|
|
originalAppPath,
|
|
|
|
isAppPath: !!originalAppPath,
|
|
|
|
})
|
|
|
|
return pathsResult
|
2020-07-01 16:59:18 +02:00
|
|
|
}
|
2020-08-04 17:10:31 +02:00
|
|
|
const { paths: staticPaths, fallback } = (
|
2020-07-01 16:59:18 +02:00
|
|
|
await withCoalescedInvoke(__getStaticPaths)(`staticPaths-${pathname}`, [])
|
|
|
|
).value
|
|
|
|
|
2020-08-04 17:10:31 +02:00
|
|
|
return {
|
|
|
|
staticPaths,
|
|
|
|
fallbackMode:
|
2020-10-27 05:01:37 +01:00
|
|
|
fallback === 'blocking'
|
2020-08-04 17:10:31 +02:00
|
|
|
? 'blocking'
|
|
|
|
: fallback === true
|
|
|
|
? 'static'
|
2022-09-19 20:05:28 +02:00
|
|
|
: fallback,
|
2020-08-04 17:10:31 +02:00
|
|
|
}
|
2020-07-01 16:59:18 +02:00
|
|
|
}
|
|
|
|
|
2022-08-12 15:01:19 +02:00
|
|
|
protected async ensureApiPage(pathname: string): Promise<void> {
|
2022-09-06 19:03:21 +02:00
|
|
|
return this.hotReloader!.ensurePage({ page: pathname, clientOnly: false })
|
2019-05-11 13:18:56 +02:00
|
|
|
}
|
|
|
|
|
2022-09-06 19:03:21 +02:00
|
|
|
protected async findPageComponents({
|
|
|
|
pathname,
|
|
|
|
query,
|
|
|
|
params,
|
|
|
|
isAppPath,
|
|
|
|
appPaths,
|
|
|
|
}: {
|
|
|
|
pathname: string
|
|
|
|
query: ParsedUrlQuery
|
|
|
|
params: Params
|
2022-09-03 02:13:47 +02:00
|
|
|
isAppPath: boolean
|
2022-09-06 19:03:21 +02:00
|
|
|
appPaths?: string[] | null
|
|
|
|
}): Promise<FindComponentsResult | null> {
|
2020-06-26 06:26:09 +02:00
|
|
|
await this.devReady
|
2018-09-28 14:05:23 +02:00
|
|
|
const compilationErr = await this.getCompilationError(pathname)
|
|
|
|
if (compilationErr) {
|
2021-06-30 01:02:10 +02:00
|
|
|
// Wrap build errors so that they don't get logged again
|
|
|
|
throw new WrappedBuildError(compilationErr)
|
2018-09-28 14:05:23 +02:00
|
|
|
}
|
2018-11-03 01:24:43 +01:00
|
|
|
try {
|
2022-09-06 19:03:21 +02:00
|
|
|
await this.hotReloader!.ensurePage({
|
|
|
|
page: pathname,
|
|
|
|
appPaths,
|
|
|
|
clientOnly: false,
|
|
|
|
})
|
2022-02-08 14:16:46 +01:00
|
|
|
|
|
|
|
// When the new page is compiled, we need to reload the server component
|
|
|
|
// manifest.
|
2022-10-05 00:16:44 +02:00
|
|
|
if (!!this.appDir) {
|
2022-02-08 14:16:46 +01:00
|
|
|
this.serverComponentManifest = super.getServerComponentManifest()
|
2022-08-12 15:01:19 +02:00
|
|
|
this.serverCSSManifest = super.getServerCSSManifest()
|
2022-02-08 14:16:46 +01:00
|
|
|
}
|
2022-09-22 07:12:59 +02:00
|
|
|
this.fontLoaderManifest = super.getFontLoaderManifest()
|
2022-02-08 14:16:46 +01:00
|
|
|
|
2022-09-06 19:03:21 +02:00
|
|
|
return super.findPageComponents({ pathname, query, params, isAppPath })
|
2018-11-03 01:24:43 +01:00
|
|
|
} catch (err) {
|
2021-06-30 01:02:10 +02:00
|
|
|
if ((err as any).code !== 'ENOENT') {
|
|
|
|
throw err
|
2018-11-03 01:24:43 +01:00
|
|
|
}
|
2021-06-30 01:02:10 +02:00
|
|
|
return null
|
2018-11-03 01:24:43 +01:00
|
|
|
}
|
2018-09-28 14:05:23 +02:00
|
|
|
}
|
|
|
|
|
2021-06-30 01:02:10 +02:00
|
|
|
protected async getFallbackErrorComponents(): Promise<LoadComponentsReturnType | null> {
|
|
|
|
await this.hotReloader!.buildFallbackError()
|
|
|
|
// Build the error page to ensure the fallback is built too.
|
|
|
|
// TODO: See if this can be moved into hotReloader or removed.
|
2022-09-06 19:03:21 +02:00
|
|
|
await this.hotReloader!.ensurePage({ page: '/_error', clientOnly: false })
|
2022-03-11 21:38:09 +01:00
|
|
|
return await loadDefaultErrorComponents(this.distDir)
|
2018-09-28 14:05:23 +02:00
|
|
|
}
|
|
|
|
|
2022-01-14 22:01:35 +01:00
|
|
|
protected setImmutableAssetCacheControl(res: BaseNextResponse): void {
|
2018-09-28 14:05:23 +02:00
|
|
|
res.setHeader('Cache-Control', 'no-store, must-revalidate')
|
|
|
|
}
|
|
|
|
|
2020-03-26 17:58:15 +01:00
|
|
|
private servePublic(
|
2022-01-14 22:01:35 +01:00
|
|
|
req: BaseNextRequest,
|
|
|
|
res: BaseNextResponse,
|
2020-03-26 17:58:15 +01:00
|
|
|
pathParts: string[]
|
2020-05-18 19:31:06 +02:00
|
|
|
): Promise<void> {
|
2020-09-24 08:05:40 +02:00
|
|
|
const p = pathJoin(this.publicDir, ...pathParts)
|
2019-05-03 18:57:47 +02:00
|
|
|
return this.serveStatic(req, res, p)
|
|
|
|
}
|
|
|
|
|
2020-05-18 19:31:06 +02:00
|
|
|
async hasPublicFile(path: string): Promise<boolean> {
|
2019-09-16 23:06:30 +02:00
|
|
|
try {
|
2020-06-01 23:00:22 +02:00
|
|
|
const info = await fs.promises.stat(pathJoin(this.publicDir, path))
|
2019-09-16 23:06:30 +02:00
|
|
|
return info.isFile()
|
|
|
|
} catch (_) {
|
|
|
|
return false
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-05-18 19:31:06 +02:00
|
|
|
async getCompilationError(page: string): Promise<any> {
|
2019-10-04 18:11:39 +02:00
|
|
|
const errors = await this.hotReloader!.getCompilationErrors(page)
|
2018-09-28 14:05:23 +02:00
|
|
|
if (errors.length === 0) return
|
|
|
|
|
|
|
|
// Return the very first error we found.
|
|
|
|
return errors[0]
|
|
|
|
}
|
2020-03-26 17:58:15 +01:00
|
|
|
|
|
|
|
protected isServeableUrl(untrustedFileUrl: string): boolean {
|
|
|
|
// This method mimics what the version of `send` we use does:
|
|
|
|
// 1. decodeURIComponent:
|
|
|
|
// https://github.com/pillarjs/send/blob/0.17.1/index.js#L989
|
|
|
|
// https://github.com/pillarjs/send/blob/0.17.1/index.js#L518-L522
|
|
|
|
// 2. resolve:
|
|
|
|
// https://github.com/pillarjs/send/blob/de073ed3237ade9ff71c61673a34474b30e5d45b/index.js#L561
|
|
|
|
|
|
|
|
let decodedUntrustedFilePath: string
|
|
|
|
try {
|
|
|
|
// (1) Decode the URL so we have the proper file name
|
|
|
|
decodedUntrustedFilePath = decodeURIComponent(untrustedFileUrl)
|
|
|
|
} catch {
|
|
|
|
return false
|
|
|
|
}
|
|
|
|
|
|
|
|
// (2) Resolve "up paths" to determine real request
|
2020-06-01 23:00:22 +02:00
|
|
|
const untrustedFilePath = pathResolve(decodedUntrustedFilePath)
|
2020-03-26 17:58:15 +01:00
|
|
|
|
|
|
|
// don't allow null bytes anywhere in the file path
|
|
|
|
if (untrustedFilePath.indexOf('\0') !== -1) {
|
|
|
|
return false
|
|
|
|
}
|
|
|
|
|
|
|
|
// During development mode, files can be added while the server is running.
|
|
|
|
// Checks for .next/static, .next/server, static and public.
|
|
|
|
// Note that in development .next/server is available for error reporting purposes.
|
2021-06-30 13:44:40 +02:00
|
|
|
// see `packages/next/server/next-server.ts` for more details.
|
2020-03-26 17:58:15 +01:00
|
|
|
if (
|
2020-06-01 23:00:22 +02:00
|
|
|
untrustedFilePath.startsWith(pathJoin(this.distDir, 'static') + sep) ||
|
|
|
|
untrustedFilePath.startsWith(pathJoin(this.distDir, 'server') + sep) ||
|
|
|
|
untrustedFilePath.startsWith(pathJoin(this.dir, 'static') + sep) ||
|
|
|
|
untrustedFilePath.startsWith(pathJoin(this.dir, 'public') + sep)
|
2020-03-26 17:58:15 +01:00
|
|
|
) {
|
|
|
|
return true
|
|
|
|
}
|
|
|
|
|
|
|
|
return false
|
|
|
|
}
|
2018-09-28 14:05:23 +02:00
|
|
|
}
|