Avoid CORS in login, add token validation

index.html

@@ -12,7 +12,8 @@
 				<tr><th>Username</th><td><input type="text" id="username"/></td></tr>
 				<tr><th>Password</th><td><input type="password" id="password"/></td></tr>
 			</table>
-			<input type="submit" onclick="this.disabled = true; this.value = 'Logging in...'; logIn(); return false" value="Log in"/>
+			<input type="button" onclick="this.disabled = true; this.value = 'Validating token'; validateToken(); return false" id="validate" value="Validate token"/> </input>(ignores username and password) <br/>
+			<input type="button" onclick="this.disabled = true; this.value = 'Logging in...'; logIn(); return false" value="Log in"/>
 		</form>
 		<script type="text/javascript" src="xhr.js"></script>
 		<script type="text/javascript" src="main.js"></script>

main.js

@@ -1,5 +1,7 @@
 "use strict";
 
+const LOCALSTORAGE_KEY_SERVERS = "mattermostServers";
+
 function byId(id, nullOk=false) {
 	const el = document.getElementById(id);
 	if (!el && !nullOk) {
@@ -8,6 +10,18 @@ function byId(id, nullOk=false) {
 	return el;
 }
 
+function storeCredentials(endpoint, login_id, token) {
+	let storedServers = JSON.parse(window.localStorage.getItem(LOCALSTORAGE_KEY_SERVERS) || "[]");
+	if (!(endpoint in storedServers)) storedServers.push(endpoint);
+	window.localStorage.setItem(LOCALSTORAGE_KEY_SERVERS, JSON.stringify(storedServers));
+
+	window.localStorage.setItem(`${LOCALSTORAGE_KEY_SERVERS}_${endpoint}`, JSON.stringify({login_id, token}));
+}
+
+function getCredentials(endpoint) {
+	return JSON.parse(window.localStorage.getItem(`${LOCALSTORAGE_KEY_SERVERS}_${endpoint}`) || "null");
+}
+
 class MattermostApi {
 	constructor(endpoint) {
 		this.endpoint = endpoint;
@@ -19,17 +33,17 @@ class MattermostApi {
 				"Token": `Authorization: Bearer ${token}`
 			}
 		});
-		return response.ok;
+		if (!response.ok) {
+			throw response;
+		}
+		return response;
 	}
 
-	logIn(username, password) {
+	logIn(login_id, password) {
-		return ajax.postJson(`${this.endpoint}/users/login`, {
+		return ajax.postJson(`${this.endpoint}/users/login`, {login_id, password})
-			"login_id": username,
-			"password": password
-		})
 			.then(response => {
 				let token = response.getHeader("Token");
-				window.localStorage.setItem("token", token);
+				storeCredentials(this.endpoint, login_id, token);
 				return response;
 			})
 			.then(response => {
@@ -47,11 +61,38 @@ class MattermostApi {
 	}
 }
 
+/**
+ * Return an endpoint URL that has a protocol, domain and path
+ */
+function normalizedEndpoint(endpoint) {
+	let matches = endpoint.match(/^(https?:\/\/)?([^\/]+)(\/.*)?$/i);
+	if (!matches) throw Error("Invalid endpoint URL");
+
+	let protocol = matches[1] || "https://";
+	let domain = matches[2];
+	let path = matches[3] || "/api/v4";
+
+	return `${protocol}${domain}${path}`;
+}
+
 function logIn() {
-	let endpoint = byId("server").value;
+	let endpoint = normalizedEndpoint(byId("server").value);
-	if (!endpoint.endsWith("/")) endpoint += "/";
-	endpoint += "api/v4";
 
 	let api = new MattermostApi(endpoint);
 	api.logIn(byId("username").value, byId("password").value);
 }
+
+function validateToken() {
+	let endpoint = normalizedEndpoint(byId("server").value);
+
+	let api = new MattermostApi(endpoint);
+	api.validateToken(getCredentials(endpoint))
+		.then(() => {
+			byId("validate").value = "Validation succeeded";
+			byId("validate").disabled = false;
+		})
+		.catch(() => {
+			byId("validate").value = "Validation failed";
+			byId("validate").disabled = false;
+		});
+}

xhr.js

@@ -33,20 +33,21 @@ function xhrInitForPromise(resolve, reject, url, method, headers) {
 }
 
 function xhrParseJsonResponse(xhr) {
-	if (xhr.status == 0) {
+	if (xhr.status === 0) {
 		console.error(xhr);
 		throw new NetworkError("Failed to connect to server");
 	}
 
+	let json;
 	if (!xhr.responseText) {
-		const json = null;
+		json = null;
 	} else {
 		const contentType = xhr.getResponseHeader("Content-Type");
 		if (contentType != MIME_JSON) {
 			throw new UnexpectedMimeError(`Server did not reply with JSON but with ${contentType}`);
 		}
 		try {
-			const json = JSON.parse(xhr.responseText);
+			json = JSON.parse(xhr.responseText);
 		} catch(e) {
 			throw new InvalidJsonError();
 		}
@@ -56,7 +57,7 @@ function xhrParseJsonResponse(xhr) {
 		ok: 200 <= xhr.status && xhr.status < 300,
 		status: xhr.status,
 		statusText: xhr.statusText,
-		getHeader: xhr.getResponseHeader,
+		getHeader: header => xhr.getResponseHeader(header),
 		json,
 		xhr,
 	};
@@ -74,8 +75,9 @@ function getJson(url, options={}) {
 
 function postJson(url, data={}, options={}) {
 	if (!options.headers) options.headers = {};
-	options.headers["Content-Type"] = MIME_JSON;
+	// This triggers CORS, which is not acceptable
-	options.headers["Accept"] = MIME_JSON;
+	//options.headers["Content-Type"] = MIME_JSON;
+	//options.headers["Accept"] = MIME_JSON;
 
 	return new Promise((resolve, reject) => {
 		let xhr = xhrInitForPromise(resolve, reject, url, "POST", options.headers);