Skip to content

Commit

Permalink
docs: update ISR self-hosting example code (vercel#74211)
Browse files Browse the repository at this point in the history
Co-authored-by: JJ Kasper <jj@jjsweb.site>
  • Loading branch information
leerob and ijjk authored Dec 22, 2024
1 parent 790efc5 commit 72b52e7
Showing 1 changed file with 50 additions and 45 deletions.
95 changes: 50 additions & 45 deletions docs/01-app/03-building-your-application/10-deploying/index.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -220,11 +220,15 @@ module.exports = class CacheHandler {
// Iterate over all entries in the cache
for (let [key, value] of cache) {
// If the value's tags include the specified tag, delete this entry
if (value.tags.some((tag) => tags.include(tag))) {
if (value.tags.some((tag) => tags.includes(tag))) {
cache.delete(key)
}
}
}

// If you want to have temporary in memory cache for a single request that is reset
// before the next request you can leverage this method
public resetRequestCache() {}
}
```

Expand Down Expand Up @@ -310,50 +314,51 @@ If you want to use `after` on custom infrastructure, check your provider documen
<details id="after-serverless">
<summary>Reference: supporting `after` for serverless platforms</summary>
Using `after` in a serverless context requires waiting for asynchronous tasks to finish after the response has been sent. In Next.js and Vercel, this is achieved using a primitive called `waitUntil(promise)`, which extends the lifetime of a serverless invocation until all promises passed to [`waitUntil`](https://vercel.com/docs/functions/functions-api-reference#waituntil) have settled.

If you want your users to be able to run `after`, you will have to provide your implementation of `waitUntil` that behaves in an analogous way.

When `after` is called, Next.js will access `waitUntil` like this:

```jsx
const RequestContext = globalThis[Symbol.for('@next/request-context')]
const contextValue = RequestContext?.get()
const waitUntil = context?.waitUntil
```
Which means that `globalThis[Symbol.for('@next/request-context')]` is expected to contain an object like this:
```tsx
type NextRequestContext = {
get(): NextRequestContextValue | undefined
}

type NextRequestContextValue = {
waitUntil?: (promise: Promise<any>) => void
}
```
Here is an example of the implementation.
```tsx
import { AsyncLocalStorage } from 'node:async_hooks'

const RequestContextStorage = new AsyncLocalStorage<NextRequestContextValue>()

// Define and inject the accessor that next.js will use
const RequestContext: NextRequestContext = {
get() {
return RequestContextStorage.getStore()
},
}
globalThis[Symbol.for('@next/request-context')] = RequestContext

const handler = (req, res) => {
const contextValue = { waitUntil: YOUR_WAITUNTIL }
// Provide the value
return RequestContextStorage.run(contextValue, () => nextJsHandler(req, res))
}
```

If you want your users to be able to run `after`, you will have to provide your implementation of `waitUntil` that behaves in an analogous way.

When `after` is called, Next.js will access `waitUntil` like this:

```jsx
const RequestContext = globalThis[Symbol.for('@next/request-context')]
const contextValue = RequestContext?.get()
const waitUntil = context?.waitUntil
```
Which means that `globalThis[Symbol.for('@next/request-context')]` is expected to contain an object like this:
```tsx
type NextRequestContext = {
get(): NextRequestContextValue | undefined
}

type NextRequestContextValue = {
waitUntil?: (promise: Promise<any>) => void
}
```
Here is an example of the implementation.
```tsx
import { AsyncLocalStorage } from 'node:async_hooks'

const RequestContextStorage = new AsyncLocalStorage<NextRequestContextValue>()

// Define and inject the accessor that next.js will use
const RequestContext: NextRequestContext = {
get() {
return RequestContextStorage.getStore()
},
}
globalThis[Symbol.for('@next/request-context')] = RequestContext

const handler = (req, res) => {
const contextValue = { waitUntil: YOUR_WAITUNTIL }
// Provide the value
return RequestContextStorage.run(contextValue, () => nextJsHandler(req, res))
}
```
</details>
</AppOnly>
Expand Down

0 comments on commit 72b52e7

Please sign in to comment.