450 lines
16 KiB
JavaScript
450 lines
16 KiB
JavaScript
// Copyright 2014 The Closure Library Authors. All Rights Reserved.
|
|
//
|
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
// you may not use this file except in compliance with the License.
|
|
// You may obtain a copy of the License at
|
|
//
|
|
// http://www.apache.org/licenses/LICENSE-2.0
|
|
//
|
|
// Unless required by applicable law or agreed to in writing, software
|
|
// distributed under the License is distributed on an "AS-IS" BASIS,
|
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
// See the License for the specific language governing permissions and
|
|
// limitations under the License.
|
|
|
|
/**
|
|
* @fileoverview The SafeStyle type and its builders.
|
|
*
|
|
* TODO(xtof): Link to document stating type contract.
|
|
*/
|
|
|
|
goog.provide('goog.html.SafeStyle');
|
|
|
|
goog.require('goog.array');
|
|
goog.require('goog.asserts');
|
|
goog.require('goog.string');
|
|
goog.require('goog.string.Const');
|
|
goog.require('goog.string.TypedString');
|
|
|
|
|
|
|
|
/**
|
|
* A string-like object which represents a sequence of CSS declarations
|
|
* ({@code propertyName1: propertyvalue1; propertyName2: propertyValue2; ...})
|
|
* and that carries the security type contract that its value, as a string,
|
|
* will not cause untrusted script execution (XSS) when evaluated as CSS in a
|
|
* browser.
|
|
*
|
|
* Instances of this type must be created via the factory methods
|
|
* ({@code goog.html.SafeStyle.create} or
|
|
* {@code goog.html.SafeStyle.fromConstant}) and not by invoking its
|
|
* constructor. The constructor intentionally takes no parameters and the type
|
|
* is immutable; hence only a default instance corresponding to the empty string
|
|
* can be obtained via constructor invocation.
|
|
*
|
|
* A SafeStyle's string representation ({@link #getTypedStringValue()}) can
|
|
* safely:
|
|
* <ul>
|
|
* <li>Be interpolated as the entire content of a *quoted* HTML style
|
|
* attribute, or before already existing properties. The SafeStyle string
|
|
* *must be HTML-attribute-escaped* (where " and ' are escaped) before
|
|
* interpolation.
|
|
* <li>Be interpolated as the entire content of a {}-wrapped block within a
|
|
* stylesheet, or before already existing properties. The SafeStyle string
|
|
* should not be escaped before interpolation. SafeStyle's contract also
|
|
* guarantees that the string will not be able to introduce new properties
|
|
* or elide existing ones.
|
|
* <li>Be assigned to the style property of a DOM node. The SafeStyle string
|
|
* should not be escaped before being assigned to the property.
|
|
* </ul>
|
|
*
|
|
* A SafeStyle may never contain literal angle brackets. Otherwise, it could
|
|
* be unsafe to place a SafeStyle into a <style> tag (where it can't
|
|
* be HTML escaped). For example, if the SafeStyle containing
|
|
* "{@code font: 'foo <style/><script>evil</script>'}" were
|
|
* interpolated within a <style> tag, this would then break out of the
|
|
* style context into HTML.
|
|
*
|
|
* A SafeStyle may contain literal single or double quotes, and as such the
|
|
* entire style string must be escaped when used in a style attribute (if
|
|
* this were not the case, the string could contain a matching quote that
|
|
* would escape from the style attribute).
|
|
*
|
|
* Values of this type must be composable, i.e. for any two values
|
|
* {@code style1} and {@code style2} of this type,
|
|
* {@code goog.html.SafeStyle.unwrap(style1) +
|
|
* goog.html.SafeStyle.unwrap(style2)} must itself be a value that satisfies
|
|
* the SafeStyle type constraint. This requirement implies that for any value
|
|
* {@code style} of this type, {@code goog.html.SafeStyle.unwrap(style)} must
|
|
* not end in a "property value" or "property name" context. For example,
|
|
* a value of {@code background:url("} or {@code font-} would not satisfy the
|
|
* SafeStyle contract. This is because concatenating such strings with a
|
|
* second value that itself does not contain unsafe CSS can result in an
|
|
* overall string that does. For example, if {@code javascript:evil())"} is
|
|
* appended to {@code background:url("}, the resulting string may result in
|
|
* the execution of a malicious script.
|
|
*
|
|
* TODO(user): Consider whether we should implement UTF-8 interchange
|
|
* validity checks and blacklisting of newlines (including Unicode ones) and
|
|
* other whitespace characters (\t, \f). Document here if so and also update
|
|
* SafeStyle.fromConstant().
|
|
*
|
|
* The following example values comply with this type's contract:
|
|
* <ul>
|
|
* <li><pre>width: 1em;</pre>
|
|
* <li><pre>height:1em;</pre>
|
|
* <li><pre>width: 1em;height: 1em;</pre>
|
|
* <li><pre>background:url('http://url');</pre>
|
|
* </ul>
|
|
* In addition, the empty string is safe for use in a CSS attribute.
|
|
*
|
|
* The following example values do NOT comply with this type's contract:
|
|
* <ul>
|
|
* <li><pre>background: red</pre> (missing a trailing semi-colon)
|
|
* <li><pre>background:</pre> (missing a value and a trailing semi-colon)
|
|
* <li><pre>1em</pre> (missing an attribute name, which provides context for
|
|
* the value)
|
|
* </ul>
|
|
*
|
|
* @see goog.html.SafeStyle#create
|
|
* @see goog.html.SafeStyle#fromConstant
|
|
* @see http://www.w3.org/TR/css3-syntax/
|
|
* @constructor
|
|
* @final
|
|
* @struct
|
|
* @implements {goog.string.TypedString}
|
|
*/
|
|
goog.html.SafeStyle = function() {
|
|
/**
|
|
* The contained value of this SafeStyle. The field has a purposely
|
|
* ugly name to make (non-compiled) code that attempts to directly access this
|
|
* field stand out.
|
|
* @private {string}
|
|
*/
|
|
this.privateDoNotAccessOrElseSafeStyleWrappedValue_ = '';
|
|
|
|
/**
|
|
* A type marker used to implement additional run-time type checking.
|
|
* @see goog.html.SafeStyle#unwrap
|
|
* @const
|
|
* @private
|
|
*/
|
|
this.SAFE_STYLE_TYPE_MARKER_GOOG_HTML_SECURITY_PRIVATE_ =
|
|
goog.html.SafeStyle.TYPE_MARKER_GOOG_HTML_SECURITY_PRIVATE_;
|
|
};
|
|
|
|
|
|
/**
|
|
* @override
|
|
* @const
|
|
*/
|
|
goog.html.SafeStyle.prototype.implementsGoogStringTypedString = true;
|
|
|
|
|
|
/**
|
|
* Type marker for the SafeStyle type, used to implement additional
|
|
* run-time type checking.
|
|
* @const {!Object}
|
|
* @private
|
|
*/
|
|
goog.html.SafeStyle.TYPE_MARKER_GOOG_HTML_SECURITY_PRIVATE_ = {};
|
|
|
|
|
|
/**
|
|
* Creates a SafeStyle object from a compile-time constant string.
|
|
*
|
|
* {@code style} should be in the format
|
|
* {@code name: value; [name: value; ...]} and must not have any < or >
|
|
* characters in it. This is so that SafeStyle's contract is preserved,
|
|
* allowing the SafeStyle to correctly be interpreted as a sequence of CSS
|
|
* declarations and without affecting the syntactic structure of any
|
|
* surrounding CSS and HTML.
|
|
*
|
|
* This method performs basic sanity checks on the format of {@code style}
|
|
* but does not constrain the format of {@code name} and {@code value}, except
|
|
* for disallowing tag characters.
|
|
*
|
|
* @param {!goog.string.Const} style A compile-time-constant string from which
|
|
* to create a SafeStyle.
|
|
* @return {!goog.html.SafeStyle} A SafeStyle object initialized to
|
|
* {@code style}.
|
|
*/
|
|
goog.html.SafeStyle.fromConstant = function(style) {
|
|
var styleString = goog.string.Const.unwrap(style);
|
|
if (styleString.length === 0) {
|
|
return goog.html.SafeStyle.EMPTY;
|
|
}
|
|
goog.html.SafeStyle.checkStyle_(styleString);
|
|
goog.asserts.assert(
|
|
goog.string.endsWith(styleString, ';'),
|
|
'Last character of style string is not \';\': ' + styleString);
|
|
goog.asserts.assert(
|
|
goog.string.contains(styleString, ':'),
|
|
'Style string must contain at least one \':\', to ' +
|
|
'specify a "name: value" pair: ' + styleString);
|
|
return goog.html.SafeStyle.createSafeStyleSecurityPrivateDoNotAccessOrElse(
|
|
styleString);
|
|
};
|
|
|
|
|
|
/**
|
|
* Checks if the style definition is valid.
|
|
* @param {string} style
|
|
* @private
|
|
*/
|
|
goog.html.SafeStyle.checkStyle_ = function(style) {
|
|
goog.asserts.assert(
|
|
!/[<>]/.test(style), 'Forbidden characters in style string: ' + style);
|
|
};
|
|
|
|
|
|
/**
|
|
* Returns this SafeStyle's value as a string.
|
|
*
|
|
* IMPORTANT: In code where it is security relevant that an object's type is
|
|
* indeed {@code SafeStyle}, use {@code goog.html.SafeStyle.unwrap} instead of
|
|
* this method. If in doubt, assume that it's security relevant. In particular,
|
|
* note that goog.html functions which return a goog.html type do not guarantee
|
|
* the returned instance is of the right type. For example:
|
|
*
|
|
* <pre>
|
|
* var fakeSafeHtml = new String('fake');
|
|
* fakeSafeHtml.__proto__ = goog.html.SafeHtml.prototype;
|
|
* var newSafeHtml = goog.html.SafeHtml.htmlEscape(fakeSafeHtml);
|
|
* // newSafeHtml is just an alias for fakeSafeHtml, it's passed through by
|
|
* // goog.html.SafeHtml.htmlEscape() as fakeSafeHtml
|
|
* // instanceof goog.html.SafeHtml.
|
|
* </pre>
|
|
*
|
|
* @see goog.html.SafeStyle#unwrap
|
|
* @override
|
|
*/
|
|
goog.html.SafeStyle.prototype.getTypedStringValue = function() {
|
|
return this.privateDoNotAccessOrElseSafeStyleWrappedValue_;
|
|
};
|
|
|
|
|
|
if (goog.DEBUG) {
|
|
/**
|
|
* Returns a debug string-representation of this value.
|
|
*
|
|
* To obtain the actual string value wrapped in a SafeStyle, use
|
|
* {@code goog.html.SafeStyle.unwrap}.
|
|
*
|
|
* @see goog.html.SafeStyle#unwrap
|
|
* @override
|
|
*/
|
|
goog.html.SafeStyle.prototype.toString = function() {
|
|
return 'SafeStyle{' + this.privateDoNotAccessOrElseSafeStyleWrappedValue_ +
|
|
'}';
|
|
};
|
|
}
|
|
|
|
|
|
/**
|
|
* Performs a runtime check that the provided object is indeed a
|
|
* SafeStyle object, and returns its value.
|
|
*
|
|
* @param {!goog.html.SafeStyle} safeStyle The object to extract from.
|
|
* @return {string} The safeStyle object's contained string, unless
|
|
* the run-time type check fails. In that case, {@code unwrap} returns an
|
|
* innocuous string, or, if assertions are enabled, throws
|
|
* {@code goog.asserts.AssertionError}.
|
|
*/
|
|
goog.html.SafeStyle.unwrap = function(safeStyle) {
|
|
// Perform additional Run-time type-checking to ensure that
|
|
// safeStyle is indeed an instance of the expected type. This
|
|
// provides some additional protection against security bugs due to
|
|
// application code that disables type checks.
|
|
// Specifically, the following checks are performed:
|
|
// 1. The object is an instance of the expected type.
|
|
// 2. The object is not an instance of a subclass.
|
|
// 3. The object carries a type marker for the expected type. "Faking" an
|
|
// object requires a reference to the type marker, which has names intended
|
|
// to stand out in code reviews.
|
|
if (safeStyle instanceof goog.html.SafeStyle &&
|
|
safeStyle.constructor === goog.html.SafeStyle &&
|
|
safeStyle.SAFE_STYLE_TYPE_MARKER_GOOG_HTML_SECURITY_PRIVATE_ ===
|
|
goog.html.SafeStyle.TYPE_MARKER_GOOG_HTML_SECURITY_PRIVATE_) {
|
|
return safeStyle.privateDoNotAccessOrElseSafeStyleWrappedValue_;
|
|
} else {
|
|
goog.asserts.fail('expected object of type SafeStyle, got \'' +
|
|
safeStyle + '\' of type ' + goog.typeOf(safeStyle));
|
|
return 'type_error:SafeStyle';
|
|
}
|
|
};
|
|
|
|
|
|
/**
|
|
* Package-internal utility method to create SafeStyle instances.
|
|
*
|
|
* @param {string} style The string to initialize the SafeStyle object with.
|
|
* @return {!goog.html.SafeStyle} The initialized SafeStyle object.
|
|
* @package
|
|
*/
|
|
goog.html.SafeStyle.createSafeStyleSecurityPrivateDoNotAccessOrElse = function(
|
|
style) {
|
|
return new goog.html.SafeStyle().initSecurityPrivateDoNotAccessOrElse_(style);
|
|
};
|
|
|
|
|
|
/**
|
|
* Called from createSafeStyleSecurityPrivateDoNotAccessOrElse(). This
|
|
* method exists only so that the compiler can dead code eliminate static
|
|
* fields (like EMPTY) when they're not accessed.
|
|
* @param {string} style
|
|
* @return {!goog.html.SafeStyle}
|
|
* @private
|
|
*/
|
|
goog.html.SafeStyle.prototype.initSecurityPrivateDoNotAccessOrElse_ = function(
|
|
style) {
|
|
this.privateDoNotAccessOrElseSafeStyleWrappedValue_ = style;
|
|
return this;
|
|
};
|
|
|
|
|
|
/**
|
|
* A SafeStyle instance corresponding to the empty string.
|
|
* @const {!goog.html.SafeStyle}
|
|
*/
|
|
goog.html.SafeStyle.EMPTY =
|
|
goog.html.SafeStyle.createSafeStyleSecurityPrivateDoNotAccessOrElse('');
|
|
|
|
|
|
/**
|
|
* The innocuous string generated by goog.html.SafeUrl.create when passed
|
|
* an unsafe value.
|
|
* @const {string}
|
|
*/
|
|
goog.html.SafeStyle.INNOCUOUS_STRING = 'zClosurez';
|
|
|
|
|
|
/**
|
|
* Mapping of property names to their values.
|
|
* @typedef {!Object<string, goog.string.Const|string>}
|
|
*/
|
|
goog.html.SafeStyle.PropertyMap;
|
|
|
|
|
|
/**
|
|
* Creates a new SafeStyle object from the properties specified in the map.
|
|
* @param {goog.html.SafeStyle.PropertyMap} map Mapping of property names to
|
|
* their values, for example {'margin': '1px'}. Names must consist of
|
|
* [-_a-zA-Z0-9]. Values might be strings consisting of
|
|
* [-,.'"%_!# a-zA-Z0-9], where " and ' must be properly balanced.
|
|
* Other values must be wrapped in goog.string.Const. Null value causes
|
|
* skipping the property.
|
|
* @return {!goog.html.SafeStyle}
|
|
* @throws {Error} If invalid name is provided.
|
|
* @throws {goog.asserts.AssertionError} If invalid value is provided. With
|
|
* disabled assertions, invalid value is replaced by
|
|
* goog.html.SafeStyle.INNOCUOUS_STRING.
|
|
*/
|
|
goog.html.SafeStyle.create = function(map) {
|
|
var style = '';
|
|
for (var name in map) {
|
|
if (!/^[-_a-zA-Z0-9]+$/.test(name)) {
|
|
throw Error('Name allows only [-_a-zA-Z0-9], got: ' + name);
|
|
}
|
|
var value = map[name];
|
|
if (value == null) {
|
|
continue;
|
|
}
|
|
if (value instanceof goog.string.Const) {
|
|
value = goog.string.Const.unwrap(value);
|
|
// These characters can be used to change context and we don't want that
|
|
// even with const values.
|
|
goog.asserts.assert(!/[{;}]/.test(value), 'Value does not allow [{;}].');
|
|
} else if (!goog.html.SafeStyle.VALUE_RE_.test(value)) {
|
|
goog.asserts.fail(
|
|
'String value allows only [-,."\'%_!# a-zA-Z0-9], rgb() and ' +
|
|
'rgba(), got: ' + value);
|
|
value = goog.html.SafeStyle.INNOCUOUS_STRING;
|
|
} else if (!goog.html.SafeStyle.hasBalancedQuotes_(value)) {
|
|
goog.asserts.fail('String value requires balanced quotes, got: ' + value);
|
|
value = goog.html.SafeStyle.INNOCUOUS_STRING;
|
|
}
|
|
style += name + ':' + value + ';';
|
|
}
|
|
if (!style) {
|
|
return goog.html.SafeStyle.EMPTY;
|
|
}
|
|
goog.html.SafeStyle.checkStyle_(style);
|
|
return goog.html.SafeStyle.createSafeStyleSecurityPrivateDoNotAccessOrElse(
|
|
style);
|
|
};
|
|
|
|
|
|
/**
|
|
* Checks that quotes (" and ') are properly balanced inside a string. Assumes
|
|
* that neither escape (\) nor any other character that could result in
|
|
* breaking out of a string parsing context are allowed;
|
|
* see http://www.w3.org/TR/css3-syntax/#string-token-diagram.
|
|
* @param {string} value Untrusted CSS property value.
|
|
* @return {boolean} True if property value is safe with respect to quote
|
|
* balancedness.
|
|
* @private
|
|
*/
|
|
goog.html.SafeStyle.hasBalancedQuotes_ = function(value) {
|
|
var outsideSingle = true;
|
|
var outsideDouble = true;
|
|
for (var i = 0; i < value.length; i++) {
|
|
var c = value.charAt(i);
|
|
if (c == "'" && outsideDouble) {
|
|
outsideSingle = !outsideSingle;
|
|
} else if (c == '"' && outsideSingle) {
|
|
outsideDouble = !outsideDouble;
|
|
}
|
|
}
|
|
return outsideSingle && outsideDouble;
|
|
};
|
|
|
|
|
|
// Keep in sync with the error string in create().
|
|
/**
|
|
* Regular expression for safe values.
|
|
*
|
|
* Quotes (" and ') are allowed, but a check must be done elsewhere to ensure
|
|
* they're balanced.
|
|
*
|
|
* ',' allows multiple values to be assigned to the same property
|
|
* (e.g. background-attachment or font-family) and hence could allow
|
|
* multiple values to get injected, but that should pose no risk of XSS.
|
|
*
|
|
* The rgb() and rgba() expression checks only for XSS safety, not for CSS
|
|
* validity.
|
|
* @const {!RegExp}
|
|
* @private
|
|
*/
|
|
goog.html.SafeStyle.VALUE_RE_ =
|
|
/^([-,."'%_!# a-zA-Z0-9]+|(?:rgb|hsl)a?\([0-9.%, ]+\))$/;
|
|
|
|
|
|
/**
|
|
* Creates a new SafeStyle object by concatenating the values.
|
|
* @param {...(!goog.html.SafeStyle|!Array<!goog.html.SafeStyle>)} var_args
|
|
* SafeStyles to concatenate.
|
|
* @return {!goog.html.SafeStyle}
|
|
*/
|
|
goog.html.SafeStyle.concat = function(var_args) {
|
|
var style = '';
|
|
|
|
/**
|
|
* @param {!goog.html.SafeStyle|!Array<!goog.html.SafeStyle>} argument
|
|
*/
|
|
var addArgument = function(argument) {
|
|
if (goog.isArray(argument)) {
|
|
goog.array.forEach(argument, addArgument);
|
|
} else {
|
|
style += goog.html.SafeStyle.unwrap(argument);
|
|
}
|
|
};
|
|
|
|
goog.array.forEach(arguments, addArgument);
|
|
if (!style) {
|
|
return goog.html.SafeStyle.EMPTY;
|
|
}
|
|
return goog.html.SafeStyle.createSafeStyleSecurityPrivateDoNotAccessOrElse(
|
|
style);
|
|
};
|