Image with contentMode: "youtube" allows external script execution

fixed surveyjs/service#2174
surveyjs · May 13, 2024 · b25fbf0 · b25fbf0
1 parent 78844a0
commit b25fbf0
Show file tree

Hide file tree

Showing 2 changed files with 38 additions and 6 deletions.
diff --git a/src/question_image.ts b/src/question_image.ts
@@ -5,16 +5,17 @@ import { LocalizableString } from "./localizablestring";
 import { CssClassBuilder } from "./utils/cssClassBuilder";
 import { getRenderedStyleSize, getRenderedSize } from "./utils/utils";
 
-const youtubeTags = ["youtube.com", "youtu.be"];
+const youtubeDomains = ["www.youtube.com", "m.youtube.com", "youtube.com", "youtu.be"];
 const videoSuffics = [".mp4", ".mov", ".wmv", ".flv", ".avi", ".mkv"];
 const youtubeUrl = "https://www.youtube.com/";
 const youtubeEmbed = "embed";
 
 function isUrlYoutubeVideo(url: string): boolean {
   if (!url) return false;
   url = url.toLowerCase();
-  for (let i = 0; i < youtubeTags.length; i++) {
-    if (url.indexOf(youtubeTags[i]) !== -1) return true;
+  url = url.replace(/^https?:\/\//, "");
+  for (let i = 0; i < youtubeDomains.length; i++) {
+    if (url.indexOf(youtubeDomains[i] + "/") === 0) return true;
   }
   return false;
 }
@@ -31,7 +32,7 @@ export class QuestionImageModel extends QuestionNonValue {
     super(name);
     const locImageLink = this.createLocalizableString("imageLink", this, false);
     locImageLink.onGetTextCallback = (text: string): string => {
-      return getCorrectImageLink(text);
+      return getCorrectImageLink(text, this.contentMode == "youtube");
     };
     this.createLocalizableString("altText", this, false);
     this.registerPropertyChangedHandlers(["contentMode", "imageLink"], () => this.calculateRenderedMode());
@@ -203,8 +204,9 @@ export class QuestionImageModel extends QuestionNonValue {
   }
 }
 
-function getCorrectImageLink(val: string): string {
-  if(!val || !isUrlYoutubeVideo(val)) return val;
+function getCorrectImageLink(val: string, isYouTube: boolean): string {
+  if (!val || !isUrlYoutubeVideo(val)) return isYouTube ? "" : val;
+  //if(!val || !isUrlYoutubeVideo(val)) return val;
   let res = val.toLocaleLowerCase();
   if(res.indexOf(youtubeEmbed) > -1) return val;
   let id = "";

diff --git a/tests/question_imagetests.ts b/tests/question_imagetests.ts
@@ -33,6 +33,18 @@ QUnit.test("Check youtube video rendered mode", function (assert) {
   const question = new QuestionImageModel("q1");
   question.imageLink = "https://www.youtube.com/embed/tgbNymZ7vqY";
   assert.equal(question.renderedMode, "youtube");
+  question.imageLink = "https://youtube.com/embed/tgbNymZ7vqY";
+  assert.equal(question.renderedMode, "youtube");
+  question.imageLink = "m.youtube.com/embed/tgbNymZ7vqY";
+  assert.equal(question.renderedMode, "youtube");
+  question.imageLink = "youtube.com/embed/tgbNymZ7vqY";
+  assert.equal(question.renderedMode, "youtube");
+  question.imageLink = "youtu.be/tgbNymZ7vqY";
+  assert.equal(question.renderedMode, "youtube");
+  question.imageLink = "youtu.bee/tgbNymZ7vqY";
+  assert.equal(question.renderedMode, "image");
+  question.imageLink = "javascript:(alert('youtu.be'))";
+  assert.equal(question.renderedMode, "image");
   question.imageLink = "abcd";
   assert.equal(question.renderedMode, "image");
   question.imageLink = "https://youtu.be/tgbNymZ7vqY";
@@ -47,6 +59,24 @@ QUnit.test("Check NOT youtube video rendered mode", function (assert) {
   question.imageLink = "videoUrl.avi";
   assert.equal(question.renderedMode, "video");
 });
+QUnit.test("Check youtube video imagelink", function (assert) {
+  const question = new QuestionImageModel("q1");
+  question.contentMode = "youtube";
+  question.imageLink = "https://www.youtube.com/embed/tgbNymZ7vqY";
+  assert.equal(question.locImageLink.renderedHtml, "https://www.youtube.com/embed/tgbNymZ7vqY");
+  question.imageLink = "javascript:alert('a')";
+  assert.equal(question.locImageLink.renderedHtml, "");
+  question.imageLink = "https://youtu.be/tgbNymZ7vqY";
+  assert.equal(question.locImageLink.renderedHtml, "https://www.youtube.com/embed/tgbNymZ7vqY");
+  question.imageLink = "javascript:alert('youtube.com')";
+  assert.equal(question.locImageLink.renderedHtml, "");
+  question.imageLink = "youtube.com.org";
+  assert.equal(question.locImageLink.renderedHtml, "");
+
+  question.contentMode = "image";
+  question.imageLink = "videoUrl.mov";
+  assert.equal(question.locImageLink.renderedHtml, "videoUrl.mov");
+});
 
 QUnit.test("Image adaptive mode", function (assert) {
   const json = {