WordPress.org

Making WordPress.org

Opened 22 months ago

Last modified 2 months ago

#1616 assigned defect

Remote CSS: Allow data URIs in CSS properties

Reported by: ryelle Owned by:
Milestone: Priority: normal
Component: WordCamp Site & Plugins Keywords: has-patch
Cc:

Description

I'm using the Remote CSS feature for WordCamp Boston. I'd like to use SVGs for background images, encoded directly into the CSS file using data-uris. Unfortunately, the sanitization for URLs in the jetpack-tweaks sees this value as a URL, and strips data:, thinking it's a bad protocol. You can see it's broken on boston.wordcamp.org, the white rectangle should be our logo.

I've attached a patch which just adds data as a valid protocol, but I'm not sure if there are any reasons we might not allow that (security comes to mind, but if we allow any http url...?).

Attachments (1)

data-uri.diff (602 bytes) - added by ryelle 22 months ago.

Download all attachments as: .zip

Change History (9)

@ryelle
22 months ago

#1 @Otto42
22 months ago

I hesitate to allow svg as data uris, because svg can contain script code. Am I paranoid, or correct?

Version 0, edited 22 months ago by Otto42 (next)

#2 @ryelle
22 months ago

SVGs used as images, like css background-images, should have javascript disabled by browsers. mdn outright says this for Gecko, while this presentation makes the claim that svgs as images "should not execute JavaScript"... however I can't find any definitive guide saying that each browser definitely does or not.

FWIW, I've tried adding JS to an SVG image and it's not executing.

Note that svg with malicious script on a different domain has the domain problem. Data uri, not so much.

I hadn't thought of that, so it's worth making sure.

#3 @iandunn
22 months ago

  • Owner set to iandunn
  • Status changed from new to accepted

My understanding is that SVGs can't execute JavaScript in the context of a background image, because they're not a DOM element. IIRC, I didn't intend to prevent data-uris in r2085, but I'll double check before merging this.

#wp24251 has a lot of related information and discussion.

#4 @iandunn
22 months ago

I haven't found anything definitive yet either.

I suspect that all modern browser engines will treat background-image SVGs the same way Gecko does, but there are so many esoteric SVG exploits1 that it's really hard to be confident in anything. Even if JavaScript is disabled, there may still be XML attacks, etc.

I think we need some more research before this can be committed.

In the mean time, it looks like you're hosting the SVGs on an external domain, so that the cross-domain policy offers some protection. Ideally we want all resources hosted on wordcamp.org for longevity, but hosting them externally sounds like a good compromise until this is sorted out.


[1] - For example, check out section 3.3 of Crouching Tiger -- Hidden Payload, where data: URIs are used in inline SVGs to nest malicious SVGs via the feImage tag.

This ticket was mentioned in Slack in #core-customize by jorbin. View the logs.


15 months ago

#6 @iandunn
12 months ago

In 4598:

WordCamp Remote CSS: Add unit test for data: protocol in URLs

See #1616

#7 @melchoyce
5 months ago

How's this coming along? Would love to be able to more easily use SVGs :)

#8 @iandunn
2 months ago

  • Owner iandunn deleted
  • Status changed from accepted to assigned
Note: See TracTickets for help on using tickets.