Inline Images get stripped

[mstaack]

Using this content:

<img src="data:image/gif;base64,R0lGODdhEAAQAMwAAPj7+FmhUYjNfGuxYY
    DJdYTIeanOpT+DOTuANXi/bGOrWj6CONzv2sPjv2CmV1unU4zPgISg6DJnJ3ImTh8Mtbs00aNP1CZSGy0YqLEn47RgXW8amasW
    7XWsmmvX2iuXiwAAAAAEAAQAAAFVyAgjmRpnihqGCkpDQPbGkNUOFk6DZqgHCNGg2T4QAQBoIiRSAwBE4VA4FACKgkB5NGReAS
    FZEmxsQ0whPDi9BiACYQAInXhwOUtgCUQoORFCGt/g4QAIQA7">

and this policy:

	// Define a policy, we are using the UGC policy as a base.
	p := bluemonday.UGCPolicy()

	// Allow images to be embedded via data-uri
	p.AllowDataURIImages()

i get an empty string back.... whats wrong with my policy?

cheers max

[grafana-dee]

There is nothing wrong with the policy, but the image data is truncated or incomplete.

The data itself is parsed as base64 using https://github.com/microcosm-cc/bluemonday/blob/master/helpers.go#L223-L226

But the input is not valid https://play.golang.org/p/-eq8Xsr8Qy :

package main

import (
	"encoding/base64"
	"fmt"
)

func main() {
	s := `R0lGODdhEAAQAMwAAPj7+FmhUYjNfGuxYYDJdYTIeanOpT+DOTuANXi/bGOrWj6CONzv2sPjv2CmV1unU4zPgISg6DJnJ3ImTh8Mtbs00aNP1CZSGy0YqLEn47RgXW8amasW7XWsmmvX2iuXiwAAAAAEAAQAAAFVyAgjmRpnihqGCkpDQPbGkNUOFk6DZqgHCNGg2T4QAQBoIiRSAwBE4VA4FACKgkB5NGReASFZEmxsQ0whPDi9BiACYQAInXhwOUtgCUQoORFCGt/g4QAIQA7`

	if _, err := base64.StdEncoding.DecodeString(s); err != nil {
		// this one fires
		fmt.Println(err.Error())
	} else {
		fmt.Println("parsed as base64")
	}
}

Were you to provide a valid base64 input, it would work (following example based on the unit test):

package main

import (
	"fmt"

	"github.com/microcosm-cc/bluemonday"
)

func main() {
	p := bluemonday.NewPolicy()
	p.AllowImages()
	p.AllowDataURIImages()

	s := `<img src="data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7">`

	// this returns the image
	fmt.Printf("'%s'\n", p.Sanitize(s))
}

[mstaack]

@buro9 thanks for you feedback, will check base64 on my side ;)

[mstaack]

@buro9 weird
this is my base64 img code:
https://play.golang.org/p/O0j5Dmlvmp so its valid.

but my html response has an empty image tag: <img alt="">

this is my go code:

	// Define a policy, we are using the UGC policy as a base.
	p := bluemonday.UGCPolicy()

	// HTML email is often displayed in iframes and needs to preserve core
	// structure
	p.AllowDocType(true)

	// HTML email frequently contains obselete and basic HTML
	p.AllowElements("html", "head", "body", "label", "input", "font", "main", "nav", "header", "footer", "kbd", "legend", "map", "title")

	p.AllowAttrs("type").Matching(StyleType).OnElements("style")
	p.AllowAttrs("style").Globally()


	// Custom attributes on elements
	p.AllowAttrs("type", "media").OnElements("style")
	p.AllowAttrs("face", "size").OnElements("font")
	p.AllowAttrs("name", "content", "http-equiv").OnElements("meta")
	p.AllowAttrs("name", "data-id").OnElements("a")
	p.AllowAttrs("for").OnElements("label")
	p.AllowAttrs("type").OnElements("input")
	p.AllowAttrs("rel", "href").OnElements("link")
	p.AllowAttrs("topmargin", "leftmargin", "marginwidth", "marginheight", "yahoo").OnElements("body")
	p.AllowAttrs("xmlns").OnElements("html")

	p.AllowAttrs("style", "vspace", "hspace", "face", "bgcolor", "color", "border", "cellpadding", "cellspacing").Globally()

	// HTML email tends to see the use of obselete spacing and styling attributes
	p.AllowAttrs("bgcolor", "color", "align").OnElements("basefont", "font", "hr", "table", "td")
	p.AllowAttrs("border").OnElements("img", "table", "basefont", "font", "hr", "td")
	p.AllowAttrs("cellpadding", "cellspacing", "valign", "halign").OnElements("table")

	// Allow "class" attributes on all elements
	p.AllowStyling()

	// Allow images to be embedded via data-uri
	p.AllowDataURIImages()

	// Add "rel=nofollow" to links
	p.RequireNoFollowOnLinks(true)
	p.RequireNoFollowOnFullyQualifiedLinks(true)

	// Open external links in a new window/tab
	p.AddTargetBlankToFullyQualifiedLinks(true)

	// Read input from stdin so that this is a nice unix utility and can receive
	// piped input
	dirty, err := ioutil.ReadAll(os.Stdin)
	if err != nil {
		log.Fatal(err)
	}

	// Apply the policy and write to stdout
	fmt.Fprint(
		os.Stdout,
		p.Sanitize(
			string(dirty),
		),
	)

[grafana-dee]

Hmmm, if I take your image example from the linked Go Playground... it works for me.
When I use the base64 input within a src="" if does not work.
If I remove the line breaks and whitespace... it works for me.

Do you have whitespace or line breaks in your input data URL content?

[mstaack]

ahh yeah...okay

[mstaack]

but i cant just replace all \n to an empty string

[mstaack]

hmm okay fixed the base64 part...

but this still gives an empty image tag... weird

[grafana-dee]

This is a valid bug... I'll fix it :)

Line feeds in data URI attributes in HTML5 are valid, so I should be stripping those out beforehand.

[mstaack]

@buro9 your work is awesome! will recheck when your done. thanks!

[grafana-dee]

Thanks... do you have a test file btw... with the full input you are using (for this part of the file)... to avoid me copying it from a screenshot :)

[mstaack]

https://gist.github.com/mstaack/e677dc7216c9cb3d863d23ab00c37bd3

[mstaack]

and one with newline: https://gist.github.com/mstaack/599a28114ceecc45e8f5f6d93f7b7d71

[mstaack]

both should work

[grafana-dee]

These would still return empty string because image/image/png is not a valid content-type.

But assuming image/png is used I'll make the new line one work too.

[mstaack]

yeah you are totally right... will fix that on my side ;)