Storing an SVG as bytes in DB?

Question

Wee bit of background to set the scene : we've told a client he can provide us with images of any type and we'll put them on his reports. I've just had a quick run through of doing this and found that the reports (and other things between me and them) are all designed to only use SVGs.

I thought I'd struck gold when I found online that you can convert an image from a jpg or PNG into an SVG using free tools but alas I've not yet succeeded in getting an SVG stored as bytes in the DB in a format that allows me to use it again after reading it back out.

Here's a quick timeline of what followed leading up to my problem.

1. I use an online tool to generate an SVG from a PNG (e.g., MobileFish)
2. I can open and view it in Firefox and it looks ok
3. I ultimately need the SVG to be stored as bytes in the DB, from where the report will pull it via a webpage that serves it up as SVG. So I write it as bytes into a SQL data script. The code I use to write these bytes is included below.
4. I visit said webpage and I get an error that there is an "XML parsing error on Line 1 Column 1" and it shows some of my bytes. They begin "3C73"
5. I revisit the DB and compare the bytes I've just written there with some pre-existing (and working ones). While my new ones begin "3C73", the others begin "0xFFFE".

I think I've probably just pointed out something really fundamental but it hasn't clicked.

Can someone tell me what I've done that means my bytes aren't stored in the correct encoding/format?

When I open my new SVG in Notepad++ I can see the content includes the following which could be relevant :

<image width="900" height="401" xLink:href="data:image/png;base64,

(base 64 encoded data follows for 600+ lines)

Here's the brains of the code that turns my SVG into the bytes to be stored in DB :

var bytes = File.ReadAllBytes(file);
using (var fs = new StreamWriter(file + ".txt"))
{
    foreach (var item in bytes)
    {
        fs.Write(String.Format("{0:X2}",item));
    }
}

Any help appreciated.

Cheers

Answer 1

Two things:

1. SVGs are vector images, not bitmap files. All that online tool is doing is taking a JPEG and creating a SVG file with a JPEG embedded in it. You aren't really getting the benefit of a true SVG image. If you realise and understand that, then no worries.

2. SVG files are just text. In theory there is no reason you can't just store them as strings in your db. As long as the column is big enough. However normally if you are storing unstructured files in a db, the preferred column type to use is a "Blob".

http://technet.microsoft.com/en-us/library/bb895234.aspx

Converting your SVG file to hex is just making things slower and doubling the size of your files. Also when you convert back, you have to be very careful about the string encoding you are using. Which, in fact, sounds like the problem you are having.

Answer 2

I am suspecting you are doing it incorrectly. SVG is simply and XML based vector image format. I guess your application might be using SVG image element and you need to convert your png image to base64 encoded string .