VOD not playing after s3 recording enabled in Ant Media server

[yashtandon113]

I have enabled s3 recording in application settings on dashboard but when trying to play VOD from dashboard it gives error "The media could not be loaded, either because the server or network failed or because the format is not supported."

Also it is not working with iframe/Embedded code.

[Mohit-3196]

This error The media could not be loaded, either because the server or network failed or because the format is not supported generally comes when HTTP forwarding is not configured on Ant Media Server for S3 Recording.

HTTP forwarding is implemented to forward incoming HTTP requests to any other place. It's generally used for forwarding the incoming request to storage like S3.

Solution:
Here's how HTTP forwarding can be configured on Ant Media Server:

Open the file {AMS-DIR} / webapps / {APPLICATION} / WEB-INF / red5-web.properties with your text editor.
Add settings.httpforwarding.extension=mp4 to the file.
Add the base URL with settings.httpforwarding.baseURL=https://{YOUR_DOMAIN} for forwarding.

Please replace {YOUR_DOMAIN} with your own URL. Please pay attention that there is no leading or trailing white spaces.
e.g.,
If you are using AWS S3 bucket, {YOUR_DOMAIN} will be like:
{s3BucketName}.s3.{awsLocation}.amazonaws.com

If you are using Digital Ocean Spaces, {YOUR_DOMAIN} will be like:
{BucketName}.{BucketLocation}.digitaloceanspaces.com

Save the file and
restart the Ant Media Server with sudo service antmedia restart

If it's configured properly, your incoming MP4 requests such as https://{SERVER_DOMAIN}:5443/{APPLICATION_NAME}/streams/vod.mp4 will be forwarded to https://{YOUR_DOMAIN_HERE}/streams/vod.mp4

CORS parameters of AWS S3 bucket should be modified so that the requests that are coming from another origin after embedding streams with iFrame to play the VODs can be processed.

Go to your AWS -> Services -> S3 -> Buckets -> "Your Bucket" -> Permissions -> And at the bottom of the page there is Cross-origin resource sharing (CORS).
Click Edit-> and paste the code provided below:

[
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "HEAD",
            "GET",
            "PUT",
            "POST",
            "DELETE"
        ],
        "AllowedOrigins": [
            "*"
        ],
        "ExposeHeaders": []
    }
]

For more detailed information regarding S3 uploads, HTTP forwarding and other related topics checkout this document https://antmedia.io/docs/guides/recording-live-streams/s3-integration-http-forwarding/#http-forwarding