FromBase64String fails with Kendo charts

Question

I have Kendo charts drawn on a page and I am posting their image data to an action to save this base64 encoded data to a (SQL Server) database.

Here is the exportImage call in which I first split the base64 data from the dataURL:

chart.exportImage({
    width: 727,
    height: 262
}).done(function(data) {
    // split 'image/png,xxxyyy=' into two
    var dataParts = data.split(',', 2);
    // TODO: need to strip from 'data:image/png;base64'
    dataParts[0] = 'image/png';

    $.ajax({
        url: "@Url.Action("
        Export_TargetPrice ", "
        Charts ")",
        type: 'POST',
        data: {
            contentType: dataParts[0],
            base64: dataParts[1],
            companyID: companyId
        }
    }).done(function() {

    });

});

My Export_TargetPrice method is essentially just a call to Convert.FromBase64String and then writing to the database:

/// <summary>
/// Export TargetPrice chart image for company (without download).
/// </summary>
[HttpPost]
public ActionResult Export_TargetPrice(string contentType, string base64, int companyID) {
    var fileContents = Convert.FromBase64String(base64);

    ChartTargetPriceImage chartImage = new ChartTargetPriceImage {
        CompanyID = companyID,
            Data = fileContents,
            Extension = contentType,
            CreateDate = DateTime.Now
    };
    db.ChartTargetPriceImage.Add(chartImage);

    db.SaveChanges();

    return new HttpStatusCodeResult(HttpStatusCode.OK); // 200
}

I am using base64decode.org to see if I can successfully decode the base64 from the database data (also use freeformatter.com). It is often failing, but with no discernible reason or pattern. It is failing for one company but if I try tomorrow it will probably work.

Earlier I generated 10 charts (there are 50 on a page and I can generate whichever ones I need), and half of them failed. They are the same charts - same design, from a partial - with only the data differing.

In the browser I can copy the received base64 variable/data and successfully create a chart from it via freeformatter.com but the database data can fail.

Why is this process failing? (Why does it only fail some of the time?)

---

I also tried the following to no effect: checking for a FormatException (if the data is not a multiple of 4), then actually trying to make it a multiple of 4 by padding equal signs.

byte[] fileContents;

// check if multiple of 4
int overFour = base64.Replace(" ", "").Length % 4;
if (overFour > 0) {
    // add trailing padding '='
    base64 += new string('=', 4 - overFour);
}

try {
    fileContents = Convert.FromBase64String(base64);
} catch (FormatException ex) {
    return new HttpStatusCodeResult(HttpStatusCode.ExpectationFailed, base64.Length.ToString());
}

I also checked that the base64 data received does not contain any unexpected characters.

Answer 1

It is apparent that the use of tools such as base64decode.org are not appropriate in this case, and that the code is working and the issue is with the eventual retrieval, and creation, of images from the data.