Replies: 10 comments 4 replies
-
I had the same issue and was wondering why it doesn't work. As a result, I discovered that some urls containing images are not in the image format. That's why you're getting an error and the image won't load. You can check the format here: aconvert.com/analyze.html |
Beta Was this translation helpful? Give feedback.
-
A simple await fetch(
"https://valence.jobboard.io/uploads/job/logo/65255312/FreightWaves.jpg"
) Also gives back 503, so the issue is probably not with |
Beta Was this translation helpful? Give feedback.
-
Has anyone resolved this issue? |
Beta Was this translation helpful? Give feedback.
-
any news on this? |
Beta Was this translation helpful? Give feedback.
-
Hi all. Has this been resolved? Ever since upgrading to Next13, next/image has given us a 503. Using seems to resolve the issue but its obviously not ideal. |
Beta Was this translation helpful? Give feedback.
-
same issue over here :( |
Beta Was this translation helpful? Give feedback.
-
I'm running into this issue deploying Nextjs 13.5 into GCP with Cloud Run. any updates? |
Beta Was this translation helpful? Give feedback.
-
Are you running into the issue in prod only and it works locally? If so, it's probably the execution time limit. It's set to 10 seconds for the Hobby plan (free tier). If it's longer than that to upload the image, you could be getting 503 errors. Same with memory limit. |
Beta Was this translation helpful? Give feedback.
-
Still getting this issue (error 503) running NextJS /** @type {import('next').NextConfig} */
const nextConfig = {
images: {
remotePatterns: [
{
hostname: "flagcdn.com",
pathname: "/w40/**",
port: "",
protocol: "https",
},
],
},
};
export default nextConfig; I have also tried messing with the Loaders and the Priority props but to no avail. From my research it appears the NextJS images seem to only work consistently on Vercel, it would be nice if they consistently worked elsewhere too (seems to be a very common problem, for now I will default to a generic Images Randomly Failing to Load Related Conversations
|
Beta Was this translation helpful? Give feedback.
-
I am not sure if this fixes the <Image
alt={option.name + " flag"}
height={20}
key={option.code}
+ loader={({ src, width }: ImageLoaderProps) => {
+ return `https://flagcdn.com/w40/${src}?w=${width}`;
+ }}
src={`${option.code.toLowerCase()}.png`}
width={40}
/> Not too sure why this is the case but I assume it has something to do with "A loader is a function that generates the URLs for your image" and as stated in the Loaders NextJS docs. |
Beta Was this translation helpful? Give feedback.
-
What version of Next.js are you using?
10.2.3
What version of Node.js are you using?
14.15.1
What browser are you using?
Chrome
What operating system are you using?
macOS
How are you deploying your application?
vercel
Describe the Bug
Using a new next.js project. Optimized images won't load from a specific domain.
For
getting 503 (Service Unavailable) error.
Adding
unoptimized
prop shows the image.Expected Behavior
Image should load from any domain
To Reproduce
Create a new next app.
Create
next.config.js
and addAdd
to a page and navigate to the page. Image will be broken
Beta Was this translation helpful? Give feedback.
All reactions