Redmine

Hi Justin,

Try to put your code between "!".
The following code:

!data:image/gif;base64,R0lGODlhDwAPAKECAAAAzMzM/////wAAACwAAAAADwAPAAACIISPeQHsrZ5ModrLlN48CXF8m2iQ3YmmKqVlRtW4MLwWACH+H09wdGltaXplZCBieSBVbGVhZCBTbWFydFNhdmVyIQAAOw==!

Hi Martin,

Hey -- that works! Thanks for the tip.

Ok, now here's more details on the situation. I ran some experiments and this is what I see. The image is beng stored, but:
1) Textile won't let me paste an image from the paste buffer. (I'm using image_clipboard_paste plugin)
2) CKeditor does something to the node data when it saves the node (I'm using the Issues module), so that the image isn't visible -- even from a code/DOM inspector
3) If I change the editor back to Textile, then I can see the raw image data displayed -- it even has the "!" around it, but it's inside the <div> tag (class= wiki or contextual)
4) If I edit the node and remove extranious HTML and make sure its surrounded by "!" then the image displays.

Obviously I'd like to have this working so that the non-technical folks can just create or edit a node and paste in an image -- no fussing around with code syntax.

Here's a bit more of the code I see... Note -- some of the tags below don't show closing tags -- that's because I copied from Firebug and they're collapsed; this is just to make the code blow more readable.

Thanks again, --Justin

With Textile,
Cannot paste images from Windows7/Firefox paste buffer, nothing happens
Add raw image data (small sample image), surrounded by "!"
Displays image fine.
Code from Firebug:

<div id="journal-309-notes" class="wiki editable">
  <div class="contextual">
    <p>
      <img alt="" src="data:image/gif;base64,R0lGODlhDwAPAKECAAAAzMzM/////wAAACwAAAAADwAPAAACIISPeQHsrZ5ModrLlN48CXF8m2iQ3YmmKqVlRtW4MLwWACH+H09wdGltaXplZCBieSBVbGVhZCBTbWFydFNhdmVyIQAAOw==">
    </p>
  </div>
</div>

Change Redmine settings/editor from textile to CKeditor,
View issue I just created above --> Image displays as code.
Code from Firebug:

<div id="journal-309-notes" class="wiki editable">
  <div class="contextual">
    !data:image/gif;base64,R0lGODlhDwAPAKECAAAAzMzM/////wAAACwAAAAADwAPAAACIISPeQHsrZ5ModrLlN48CXF8m2iQ3YmmKqVlRtW4MLwWACH+H09wdGltaXplZCBieSBVbGVhZCBTbWFydFNhdmVyIQAAOw==!
  </div>

Add comment, paste in larger image from paste buffer (approx 300x300)
--> Upon save, no image is visible.
Code from Firebug:

<div id="journal-311-notes" class="wiki editable">
  <div class="contextual">
    <a title="Quote" rel="nofollow" data-remote="true" data-method="post" href="/issues/254/quoted?journal_id=311">
    <a title="Edit" onclick="$.ajax({url: '/journals/edit/311.js', type: 'get'}); return false;" href="#">
  </div>
  <p>
    <img alt="">
  </p>
</div>

Change Redmine settings back to Textile,
Raw image code appears.
Edit the issue, editor displays:

<p><img alt="" src="data:image/png;base64,iVBORw0 ..... " />

Remove html and leave it as --> !date:image.....!
Save,
And now the image is visible.

So, How would I go about fixing this so that I can paste images into the fields without having to change editors, correct "!" syntax's, etc.

Thanks in advance

I'm frustrated.
Does ANYONE have this working? Could somebody please share their architecture/platform so I can this to work?
Martin, I appreciate your comment, however that's simply not what I'm trying to do.
Anyone? Please.

Maybe you could "rewrite" the comments before saving to replace the img tags by ! ?

1. Paste image (image shows in editor)
2. switch to Source
3. remove <img src=" and replace with !
4. scroll down to bottom of encoded image data, replace " /> with !
5. Submit

Still broken. I just see the encoded base64 data.

Plus, I work with a marketing group, and I'm trying to get them away from sending email from Outlook -- managing all of their work by firing emails to each other. Total mess.
There's no way anyone is going to futz with this. It has to either work totally seamlessly, or it's totally out the window.

Is it possible that there's some little bug in a graphic library? (badly installed ImageMagick or something)
I have no idea if either (A) Everyone uses this feature, and I'm just a poor clod who messed up his install, or (B) only a very few people use image pasting like this, and those folks either went through a painful process to get it working, or got lucky... and it's just a matter of time before a Redmine or plugin upgrade breaks it.

Is pasting an image from the clipboard a common feature? Do you use?

We have same question. Data from clipboard is stored as data:image instead of image link but the browser should be compatible.

Any solution?

This topic is quite old, but there is this #22910 defect that treat of the same problem. For those using ckeditor, the solution proposed in this comment works for me in Redmine 4.1.1 and 5.1.0. In summary, edit the init.rb file of ckeditor plugin like this:

 Loofah::HTML5::WhiteList::ALLOWED_PROTOCOLS.replace RedmineCkeditor.allowed_protocols
 Loofah::HTML5::WhiteList::ALLOWED_PROTOCOLS.add('data')