#2985 Prevent XSS for REST API by escape String content:

scadalts-ui/src/components/datasources/DataPointCreation.vue

@@ -6,8 +6,7 @@
 					<h1>
 						<span v-if="creator"> Create </span>
 						<span v-else> Update </span>
-						<span>
-							{{ title }}
+						<span v-html="title">
 						</span>
 					</h1>
 				</v-col>
@@ -23,15 +22,15 @@
 					<v-col cols="12" :sm="6">
 						<v-text-field
 							autofocus
-							v-model="datapoint.name"
+							v-model="datapoint.tempName"
 							label="Data Point Name"
 							:rules="[ruleNotNull]"
 							required
 						></v-text-field>
 					</v-col>
 					<v-col cols="6" :sm="4">
 						<v-text-field
-							v-model="datapoint.xid"
+							v-model="datapoint.tempXid"
 							label="Data Point Export ID"
 							@input="checkXidUnique"
 							:rules="[ruleNotNull, ruleXidUnique]"
@@ -47,7 +46,7 @@
 					</v-col>
 					<v-col cols="12">
 						<v-text-field
-							v-model="datapoint.description"
+							v-model="datapoint.tempDescription"
 							label="Description"
 						></v-text-field>
 					</v-col>
@@ -99,6 +98,9 @@ export default {
 
 	async mounted(){
 		this.initialState = JSON.parse(JSON.stringify(this.datapoint));
+		this.datapoint.tempName = this.datapoint.name;
+        this.datapoint.tempXid = this.datapoint.xid;
+        this.datapoint.tempDescription = this.datapoint.description;
 	},
 
 	data() {
@@ -107,7 +109,7 @@ export default {
 			formValid: false,
 			xidUnique: true,
 			ruleNotNull: (v) => !!v || this.$t('validation.rule.notNull'),
-			ruleXidUnique: () => this.xidUnique || this.$t('validation.rule.xid.notUnique'),
+			ruleXidUnique: () => this.xidUnique || this.$t('validation.rule.xid.notUnique')
 		};
 	},
 
@@ -123,9 +125,14 @@ export default {
 		},
 
 		accept() {
+            let datapoint = JSON.parse(JSON.stringify(this.datapoint));
+            datapoint.name = this.datapoint.tempName;
+            datapoint.xid = this.datapoint.tempXid;
+            datapoint.description = this.datapoint.tempDescription;
+
 			console.debug('datasources.DataPointCreation.vue::accept()');
 			if (this.formValid) {
-				this.$emit('accept');
+				this.$emit('accept', datapoint);
 			}
 		},
 

scadalts-ui/src/components/datasources/DataSourceConfig.vue

@@ -6,9 +6,7 @@
 					<h1>
 						<span v-if="creator"> Create </span>
 						<span v-else> Update </span>
-						<span>
-							{{ title }}
-						</span>
+						<span v-html="title"> </span>
 					</h1>
 				</v-col>
 				<v-col cols="4">
@@ -23,15 +21,15 @@
 					<v-col cols="12" :md="8" :sm="12" id="datasource-config--name">
 						<v-text-field
 							autofocus
-							v-model="datasource.name"
+							v-model="datasource.tempName"
 							label="DataSource Name"
 							:rules="[ruleNotNull]"
 							required
 						></v-text-field>
 					</v-col>
 					<v-col cols="12" :md="4" :sm="12" id="datasource-config--xid">
 						<v-text-field
-							v-model="datasource.xid"
+							v-model="datasource.tempXid"
 							label="DataSource Export Id"
 							@input="checkXidUnique"
 							:rules="[ruleNotNull, ruleXidUnique]"
@@ -127,8 +125,12 @@ export default {
 	mounted() {
 		if (this.creator) {
 			this.$store.dispatch('getUniqueDataSourceXid').then((resp) => {
-				this.datasource.xid = resp;
+				this.datasource.tempXid = resp;
+				this.datasource = JSON.parse(JSON.stringify(this.datasource));
 			});
+		} else {
+            this.datasource.tempName = this.datasource.name;
+            this.datasource.tempXid = this.datasource.xid;
 		}
 	},
 
@@ -138,7 +140,7 @@ export default {
 			xidUnique: true,
 			ruleNotNull: (v) => !!v || this.$t('validation.rule.notNull'),
 			ruleOnlyNumber: (v) => !isNaN(v) || this.$t('validation.rule.onlyNumber'),
-			ruleXidUnique: () => this.xidUnique || this.$t('validation.rule.xid.notUnique'),
+			ruleXidUnique: () => this.xidUnique || this.$t('validation.rule.xid.notUnique')
 		};
 	},
 
@@ -149,8 +151,12 @@ export default {
 		},
 
 		accept() {
-			console.debug('datasources.DataSourceConfig.vue::accept()');
-			this.$emit('accept');
+		    let datasource = JSON.parse(JSON.stringify(this.datasource));
+        	datasource.name = this.datasource.tempName;
+        	datasource.xid = this.datasource.tempXid;
+
+        	console.debug('datasources.DataSourceConfig.vue::accept()');
+			this.$emit('accept', datasource);
 		},
 
 		onUpdatePeriodTypeUpdate(value) {
@@ -162,14 +168,14 @@ export default {
 				this.datasource.id = this.datasource.id || -1;
 				let resp = await this.$store.dispatch(
 					'requestGet',
-					`/datasource/validate?xid=${this.datasource.xid}&id=${this.datasource.id}`,
+					`/datasource/validate?xid=${this.datasource.tempXid}&id=${this.datasource.id}`,
 				);
 				this.xidUnique = resp.unique;
 				this.$refs.datasourceForm.validate();
 			} catch (e) {
 				console.error('Failed to fetch data');
 			}
-		},
+		}
 	},
 };
 </script>

scadalts-ui/src/components/datasources/DataSourceConfigMixin.js

@@ -60,7 +60,8 @@ export const dataSourceConfigMixin = {
         generateUniqueXid() {
             if (this.createMode) {
                 this.$store.dispatch('getUniqueDataSourceXid').then(resp => {
-                    this.datasource.xid = resp;
+                    this.datasource.tempXid = resp;
+                    this.datasource = JSON.parse(JSON.stringify(this.datasource));
                 });
             }
         },
@@ -69,8 +70,8 @@ export const dataSourceConfigMixin = {
             this.$emit('canceled');
         },
 
-        save() {
-            this.$emit('saved', this.datasource);
+        save(data) {
+            this.$emit('saved', data);
         },
     },
 }

scadalts-ui/src/components/datasources/MetaDataSource/config.vue

@@ -6,7 +6,7 @@
 		:creator="createMode"
 		availablePeriodTypes="1,2,3,8,9,11,26,27"
 		@cancel="cancel()"
-		@accept="save()"
+		@accept="save"
 	>
 		<template v-slot:selector>
 			<slot name="selector"></slot>

scadalts-ui/src/components/datasources/MetaDataSource/index.vue

@@ -4,7 +4,7 @@
 			<config
 				v-if="detailsLoaded"
 				@canceled="closeEditor()"
-				@saved="onSaved($event)"
+				@saved="onSaved"
 				:datasource="ds"
 				:createMode="false"
 			/>

scadalts-ui/src/components/datasources/MetaDataSource/point.vue

@@ -5,7 +5,7 @@
 			:creator="createMode"
 			:datapoint="datapoint"
 			@cancel="cancel()"
-			@accept="save()"
+			@accept="save"
 		>
 			<template v-slot:selector>
 				<v-select
@@ -537,11 +537,11 @@ export default {
 			this.$emit('canceled');
 		},
 
-		async save() {
+		async save(data) {
 			console.debug('VirtualDataSource.point.vue::save()');
 			await this.validateScript();
 			if (this.validScript)
-				this.$emit('saved', this.datapoint);
+				this.$emit('saved', data);
 		},
 
 		addMsValue(array) {

scadalts-ui/src/components/datasources/ModBusIpDataSource/config.vue

@@ -5,7 +5,7 @@
 		:creator="createMode"
 		availablePeriodTypes="1,2,3,8"
 		@cancel="cancel()"
-		@accept="save()"
+		@accept="save"
 	>
 		<template v-slot:selector>
 			<slot name="selector"></slot>

scadalts-ui/src/components/datasources/ModBusIpDataSource/index.vue

@@ -4,7 +4,7 @@
 			<config
 				v-if="detailsLoaded"
 				@canceled="closeEditor()"
-				@saved="onSaved($event)"
+				@saved="onSaved"
 				:datasource="ds"
 				:createMode="false"
 			/>

scadalts-ui/src/components/datasources/ModBusIpDataSource/point.vue

@@ -7,7 +7,7 @@
 			:datapoint="datapoint"
 			:settableDisabled="settingsInputDisabled"
 			@cancel="cancel()"
-			@accept="save()"
+			@accept="save"
 		>
 			<template v-slot:selector>
 				<v-select
@@ -317,9 +317,9 @@ export default {
 			this.$emit('canceled');
 		},
 
-		save() {
+		save(data) {
 			console.debug('VirtualDataSource.point.vue::save()');
-			this.$emit('saved', this.datapoint);
+			this.$emit('saved', data);
 		},
 
 		changeRegisterRange() {

scadalts-ui/src/components/datasources/SnmpDataSource/config.vue

@@ -4,7 +4,7 @@
 		:datasource="datasource"
 		:creator="createMode"
 		@cancel="cancel()"
-		@accept="save()"
+		@accept="save"
 	>
 		<template v-slot:selector>
 			<slot name="selector"></slot>

scadalts-ui/src/components/datasources/SnmpDataSource/index.vue

@@ -4,7 +4,7 @@
 			<config
 				v-if="detailsLoaded"
 				@canceled="closeEditor()"
-				@saved="onSaved($event)"
+				@saved="onSaved"
 				:datasource="ds"
 				:createMode="false"
 			/>

scadalts-ui/src/components/datasources/SnmpDataSource/point.vue

@@ -5,7 +5,7 @@
 			:creator="createMode"
 			:datapoint="datapoint"
 			@cancel="cancel()"
-			@accept="save()"
+			@accept="save"
 		>
 			<template v-slot:selector>
 				<v-select
@@ -142,8 +142,8 @@ export default {
 			this.$emit('canceled');
 		},
 
-		save() {
-			this.$emit('saved', this.datapoint);
+		save(data) {
+			this.$emit('saved', data);
 		},
 	},
 };

scadalts-ui/src/components/datasources/VirtualDataSource/config.vue

@@ -5,7 +5,7 @@
 		:creator="createMode"
 		availablePeriodTypes="1,2,3,8"
 		@cancel="cancel()"
-		@accept="save()"
+		@accept="save"
 	>
 		<template v-slot:selector>
 			<slot name="selector"></slot>

scadalts-ui/src/components/datasources/VirtualDataSource/index.vue

@@ -4,7 +4,7 @@
 			<config
 				v-if="detailsLoaded"
 				@canceled="closeEditor()"
-				@saved="onSaved($event)"
+				@saved="onSaved"
 				:datasource="ds"
 				:createMode="false"
 			/>