質問編集履歴
4
自分のPC(Windows11)では事象が発生しないことを追記
test
CHANGED
File without changes
|
test
CHANGED
@@ -23,7 +23,8 @@
|
|
23
23
|
https://example.com/_next/image?url=https%3A%2F%2Fexample.net%2Fsample001.jpg&w=256&q=75
|
24
24
|
にアクセスすると200が返ってくる場合もありますし、しばらくして500が返ってくることもあります。
|
25
25
|
|
26
|
-
本事象は`yarn dev`で開発用で立ち上げた際、事象は発生せず、`yarn start`で立ち上げた場合、事象が発生いたします。
|
26
|
+
本事象は借用しているベアメタルの専用サーバー(AlmaLinux)で、`yarn dev`で開発用で立ち上げた際、事象は発生せず、`yarn start`で立ち上げた場合、事象が発生いたします。
|
27
|
+
自分のPC(Windows11)で`yarn start`で立ち上げた場合、事象は発生いたしません。
|
27
28
|
|
28
29
|
とりあえずの対処として、<Image>を<img>にすれば問題なく表示されることが分かったのですが、Next.jsの機能を使いたいので、解決する方法があればご教示頂きたいです。
|
29
30
|
以下の補足情報の通りnext.config.jsのimagesのremotePatternsは適切に設定しております。
|
3
出力されるエラーとyarn devで立ち上げた際にはエラーがでないことを追記
test
CHANGED
File without changes
|
test
CHANGED
@@ -10,6 +10,7 @@
|
|
10
10
|
></Image>
|
11
11
|
```
|
12
12
|
上記のImageタグが60個あるComponentを表示しようとすると画像によって500が返ってきます。
|
13
|
+

|
13
14
|
Imageのうち30個ほどは正常に表示される(200が返ってくる)のですが、30個ほどは500が返ってきてしまいます。
|
14
15
|
例えば
|
15
16
|
https://example.com/_next/image?url=https%3A%2F%2Fexample.net%2Fsample001.jpg&w=256&q=75
|
@@ -22,14 +23,93 @@
|
|
22
23
|
https://example.com/_next/image?url=https%3A%2F%2Fexample.net%2Fsample001.jpg&w=256&q=75
|
23
24
|
にアクセスすると200が返ってくる場合もありますし、しばらくして500が返ってくることもあります。
|
24
25
|
|
26
|
+
本事象は`yarn dev`で開発用で立ち上げた際、事象は発生せず、`yarn start`で立ち上げた場合、事象が発生いたします。
|
27
|
+
|
25
28
|
とりあえずの対処として、<Image>を<img>にすれば問題なく表示されることが分かったのですが、Next.jsの機能を使いたいので、解決する方法があればご教示頂きたいです。
|
26
29
|
以下の補足情報の通りnext.config.jsのimagesのremotePatternsは適切に設定しております。
|
30
|
+
|
31
|
+
500が返ってきた際のサーバーの応答は以下の通りです。
|
32
|
+
```
|
33
|
+
全般
|
34
|
+
リクエスト URL: https://discounted-video.dyndns.org/_next/image?url=https%3A%2F%2Fpics.dmm.co.jp%2Fdigital%2Fvideo%2Fipx00312%2Fipx00312ps.jpg&w=128&q=75
|
35
|
+
リクエスト メソッド: GET
|
36
|
+
ステータス コード: 500 (service worker から)
|
37
|
+
参照ポリシー: strict-origin-when-cross-origin
|
38
|
+
```
|
39
|
+
```html
|
40
|
+
レスポンス
|
41
|
+
<!DOCTYPE html>
|
42
|
+
<html lang="ja">
|
43
|
+
<head>
|
44
|
+
<style data-next-hide-fouc="true">body{display:none}</style>
|
45
|
+
<noscript data-next-hide-fouc="true">
|
46
|
+
<style>body{display:block}</style>
|
47
|
+
</noscript>
|
48
|
+
<meta charSet="utf-8"/>
|
49
|
+
<meta name="viewport" content="width=device-width"/>
|
50
|
+
<meta name="next-head-count" content="2"/>
|
51
|
+
<meta name="msapplication-square70x70logo" content="/site-tile-70x70.png"/>
|
52
|
+
<meta name="msapplication-square150x150logo" content="/site-tile-150x150.png"/>
|
53
|
+
<meta name="msapplication-wide310x150logo" content="/site-tile-310x150.png"/>
|
54
|
+
<meta name="msapplication-square310x310logo" content="/site-tile-310x310.png"/>
|
55
|
+
<meta name="msapplication-TileColor" content="#000"/>
|
56
|
+
<meta name="apple-mobile-web-app-capable" content="yes"/>
|
57
|
+
<meta name="apple-mobile-web-app-status-bar-style" content="#000"/>
|
58
|
+
<meta name="apple-mobile-web-app-title" content="myapp"/>
|
59
|
+
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon-180x180.png"/>
|
60
|
+
<meta name="application-name" content="myapp"/>
|
61
|
+
<meta name="theme-color" content="#000"/>
|
62
|
+
<meta name="description" content="this is myapp"/>
|
63
|
+
<link rel="icon" sizes="192x192" href="/icon-192x192.png"/>
|
64
|
+
<link rel="icon" href="/favicon.ico"/>
|
65
|
+
<link rel="manifest" href="/manifest.json"/>
|
66
|
+
<noscript data-n-css=""></noscript>
|
67
|
+
<script defer="" nomodule="" src="/_next/static/chunks/polyfills.js?ts=1678315631101"></script>
|
68
|
+
<script src="/_next/static/chunks/webpack.js?ts=1678315631101" defer=""></script>
|
69
|
+
<script src="/_next/static/chunks/main.js?ts=1678315631101" defer=""></script>
|
70
|
+
<script src="/_next/static/chunks/pages/_app.js?ts=1678315631101" defer=""></script>
|
71
|
+
<script src="/_next/static/chunks/pages/_error.js?ts=1678315631101" defer=""></script>
|
72
|
+
<script src="/_next/static/development/_buildManifest.js?ts=1678315631101" defer=""></script>
|
73
|
+
<script src="/_next/static/development/_ssgManifest.js?ts=1678315631101" defer=""></script>
|
74
|
+
<noscript id="__next_css__DO_NOT_USE__"></noscript>
|
75
|
+
<style data-emotion="mantine "></style>
|
76
|
+
</head>
|
77
|
+
<body>
|
78
|
+
<div id="__next"></div>
|
79
|
+
<script src="/_next/static/chunks/react-refresh.js?ts=1678315631101"></script>
|
80
|
+
<script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{"statusCode":500}},"page":"/_error","query":{"__NEXT_PAGE":"/_next/image"},"buildId":"development","isFallback":false,"err":{"name":"TypeError","source":"server","message":"fetch failed","stack":"TypeError: fetch failedn at Object.fetch (node:internal/deps/undici/undici:11118:11)n at processTicksAndRejections (node:internal/process/task_queues:95:5)n at runNextTicks (node:internal/process/task_queues:64:3)n at process.processImmediate (node:internal/timers:442:9)n at async imageOptimizer (/home/ap2/fanza/fanzaVideo/front/node_modules/next/dist/server/image-optimizer.js:473:29)n at async cacheEntry.imageResponseCache.get.incrementalCache (/home/ap2/fanza/fanzaVideo/front/node_modules/next/dist/server/next-server.js:238:72)n at async /home/ap2/fanza/fanzaVideo/front/node_modules/next/dist/server/response-cache/index.js:83:36"},"gip":true,"scriptLoader":[]}</script>
|
81
|
+
</body>
|
82
|
+
</html>
|
83
|
+
```
|
84
|
+
|
85
|
+
Nexs.jsのログは以下の通りです。
|
86
|
+
```
|
87
|
+
TypeError: fetch failed
|
88
|
+
at Object.fetch (node:internal/deps/undici/undici:11118:11)
|
89
|
+
at processTicksAndRejections (node:internal/process/task_queues:95:5)
|
90
|
+
at runNextTicks (node:internal/process/task_queues:64:3)
|
91
|
+
at process.processImmediate (node:internal/timers:442:9)
|
92
|
+
at async imageOptimizer (/home/ap2/fanza/fanzaVideo/front/node_modules/next/dist/server/image-optimizer.js:473:29)
|
93
|
+
at async cacheEntry.imageResponseCache.get.incrementalCache (/home/ap2/fanza/fanzaVideo/front/node_modules/next/dist/server/next-server.js:238:72)
|
94
|
+
at async /home/ap2/fanza/fanzaVideo/front/node_modules/next/dist/server/response-cache/index.js:83:36 {
|
95
|
+
cause: ConnectTimeoutError: Connect Timeout Error
|
96
|
+
at onConnectTimeout (node:internal/deps/undici/undici:6625:28)
|
97
|
+
at node:internal/deps/undici/undici:6583:50
|
98
|
+
at Immediate._onImmediate (node:internal/deps/undici/undici:6614:13)
|
99
|
+
at process.processImmediate (node:internal/timers:471:21) {
|
100
|
+
code: 'UND_ERR_CONNECT_TIMEOUT'
|
101
|
+
}
|
102
|
+
}
|
103
|
+
```
|
104
|
+
|
27
105
|
|
28
106
|
### 環境
|
29
107
|
```
|
30
108
|
クラアント --- Apache(プロキシ) --- 専用サーバー(Next.jsを配置、dockerは使用しておらず、直接yarn startしています。Vercelではないです。)
|
31
109
|
```
|
32
110
|
Apacheを通さず、直接専用サーバーにデプロイしたNext.jsにアクセスしても現象が起こることから、Apache被疑ではないです。
|
111
|
+
|
112
|
+
`yarn dev`で開発用で立ち上げた際、事象は発生せず、`yarn start`で立ち上げた場合、事象が発生いたします。
|
33
113
|
|
34
114
|
### 補足情報(FW/ツールのバージョンなど)
|
35
115
|
```next.config.js
|
2
環境がVercelではないことを追記
test
CHANGED
File without changes
|
test
CHANGED
@@ -27,7 +27,7 @@
|
|
27
27
|
|
28
28
|
### 環境
|
29
29
|
```
|
30
|
-
クラアント --- Apache(プロキシ) --- 専用サーバー(Next.jsを配置、dockerは使用しておらず、直接yarn startしてい
|
30
|
+
クラアント --- Apache(プロキシ) --- 専用サーバー(Next.jsを配置、dockerは使用しておらず、直接yarn startしています。Vercelではないです。)
|
31
31
|
```
|
32
32
|
Apacheを通さず、直接専用サーバーにデプロイしたNext.jsにアクセスしても現象が起こることから、Apache被疑ではないです。
|
33
33
|
|
1
環境を追記いたしました
test
CHANGED
File without changes
|
test
CHANGED
@@ -24,6 +24,12 @@
|
|
24
24
|
|
25
25
|
とりあえずの対処として、<Image>を<img>にすれば問題なく表示されることが分かったのですが、Next.jsの機能を使いたいので、解決する方法があればご教示頂きたいです。
|
26
26
|
以下の補足情報の通りnext.config.jsのimagesのremotePatternsは適切に設定しております。
|
27
|
+
|
28
|
+
### 環境
|
29
|
+
```
|
30
|
+
クラアント --- Apache(プロキシ) --- 専用サーバー(Next.jsを配置、dockerは使用しておらず、直接yarn startしている)
|
31
|
+
```
|
32
|
+
Apacheを通さず、直接専用サーバーにデプロイしたNext.jsにアクセスしても現象が起こることから、Apache被疑ではないです。
|
27
33
|
|
28
34
|
### 補足情報(FW/ツールのバージョンなど)
|
29
35
|
```next.config.js
|