better URL safety checks; smaller tweaks

fquirin · fquirin · commit cdadbde527b2 · 2021-08-22T18:13:08.000+02:00
diff --git a/www/css/sepiaFW-skin-alabaster-mystical.css b/www/css/sepiaFW-skin-alabaster-mystical.css
@@ -177,6 +177,7 @@ html.landscape-small #sepiaFW-chat-controls {
 
 #sepiaFW-chat-output article {
 	border: 1px solid rgb(245, 245, 245);
+	border-left-color: unset !important;
     background: rgba(250, 250, 250, 0.60);
 	color: #000;
 	padding-left: 9px;
diff --git a/www/css/sepiaFW-skin-myMessage.css b/www/css/sepiaFW-skin-myMessage.css
@@ -31,12 +31,12 @@ html {
 #sepiaFW-statC 	{ background-color: #000; }
 
 #sepiaFW-login-box input, #sepiaFW-main-window input {
-	border: 1px solid #EBEBFF;
+	border: 1px solid #eee;
 }
 #sepiaFW-login-box, #sepiaFW-nav-bar, #sepiaFW-chat-controls-form, #sepiaFW-chat-controls-right {
 	background: rgba(255, 255, 255, 0.85);
 	color: #000;
-	border: 1px solid #EBEBFF;
+	border: 1px solid #eee;
 }
 #sepiaFW-chat-controls {
 	border: 2px solid transparent;
@@ -85,12 +85,15 @@ html {
 	backdrop-filter: blur(5px);
 }
 #sepiaFW-assist-btn-area.speaking button {
-	border: 4px solid #5cfc5c;
+	border: 4px solid #5af59b;
 }
 #sepiaFW-assist-btn-area.listening button {
-	border: 4px solid #f00;
+	border: 4px solid #ff282d;
 	color: #fff;
 }
+#sepiaFW-assist-btn-area.awaitDialog button {
+	border: 4px solid #f5df1e;
+}
 #sepiaFW-assist-btn-area button:hover {
 	background: linear-gradient(45deg, #027bff, #3e98ff);
 	color: #fff;
@@ -193,7 +196,7 @@ html {
 	color: #fff;
 }
 #sepiaFW-chat-output article.chatAssistant {
-	border: 1px solid #EBEBFF;
+	border: 1px solid #eee;
 	background: rgba(255, 255, 255, 0.85);
 	/*backdrop-filter: blur(5px);*/
 	color: #2f3035;
@@ -202,9 +205,9 @@ html {
 	color: #2f3035;
 }
 #sepiaFW-chat-output article.chatAssistant.chatPm {
-	border-left-color: rgba(0, 100, 0, 0.15);
-	border-left-width: 5px;
-	padding-left: 5px;
+	border-left-color: #eee;
+	border-left-width: 4px;
+	padding-left: 6px;
 }
 #sepiaFW-chat-output article.chatMe.chatPm {
 	border-left-color: rgba(255, 255, 255, 0.50);
@@ -213,15 +216,15 @@ html {
 	border-left-color: rgba(0, 0, 0, 0.15);
 }
 .chat-buttons-area button {
-	border: 1px solid #EBEBFF !important;
+	border: 1px solid #eee !important;
 }
 
 .sepiaFW-button {
 	background-color: linear-gradient(45deg, #027bff, #3e98ff);
 	color: #fff;
 }
 .sepiaFW-button:hover {
-	background-color: #EBEBFF;
+	background-color: #eee;
 	color: #000;
 }
 
diff --git a/www/css/sepiaFW-skin-os2.css b/www/css/sepiaFW-skin-os2.css
@@ -169,7 +169,7 @@ html.landscape-small #sepiaFW-chat-controls {
 }
 #sepiaFW-chat-output article.chatAssistant.chatPm {
 	/*border-left-color: rgba(243, 214, 104, 0.82);*/
-	border-left-color: #f4dbc4;
+	border-left-color: #f3d4b9;
 }
 #sepiaFW-chat-output article.chatMe {
 	background: linear-gradient(130deg, #d1d1d1 0%, #e2e2e2 80%, #d1d1d1 100%);
diff --git a/www/css/sepiaFW-style.css b/www/css/sepiaFW-style.css
@@ -335,6 +335,13 @@ body.limit-size {
 	display: flex;
     flex-direction: column;
 }
+.sepiaFW-input-popup .warn-text {
+	color: #f00;
+}
+.sepiaFW-input-popup h3.warn-text {
+	width: 100%;
+	text-align: center;
+}
 .sepiaFW-input-popup div {
 	margin-bottom: 12px;
 }
diff --git a/www/scripts/sepiaFW.app.js b/www/scripts/sepiaFW.app.js
@@ -375,12 +375,37 @@ function sepiaFW_build_tools(){
 
 	//URL is same origin?
 	Tools.isSameOrigin = function(uri1, uri2){
-		uri1 = new URL(uri1);
-		uri2 = new URL(uri2 || window.location.href);
-		if(uri1.host !== uri2.host) return false;
-		if(uri1.port !== uri2.port) return false;
-		if(uri1.protocol !== uri2.protocol) return false;
-		return true;
+		try {
+			uri1 = new URL(uri1);
+			uri2 = new URL(uri2 || window.location.href);
+			if(uri1.host !== uri2.host) return false;
+			if(uri1.port !== uri2.port) return false;
+			if(uri1.protocol !== uri2.protocol) return false;
+			return true;
+		}catch(error){
+			return false;	
+		}
+	}
+	//URL is remote file
+	Tools.isRemoteFileUrl = function(url, fileEnding){
+		if (!url) return false;
+		else url = url.trim().toLowerCase().replace(/\?.*/, "");
+		if (!url.match(/\.[a-z0-9]+$/)) return false;
+		if (fileEnding && url.split(".").pop() != fileEnding.toLowerCase()) return false;
+		return (url.indexOf("http:") == 0) || (url.indexOf("https:") == 0) || (url.indexOf("ftp:") == 0);
+	}
+	//URL is local file
+	Tools.isRelativeFileUrl = function(url, fileEnding){
+		if (!url) return false;
+		else url = url.trim().replace(/\?.*/, "");
+		if (fileEnding && url.toLowerCase().split(".").pop() != fileEnding.toLowerCase()) return false;
+		return (!!url.match(/^[-+%a-zA-Z0-9_\/]*\.[a-zA-Z0-9]+$/));
+	}
+	//URL has valid protocol
+	Tools.urlHasValidProtocol = function(url){
+		if (!url) return false;
+		else url = url.toLowerCase().trim();
+		return (!!url.match(/^[a-z][-a-z0-9_]*:/) && !url.match(/^(javascript|data):/));
 	}
 	
 	//get URL parameters
diff --git a/www/scripts/sepiaFW.frames.js b/www/scripts/sepiaFW.frames.js
@@ -157,22 +157,20 @@ function sepiaFW_build_frames(){
 	Frames.setup = function(info, finishCallback){
 		//get HTML - is there a language dependent version?
 		var framePage = Frames.getLocalOrDefaultPage(info.pageUrl, SepiaFW.config.appLanguage).trim();
-		var isRemote = (framePage.indexOf("http:") == 0) || (framePage.indexOf("https:") == 0) || (framePage.indexOf("ftp:") == 0);
-		if (isRemote){
-			var isSameOrigin = SepiaFW.tools.isSameOrigin(framePage);
-			var isSepiaFileHost = SepiaFW.config.urlIsSepiaFileHost(framePage);
-			if (isSameOrigin || isSepiaFileHost) isRemote = false;
-		}
+		var isValidLocalURL = SepiaFW.tools.isRelativeFileUrl(framePage, "html");
+		var isTrustedRemoteUrl = SepiaFW.tools.isRemoteFileUrl(framePage, "html") 
+			&& (SepiaFW.tools.isSameOrigin(framePage) || SepiaFW.config.urlIsSepiaFileHost(framePage));
+		var isTrusted = isValidLocalURL || isTrustedRemoteUrl;
 
 		//$.get(framePage, function(frameHtml){
         SepiaFW.files.fetch(framePage, function(frameHtml){
-			if (isRemote){
+			if (!isTrusted){
 				SepiaFW.debug.error("WARNING: Frame page has remote location and was BLOCKED due to security restrictions! - URL: " + framePage);
-				SepiaFW.ui.showPopup("<h3 style='color:#f00; width:100%; text-align: center;'>Warning</h3>" 
-					+ "<p>SEPIA was asked to open a remote URL in a custom view (frame). The request has been blocked due to security restrictions.</p>" 
-					+ "<p>URL: " + framePage + "</p>"
-					+ "<p>If you want to use this view please ask an admin to move it to a secure location (e.g. the SEPIA file server).</p>"
-				);
+				SepiaFW.ui.showSafeWarningPopup("Warning", [
+					"SEPIA was asked to open a remote URL in a custom view (frame). The request has been blocked due to security restrictions.",
+					"If you want to use this view please ask an admin to move it to a secure location (e.g. the SEPIA file server).",
+					"URL:"
+				], framePage);
 				Frames.close();
 				return;
 			}else{
diff --git a/www/scripts/sepiaFW.ui.actions.js b/www/scripts/sepiaFW.ui.actions.js
@@ -230,15 +230,41 @@ function sepiaFW_build_ui_actions(){
 	var inAppBrowserOptions = 'location=yes,toolbar=yes,mediaPlaybackRequiresUserAction=yes,allowInlineMediaPlayback=yes,hardwareback=yes,disableswipenavigation=no,clearsessioncache=no,clearcache=no';
 	Actions.openUrlAutoTarget = function(url, forceExternal){
 		if (!url) return;
-		var urlLower = url.toLowerCase();
+
+		//tiny and headless do not support URL action
 		if (SepiaFW.ui.isTinyApp || SepiaFW.ui.isHeadless){
 			//Tiny and headless apps usually have no ability to open in-app browser
 			SepiaFW.assistant.waitForOpportunityAndSay("<error_client_support_0a>", function(){
 				//Fallback after max-wait:
 				SepiaFW.ui.showInfo(SepiaFW.local.g('no_client_support'));
 			}, 2000, 30000);    //min-wait, max-wait
-			
-		}else if (SepiaFW.ui.isCordova){
+			return;
+		}
+
+		//check URL vor sanity (at least a bit)
+		var hasValidUrlProtocol = SepiaFW.tools.urlHasValidProtocol(url);
+		if (!hasValidUrlProtocol){
+			var question = document.createElement("div");
+			var p = document.createElement("p");
+			p.textContent = "Open URL:";
+			question.appendChild(p);
+			var unsafeContent = document.createElement("textarea");
+			unsafeContent.textContent = url;
+			question.appendChild(unsafeContent);
+			SepiaFW.ui.askForPermissionToExecute(question, function(){
+				//open
+				openUrlAutoTargetFun(url, forceExternal);
+			}, function(){
+				SepiaFW.debug.error("Action - 'openUrlAutoTarget' blocked due to suspicious URL: " + url);
+			});
+		}else{
+			//open
+			openUrlAutoTargetFun(url, forceExternal);
+		}
+	}
+	function openUrlAutoTargetFun(url, forceExternal){
+		var urlLower = url.toLowerCase();
+		if (SepiaFW.ui.isCordova){
 			if (forceExternal 
 				|| (urlLower.indexOf('http') !== 0 && !!urlLower.match(/^\w+:/)) 		//TODO: keep an eye on this! Does it prevent some cool URL scheme features?
 				|| urlLower.indexOf('https://maps.') === 0 || urlLower.indexOf('http://maps.') === 0
diff --git a/www/scripts/sepiaFW.ui.js b/www/scripts/sepiaFW.ui.js
@@ -1437,6 +1437,35 @@ function sepiaFW_build_ui(){
 		messagePopupAutoActionTry = 0;
 	}
 
+	//Show warning
+	UI.showSafeWarningPopup = function(headerText, infoTextParagraphs, unsafeString){
+		var content = document.createElement("div");
+		var header = document.createElement("h3");
+		header.className = "warn-text";
+		header.textContent = headerText || "Warning";
+		content.appendChild(header);
+		var info = [];
+		if (typeof infoTextParagraphs == "string"){
+			info.push(infoTextParagraphs);
+		}else if (typeof infoTextParagraphs == "object" && infoTextParagraphs instanceof Node){
+			content.appendChild(infoTextParagraphs);
+			info = undefined;
+		}else{
+			info = infoTextParagraphs;
+		}
+		if (info && info.length) info.forEach(function(it){
+			var p = document.createElement("p");
+			p.textContent = it || "";
+			content.appendChild(p);
+		});
+		if (unsafeString){
+			var unsafeContent = document.createElement("textarea");
+			unsafeContent.textContent = unsafeString;
+			content.appendChild(unsafeContent);
+		}
+		SepiaFW.ui.showPopup(content);
+	}
+
 	//Create basic input popup
 	UI.showInputPopup = function(infoContent, inputLabel, 
 			inputCallback, abortCallback, buttonLabel1, buttonLabel2){
@@ -1485,8 +1514,17 @@ function sepiaFW_build_ui(){
 
 	//Use pop-up to ask for permission
 	UI.askForPermissionToExecute = function(question, allowedCallback, refusedCallback){
-		var request = SepiaFW.local.g('allowedToExecuteThisCommand') + "<br>" + question;
-		UI.showPopup(request, {
+		var content;
+		if (typeof question == "object" && question instanceof Node){
+			var content = document.createElement("div");
+			var p = document.createElement("p");
+			p.textContent = SepiaFW.local.g('allowedToExecuteThisCommand');
+			content.appendChild(p);
+			content.appendChild(question);
+		}else{
+			content = SepiaFW.local.g('allowedToExecuteThisCommand') + "<br>" + question;
+		}
+		UI.showPopup(content, {
 			buttonOneName: SepiaFW.local.g('looksGood'),
 			buttonOneAction: function(){
 				//yes

Original file line number	Diff line number	Diff line change
`@@ -169,7 +169,7 @@ html.landscape-small #sepiaFW-chat-controls {`
`169`	`169`	`}`
`170`	`170`	`#sepiaFW-chat-output article.chatAssistant.chatPm {`
`171`	`171`	`/border-left-color: rgba(243, 214, 104, 0.82);/`
`172`		`- border-left-color: #f4dbc4;`
	`172`	`+ border-left-color: #f3d4b9;`
`173`	`173`	`}`
`174`	`174`	`#sepiaFW-chat-output article.chatMe {`
`175`	`175`	`background: linear-gradient(130deg, #d1d1d1 0%, #e2e2e2 80%, #d1d1d1 100%);`
Original file line number	Diff line number	Diff line change
`@@ -335,6 +335,13 @@ body.limit-size {`
`335`	`335`	`display: flex;`
`336`	`336`	`flex-direction: column;`
`337`	`337`	`}`
	`338`	`+.sepiaFW-input-popup .warn-text {`
	`339`	`+ color: #f00;`
	`340`	`+}`
	`341`	`+.sepiaFW-input-popup h3.warn-text {`
	`342`	`+ width: 100%;`
	`343`	`+ text-align: center;`
	`344`	`+}`
`338`	`345`	`.sepiaFW-input-popup div {`
`339`	`346`	`margin-bottom: 12px;`
`340`	`347`	`}`