Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

Commit f92f819

Browse files
committed
refactor($compile): move img[srcset] sanitizing to helper method
1 parent a42f8a0 commit f92f819

File tree

1 file changed

+53
-45
lines changed

1 file changed

+53
-45
lines changed

src/ng/compile.js

+53-45
Original file line numberDiff line numberDiff line change
@@ -1631,6 +1631,57 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
16311631
}
16321632

16331633

1634+
function sanitizeSrcset(value) {
1635+
if (!value) {
1636+
return value;
1637+
}
1638+
if (!isString(value)) {
1639+
throw $compileMinErr('srcset', 'Can\'t pass trusted values to `$set(\'srcset\', value)`: "{0}"', value.toString());
1640+
}
1641+
1642+
// Such values are a bit too complex to handle automatically inside $sce.
1643+
// Instead, we sanitize each of the URIs individually, which works, even dynamically.
1644+
1645+
// It's not possible to work around this using `$sce.trustAsMediaUrl`.
1646+
// If you want to programmatically set explicitly trusted unsafe URLs, you should use
1647+
// `$sce.trustAsHtml` on the whole `img` tag and inject it into the DOM using the
1648+
// `ng-bind-html` directive.
1649+
1650+
var result = '';
1651+
1652+
// first check if there are spaces because it's not the same pattern
1653+
var trimmedSrcset = trim(value);
1654+
// ( 999x ,| 999w ,| ,|, )
1655+
var srcPattern = /(\s+\d+x\s*,|\s+\d+w\s*,|\s+,|,\s+)/;
1656+
var pattern = /\s/.test(trimmedSrcset) ? srcPattern : /(,)/;
1657+
1658+
// split srcset into tuple of uri and descriptor except for the last item
1659+
var rawUris = trimmedSrcset.split(pattern);
1660+
1661+
// for each tuples
1662+
var nbrUrisWith2parts = Math.floor(rawUris.length / 2);
1663+
for (var i = 0; i < nbrUrisWith2parts; i++) {
1664+
var innerIdx = i * 2;
1665+
// sanitize the uri
1666+
result += $sce.getTrustedMediaUrl(trim(rawUris[innerIdx]));
1667+
// add the descriptor
1668+
result += ' ' + trim(rawUris[innerIdx + 1]);
1669+
}
1670+
1671+
// split the last item into uri and descriptor
1672+
var lastTuple = trim(rawUris[i * 2]).split(/\s/);
1673+
1674+
// sanitize the last uri
1675+
result += $sce.getTrustedMediaUrl(trim(lastTuple[0]));
1676+
1677+
// and add the last descriptor if any
1678+
if (lastTuple.length === 2) {
1679+
result += (' ' + trim(lastTuple[1]));
1680+
}
1681+
return result;
1682+
}
1683+
1684+
16341685
function Attributes(element, attributesToCopy) {
16351686
if (attributesToCopy) {
16361687
var keys = Object.keys(attributesToCopy);
@@ -1767,51 +1818,8 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
17671818
nodeName = nodeName_(this.$$element);
17681819

17691820
// Sanitize img[srcset] values.
1770-
if (nodeName === 'img' && key === 'srcset' && value) {
1771-
if (!isString(value)) {
1772-
throw $compileMinErr('srcset', 'Can\'t pass trusted values to `$set(\'srcset\', value)`: "{0}"', value.toString());
1773-
}
1774-
1775-
// Such values are a bit too complex to handle automatically inside $sce.
1776-
// Instead, we sanitize each of the URIs individually, which works, even dynamically.
1777-
1778-
// It's not possible to work around this using `$sce.trustAsMediaUrl`.
1779-
// If you want to programmatically set explicitly trusted unsafe URLs, you should use
1780-
// `$sce.trustAsHtml` on the whole `img` tag and inject it into the DOM using the
1781-
// `ng-bind-html` directive.
1782-
1783-
var result = '';
1784-
1785-
// first check if there are spaces because it's not the same pattern
1786-
var trimmedSrcset = trim(value);
1787-
// ( 999x ,| 999w ,| ,|, )
1788-
var srcPattern = /(\s+\d+x\s*,|\s+\d+w\s*,|\s+,|,\s+)/;
1789-
var pattern = /\s/.test(trimmedSrcset) ? srcPattern : /(,)/;
1790-
1791-
// split srcset into tuple of uri and descriptor except for the last item
1792-
var rawUris = trimmedSrcset.split(pattern);
1793-
1794-
// for each tuples
1795-
var nbrUrisWith2parts = Math.floor(rawUris.length / 2);
1796-
for (var i = 0; i < nbrUrisWith2parts; i++) {
1797-
var innerIdx = i * 2;
1798-
// sanitize the uri
1799-
result += $sce.getTrustedMediaUrl(trim(rawUris[innerIdx]));
1800-
// add the descriptor
1801-
result += ' ' + trim(rawUris[innerIdx + 1]);
1802-
}
1803-
1804-
// split the last item into uri and descriptor
1805-
var lastTuple = trim(rawUris[i * 2]).split(/\s/);
1806-
1807-
// sanitize the last uri
1808-
result += $sce.getTrustedMediaUrl(trim(lastTuple[0]));
1809-
1810-
// and add the last descriptor if any
1811-
if (lastTuple.length === 2) {
1812-
result += (' ' + trim(lastTuple[1]));
1813-
}
1814-
this[key] = value = result;
1821+
if (nodeName === 'img' && key === 'srcset') {
1822+
this[key] = value = sanitizeSrcset(value, '$set(\'srcset\', value)');
18151823
}
18161824

18171825
if (writeAttr !== false) {

0 commit comments

Comments
 (0)