Skip to content

Commit 2436651

Browse files
authored
add new common issue: access denied errors on routes during page refresh and direct url access (#438)
1 parent 1524dd3 commit 2436651

File tree

1 file changed

+29
-7
lines changed

1 file changed

+29
-7
lines changed

docs/pages/common_issues.mdx

Lines changed: 29 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
#### Debug mode
1+
#### Debug mode
22

3-
OpenNext can be executed in debug mode by setting the environment variable `OPEN_NEXT_DEBUG=true`.
3+
OpenNext can be executed in debug mode by setting the environment variable `OPEN_NEXT_DEBUG=true`.
44

55
This will output **A LOT** of additional logs to the console.This also disable minifying in esbuild, and add source maps to the output. This can result in code that might be up to 2-3X larger than the production build. **Do not enable this in production**
66

@@ -23,20 +23,42 @@ experimental: {
2323
},
2424
},
2525
```
26+
2627
Also you should not add sharp as a dependencies unless absolutely necessary, the image optimization already has it's own version of sharp.
2728

2829
#### Patch fetch behaviour for ISR. Only for [email protected]+
2930

30-
If you use ISR and fetch in your app, you may encounter a bug that makes your revalidate values inconsistent.
31+
If you use ISR and fetch in your app, you may encounter a bug that makes your revalidate values inconsistent.
3132
The issue is that it revalidates using the lowest revalidate of all fetch calls in your page, regardless of their individual values. To fix this bug, you need to modify the fetch function in your root layout component with the following code snippet
3233

3334
```ts
3435
export default function RootLayout() {
35-
const asyncStorage = require("next/dist/client/components/static-generation-async-storage.external");
36+
const asyncStorage = require('next/dist/client/components/static-generation-async-storage.external');
3637
//@ts-ignore
37-
const staticStore = (fetch as any).__nextGetStaticStore?.() || asyncStorage.staticGenerationAsyncStorage;
38+
const staticStore =
39+
(fetch as any).__nextGetStaticStore?.() ||
40+
asyncStorage.staticGenerationAsyncStorage;
3841
const store = staticStore.getStore();
39-
store.isOnDemandRevalidate = store.isOnDemandRevalidate && !(process.env.OPEN_NEXT_ISR === 'true');
42+
store.isOnDemandRevalidate =
43+
store.isOnDemandRevalidate && !(process.env.OPEN_NEXT_ISR === 'true');
4044
return <>...</>;
4145
}
42-
```
46+
```
47+
48+
#### Access Denied errors on routes during page refresh and direct URL access
49+
50+
If you are refreshing a dynamic/static route or going to that route directly from an URL. Like this route f.ex:
51+
`/profile/[userId]/[id]`, and you are getting an `Access Denied` error in XML:
52+
53+
```xml
54+
<Error>
55+
<Code>AccessDenied</Code>
56+
<Message>Access Denied</Message>
57+
<RequestId>R4E6T9G2Q1S0Z5X8</RequestId>
58+
<HostId>S7h9F3g2T0z5K8d6A2s1W4x3C7v8B9m2L0j3K4i7H8g9F0r3A5q8w9E8r7t6Y5h4U3i2O1p0</HostId>
59+
</Error>
60+
```
61+
62+
This can also happen in app router when a client navigates via NextJS `<Link>` component.
63+
64+
The issue might be that your having a folder or file in your `public` directory with an overlapping between the name and your route. In this case, you should rename that to something else.

0 commit comments

Comments
 (0)