Hosting Next.js APP with mp4/webm vidoes

[aktoriukas]

Before opening, please confirm:

• [X] I have checked to see if my question is addressed in the FAQ.
• [X] I have searched for duplicate or closed issues.
• [X] I have read the guide for submitting questions.
• [X] I have removed any sensitive information from my code snippets and submission.

App Id

NEW_APP

AWS Region

us-east-1

Amplify Hosting feature

Frontend builds

Question

I'm trying to host my next.js site on the amplify that contais few video files in the public directory. I have tried this with 2 different formats , same result ( mp4 & webm ).

On local machine works all good, but on hosted version it does not work at all.

<video ref={videoRef} autoPlay muted={muted} >
          <source src="./video.webm" type="video/webm" />
 </video>

After some diging found someone saying that i should edit Rewrites and redirects ( https://github.com/aws-amplify/amplify-hosting/issues/1416 )

But after adding </^[^.]+$|\.(?!(css|gif|ico|jpg|js|png|txt|svg|woff|ttf|map|json|mp4|webm)$)([^.]+$)/> it does show one out of 3 videos, the other just not found at all.

Can it be size problem? Even thought their all are bellow 10MB.

[ghost]

Hi @aktoriukas 👋🏽 we are working on investigating this behavior, please provide your Amplify app ID so we can continue to investigate this issue for you.

[aktoriukas]

@hloriana APP ID: AmplifySSRLoggingRole-d2n4qwtpilb8g9

on the DEV branch in the public folder there are 7 files: 3 - mp4 1 - ico 3 - svg

ico & svg are accesible, but mp4 are not found.

[aktoriukas]

@hloriana is there are any updates on this ?

[nakamura-yoichi]

Any updates here? I'm facing the same issue