Home → Suggestions →

Support for data URI (RFC 2397)

• Edit

vopilif

11 Oct, 2012 05:24 PM

My workflow involves creating and reading many Markdown documents offline, and I frequently move them around between machines. These two facts make it cumbersome to use image links in my documents. My solution was to use data URI schemes (RFC 2397) to embed a Base64 encoded images directly in the document. I don't know much about Cocoa on OS X but I would imagine this kind of functionality should have come for free from the network libraries. Every Markdown tool I've used so far has supported this feature, but after buying Marked I really don't want to go back to those tools, none of them are as polished or focused.

I hope you can implement support for this so data URI images show up in Marked.

1. Support Staff 1 Posted by Brett on 11 Oct, 2012 05:31 PM

   

   The next version of Marked exports linked images as data URIs (optionally), but you're talking about using them in the Markdown itself?

   • Edit

2. 2 Posted by vopilif on 11 Oct, 2012 05:44 PM

   

   Sorry, I just realized I was vague on what I meant by "document".

   In short, yes. I keep the encoded data inside the actual plain text file (at the bottom and use reference links). This allows me to read the plain file when I remote in via SSH, and then preview the same file in Marked when a GUI is available.

   It be very nice if the export feature preserved the data URI form the source, and I also like that you have already worked on optionally exporting regular image links as data URIs. This is a great idea but I would still like the option to have the data in my source doc since that's even more portable.

   • Edit

3. 3 Posted by vopilif on 11 Oct, 2012 05:51 PM

   

   To clarify a bit more: the way I have used data URIs in Markdown is pretty much the same way you would do it in HTML, basically, placing the data URI where you would expect a regular URL.

   Example:

   ![Alt text][my_img]
   
   ... Markdown body ...
   
   [my_img]: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0AAAABlBMVEUAAAD///+l2Z/dAAAAM0lEQVR4nGP4/5/h/1+G/58ZDrAz3D/McH8yw8NDDeNGe4Ug9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC
   

   This results in a "broken image link" graphic in Marked where you would expect the image to be rendered.

   • Edit

4. Support Staff 4 Posted by Brett on 11 Oct, 2012 06:07 PM

   

   This actually works fine for me with a properly encoded image… your code results in a broken image, but the attached code works fine in both preview and export.

   Could you test that out and let me know if you still see issues?

   • testpng.md 1.68 KB
   • Edit

5. 5 Posted by vopilif on 11 Oct, 2012 06:26 PM

   

   The data code I pasted was from wikipedia, and I wasn't careful to make sure I didn't screw up the data string then pasting it here.

   I tried your testpng.md on my machine and got the same broken link as before (see Screen Shot 1). I tried it again with two other apps that support Markdown and the image appeared (see Screen Shot 2 and Screen Shot 3).

   • Screen_Shot_1.png 37.2 KB
   • Screen_Shot_2.png 13.6 KB
   • Screen_Shot_3.png 24.8 KB
   • Edit

6. Support Staff 6 Posted by Brett on 11 Oct, 2012 06:29 PM

   

   I didn't have v1.4 of Marked on this machine, so my tests were done using the 1.5 beta. I believe you can consider this fixed for the next release.

   • Edit

7. 7 Posted by vopilif on 11 Oct, 2012 06:34 PM

   

   Wonderful! Can you please verify if exporting to HTML will maintain the data URI? I imagine it would but it's a good use-case to QA.

   Thank you, it seems your customer support is as good as your app!

   • Edit

8. Support Staff 8 Posted by Brett on 11 Oct, 2012 06:43 PM

   

   It does, tested with the above code with perfect results :).

   • Edit