-
Notifications
You must be signed in to change notification settings - Fork 1
/
jslogin.htm
91 lines (70 loc) · 3.45 KB
/
jslogin.htm
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
<!DOCTYPE HTML>
<html>
<head>
<title>Secure Javascript Login page</title>
<meta charset="UTF-8" />
<meta name="Description" content="jslogin - A secure javascript login page">
<meta name="Author" content="Rainer Wess">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script>
/*
jslogin - Rainer Wess - 04.01.2018
Secure Javascript Login Script - no userids or passwords are stored in the script.
How to use:
Copy this file into a folder on your webspace, make a subdirectory user were the individual private websites for the users are stored. For every user you allow to login, are two files nessesary. A little .gif-image and a website (.htm). Lets say you want a user "Paul" with the password "Asd613" to login. Place a little .gif-image named Paul_Asd613.gif in the user directory.Which image doesnt matter, it will be shown nowhere, but it should be there and as small as posible. Then create a website Paul_Asd613.htm in the user directory. This is the website the user will see after he logged in.
How it works:
When a user tries to login the script tries to load the image {userid}_{password}.gif - if this is successful the userid and password are valid and the welcome-page for the user is loaded. If user/password are not valid loading the image fails - In this case no website is loaded. The image is just there to prevent http 404 (file not found) error messages for nonexisting oder mistyped user/password - combinations, which would be the case if the private website would be loaded directly.
This script is only secure when:
1) Directory listing for the webspace is disabled (normaly the case,if not put a blank index.htm into the user directory).
2) The private/protected websites are named that it is impossible to guess them: Do NOT name them members.htm, privat.htm, secret.htm ...a good name is for example Dghf8drghe3rzu.htm
Other Limitations:
Username and Password can only use characters that are allowed in the filesystem of the webserver. Not allowed are characters where you have zo use escape characters in javssript or which the filesystem uses itself, for example / (slash)
or \ (backslash).
Have chosen the shortest form, instead of this:
shadow.onerror = accessDenied;
shadow.onload = loginSuccess;
you could write:
shadow.addEventListener("error",accessDenied);
shadow.addEventListener("load", loginSuccess);
or:
shadow.onerror = function(){accessDenied()};
shadow.onload = function(){loginSuccess()};
*/
var userid;
var passwd;
function id(id) {
return document.getElementById(id);
}
function showInfo(txt) {
id("info").innerHTML = txt;
}
function loginDenied() {
showInfo("Login failed.");
id("passwd").value = "";
}
function loginSuccess() {
showInfo("Logging in.");
window.location = "user/" + userid + "_" + passwd + ".htm";
}
function login() {
var shadow = new Image();
shadow.onerror = loginDenied;
shadow.onload = loginSuccess;
userid = id("userid").value;
passwd = id("passwd").value;
shadow.src = "user/" + userid + "_" + passwd + ".gif";
}
</script>
</head>
<body>
<p>
<form oninput="showInfo(' ')">
<p><input type="text" id="userid" placeholder="Username" autofocus required /><p>
<input type="password" id="passwd" placeholder="Password" required /><p>
<input type="button" onclick="login()" value="LOG IN"/>
</form>
<p>
<span id="info"> </span><p>
Test-User: Paul - Password: Asd613
</body>
</html>