Trying to save image from Twilio MMS to Files?

Question

I've built an SMS/MMS Lightning Component, which displays incoming MMS images in a thumbnail, and if you click it, a full-size modal display. Now I want to add the option to Save to Files...

For the thumbnail and modal image source, I'm using the MediaUrl that Twilio sends in the webhook. That MediaUrl looks like this:

https://api.twilio.com/2010-04-01/Accounts/AC[myAccountSid]58/Messages/MM24ee5878300241a6bb87ac2093d6b2b0/Media/ME47ef01fc01586d48718a5f68d5d8c1f1

...which resolves to this url on AWS...

https://s3-external-1.amazonaws.com/media.twiliocdn.com/AC[myAccountSid]58/f2c22c0a845b7894ada4537ce2eb887f

The Twilio webhook also sends the MIME type, which is generally 'image/jpeg', or sometimes 'image/png' or 'image/gif'. I'm saving that to a field for use in the header of an http GET call.

That MediaUrl works well for display, using that full url as the src for my img tag in the markup. If I put the URL into a browser, it is nested in an html page with a background -- so it's more than just the image file.

When displayed using either URL, I can right-click the image and save to my computer... and the original file name is the default name. My first question is how to access this original file name? (I would try scraping it, but I it disables View Source.)

Next, I need to download the original file data and save it as a ContentVersion. Here's the code I'm using for that (the MessageId is the record to which this file will be attached):

 @AuraEnabled
public static void getFile(String MediaUrl, String ContentType, String MessageId)
{   
    Http h = new Http(); 
    HttpRequest req = new HttpRequest(); 

    //Replace any spaces with %20 
    MediaUrl = MediaUrl.replace(' ', '%20'); 
    req.setEndpoint(MediaUrl); 
    req.setMethod('GET'); 
    req.setHeader('Content-Type', ContentType); 
    req.setCompressed(true); 
    req.setTimeout(60000); 
    HttpResponse res = null; 
    res = h.send(req); 
    String responseValue = res.getBody(); 
    String fileExtension = ContentType.split('/')[1];

    Blob image = res.getBodyAsBlob();
    List<String> params = new List<String>();
    params.add(MediaUrl) ; //
    params.add(MessageId); //FirstPublishLocationId @ [1]
    params.add(fileExtension); // fileExtension @ [2]

    PhotoController.saveFile(image,params);
}


@Future
public static void saveFile(Blob image, List<String> params)
{   
    if (ContentVersion.SObjectType.getDescribe().isCreateable()) 
    {
        ContentVersion cv = new ContentVersion();  
        cv.VersionData = image;  
        //can't get original filename, so create one...
        cv.title = 'img-' + params[0].right(6); 
        cv.Description = 'Image from text'; 
        cv.FirstPublishLocationId = params[1];
        cv.PathOnClient = cv.title + '.' + params[2] ; 

        insert cv; 
    }
}

This code executes and creates a file record, but no preview is available, and if I download the file, I can't open it. So I can't verify that I'm actually getting the file in there.

I saw another thread saying that after saving the content version, I'd need to get the ContentDocumentId. I don't know what I'd do with that Id... I don't need to do anything else with the image -- just want to save it to files.

---

UPDATE: Thanks @Pranay Jaiswal, I was able to see what my HttpRequest was returning, and it's not an image file at all; it's data about the file:

{
   "sid": "ME46739a78eb197409a4a031896a22cab7", 
   "account_sid": [myAccountSid], 
   "parent_sid": "MM96803e1b66cf37deb1bcf044799dbf8c", 
   "content_type": "image/jpeg", 
   "date_created": "Tue, 20 Nov 2018 01:11:04 +0000", 
   "date_updated": "Tue, 20 Nov 2018 01:11:04 +0000", 
   "uri": "/2010-04-01/Accounts/[my AccountSID]/Messages/MM96803e1b66cf37deb1bcf044799dbf8c/Media/ME46739a78eb197409a4a031896a22cab7.json"
}

I need to get more info from Twilio on how to ask for the actual image data.