muxinc / next-video

The easiest way to add video in your Nextjs app.

Home Page:https://next-video.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Video optimization doesn't work in Vercel or AWS. "Failed to load next.config.js or next.config.mjs" in deployed version

vkurniavka opened this issue · comments

I have the simple website with remote video. My configuration is simple and the same as in tutorial, will provide it below.
Local build works fine and upload video to the AWS S3 bucket successfully, the I deploy my website to Vercel and got a lot of 500 errors in the console, and server logs show a "Failed to load next.config.js or next.config.mjs"

So my next.config.mjs:

`import { withNextVideo } from 'next-video/process';

const nextConfig = {
images: {
remotePatterns: [
{
protocol: 'https',
hostname: '111111.cloudfront.net',
port: '',
pathname: '/**',
},
],
},
async headers() {
return [
{
source: "/:path*",
headers: [
{ key: "Access-Control-Allow-Credentials", value: "true" },
{ key: "Access-Control-Allow-Origin", value: "*" },
{ key: "Access-Control-Allow-Methods", value: "GET" },
{ key: "Access-Control-Allow-Headers", value: "X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version" },
]
}
]
}
};
export default withNextVideo(nextConfig, {
provider: 'amazon-s3',

providerConfig: {
'amazon-s3': {
endpoint: 'https://s3.eu-central-1.amazonaws.com',
bucket: 'video-procesing',
accessKeyId: '',
secretAccessKey: '
**'
}
}
})
`

Also as in the docs I add src/app/api/video/route.ts with content:
export { GET } from 'next-video/request-handler';
Because I'm using the remote videos from CMS

Finlay here are the server logs
image

BTW. Forgot to metnion
"next-video": "^0.16.0",
"next": "14.1.0"

thanks for the feedback, I have a fix in PR ^^

note that currently this feature with string sources is only supported when the video is processed locally first and the .json files are committed to git.

we know this is not ideal and this is where a database solution #143 would come in to store the metadata instead of static .json files.

Thanks for answer