From 3431f763201b0befcd74e26686e9c41ef766e1de Mon Sep 17 00:00:00 2001 From: Sven Geusens Date: Mon, 12 Aug 2024 15:25:05 +0100 Subject: [PATCH] Prevents XSS when viewing an uploaded SVG from the media-info and image-preview components. --- .../media/umbmedianodeinfo.directive.js | 10 +------ .../common/services/mediahelper.service.js | 26 +++++++++++++++++-- .../umbimagepreview/umb-image-preview.html | 2 +- .../umbimagepreview.controller.js | 26 +++++++++---------- 4 files changed, 38 insertions(+), 26 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/media/umbmedianodeinfo.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/media/umbmedianodeinfo.directive.js index 30bb2b6f3f..e752044ddc 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/media/umbmedianodeinfo.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/media/umbmedianodeinfo.directive.js @@ -136,15 +136,7 @@ editorService.mediaTypeEditor(editor); }; - scope.openSVG = () => { - var popup = window.open('', '_blank'); - var html = '' + - ''; - - popup.document.open(); - popup.document.write(html); - popup.document.close(); - } + scope.openSVG = () => mediaHelper.openSVG(scope.nodeUrl); // watch for content updates - reload content when node is saved, published etc. scope.$watch('node.updateDate', function(newValue, oldValue){ diff --git a/src/Umbraco.Web.UI.Client/src/common/services/mediahelper.service.js b/src/Umbraco.Web.UI.Client/src/common/services/mediahelper.service.js index 14de3bb1c4..b9e6560f81 100644 --- a/src/Umbraco.Web.UI.Client/src/common/services/mediahelper.service.js +++ b/src/Umbraco.Web.UI.Client/src/common/services/mediahelper.service.js @@ -3,7 +3,7 @@ * @name umbraco.services.mediaHelper * @description A helper object used for dealing with media items **/ -function mediaHelper(umbRequestHelper, $http, $log) { +function mediaHelper(umbRequestHelper, $http, $log, $location) { //container of fileresolvers var _mediaFileResolvers = {}; @@ -449,7 +449,29 @@ function mediaHelper(umbRequestHelper, $http, $log) { cropY2: options.crop ? options.crop.y2 : null })), "Failed to retrieve processed image URL for image: " + imagePath); - } + }, + + /** + * @ngdoc function + * @name umbraco.services.mediaHelper#openSVG + * @methodOf umbraco.services.mediaHelper + * @function + * + * @description + * Opens an SVG file in a new window as an image file, to prevent any potential XSS exploits. + * + * @param {string} imagePath File path, ex /media/1234/my-image.svg + */ + openSVG: function (imagePath) { + var popup = window.open('', '_blank'); + var html = '' + + '' + + ''; + + popup.document.open(); + popup.document.write(html); + popup.document.close(); + } }; } angular.module('umbraco.services').factory('mediaHelper', mediaHelper); diff --git a/src/Umbraco.Web.UI.Client/src/views/components/media/umbimagepreview/umb-image-preview.html b/src/Umbraco.Web.UI.Client/src/views/components/media/umbimagepreview/umb-image-preview.html index 989f8ef093..0918f6dc5b 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/media/umbimagepreview/umb-image-preview.html +++ b/src/Umbraco.Web.UI.Client/src/views/components/media/umbimagepreview/umb-image-preview.html @@ -1,6 +1,6 @@
{{vm.name}} - + {{vm.name}}
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/media/umbimagepreview/umbimagepreview.controller.js b/src/Umbraco.Web.UI.Client/src/views/components/media/umbimagepreview/umbimagepreview.controller.js index 36eb3958e2..d1f32fb6b5 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/media/umbimagepreview/umbimagepreview.controller.js +++ b/src/Umbraco.Web.UI.Client/src/views/components/media/umbimagepreview/umbimagepreview.controller.js @@ -1,18 +1,16 @@ - - - - angular.module("umbraco") - .controller("umbImagePreviewController", - function (mediaHelper) { + .controller("umbImagePreviewController", + function (mediaHelper) { - var vm = this; + var vm = this; - vm.getThumbnail = function(source) { - return mediaHelper.getThumbnailFromPath(source) || source; - } - vm.getClientSideUrl = function(sourceData) { - return URL.createObjectURL(sourceData); - } + vm.getThumbnail = function (source) { + return mediaHelper.getThumbnailFromPath(source) || source; + } - }); + vm.getClientSideUrl = function (sourceData) { + return URL.createObjectURL(sourceData); + } + + vm.openSVG = (source) => mediaHelper.openSVG(source); + });