add clientside form vailidation

This commit is contained in:
lare 2022-11-22 17:16:20 +01:00
parent 107644cbd7
commit 320176460e
3 changed files with 75 additions and 7 deletions

View file

@ -138,6 +138,7 @@ def logout():
@app.route("/login",methods=["GET","POST"]) @app.route("/login",methods=["GET","POST"])
def login(): def login():
print(session)
if request.method == "GET": if request.method == "GET":
session["return_url"] = request.args["return"] if "return" in request.args else "" session["return_url"] = request.args["return"] if "return" in request.args else ""
@ -180,8 +181,8 @@ def peerings_delete():
@app.route("/peerings/new", methods=["GET","POST"]) @app.route("/peerings/new", methods=["GET","POST"])
@auth_required() @auth_required()
def peerings_new(): def peerings_new():
print(session)
if request.method == "GET": if request.method == "GET":
print(session)
if "node" in request.args and request.args["node"] in config["nodes"]: if "node" in request.args and request.args["node"] in config["nodes"]:
return render_template("peerings-new.html", config=config, selected_node=request.args["node"], peerings=peerings) return render_template("peerings-new.html", config=config, selected_node=request.args["node"], peerings=peerings)
else: else:
@ -192,6 +193,7 @@ def peerings_new():
@app.route("/peerings", methods=["GET","POST","DELETE"]) @app.route("/peerings", methods=["GET","POST","DELETE"])
@auth_required() @auth_required()
def peerings_view(): def peerings_view():
print(session)
if request.method == "GET": if request.method == "GET":
if "node" in request.args and request.args["node"] in config["nodes"]: if "node" in request.args and request.args["node"] in config["nodes"]:
return render_template("peerings.html", config=config, selected_node=request.args["node"], peerings=peerings) return render_template("peerings.html", config=config, selected_node=request.args["node"], peerings=peerings)
@ -206,6 +208,7 @@ def peerings_view():
@app.route("/") @app.route("/")
def index(): def index():
print(session)
# print(config._config["nodes"]) # print(config._config["nodes"])
# for node in config["nodes"].values(): # for node in config["nodes"].values():
# print (node) # print (node)

View file

@ -2,10 +2,6 @@
{% block content %} {% block content %}
<div> <div>
</div>
<div>
</div> </div>
<div> <div>
<table> <table>

View file

@ -3,7 +3,74 @@
{% block content %} {% block content %}
<script> <script>
function form_validate(form) { function form_validate(form) {
console.log(form);
let msg = "<ul>";
// check wireguard pubkey
let wg_key = document.getElementById("peer-wgkey").value;
if (wg_key.length != 44 || wg_key.slice(-1) != "="){
msg += "<li>invalid Wireguard key</li>";
}
try {
window.atob(wg_key)
} catch (error) {
msg += "<li>invalid Wireguard key</li>";
}
// check endpoint
let endpoint_enabled = document.getElementById("peer-endpoint-enabled").checked;
let endpoint = document.getElementById("peer-endpoint").value;
if (endpoint_enabled) {
if (! endpoint) {
msg += "<li>endpoint enabled but non specified</li>";
} else if (isNaN(endpoint.split(":").at(-1))) {
msg += "<li>endpoint doesn't end with a (port)number</li>";
} else if (endpoint.split(":").length > 2 || endpoint.indexOf(".") == -1) {
msg += "<li>endpoint doesn't look like a ip address or fqdn</li>";
}
}
// check ip addresses
let ipv6ll_enabled = document.getElementById("peer-v6ll-enabled").checked;
let ipv4_enabled = document.getElementById("peer-v4-enabled").checked;
let ipv6_enabled = document.getElementById("peer-v6-enabled").checked;
let ipv6ll = document.getElementById("peer-v6ll").value;
let ipv4 = document.getElementById("peer-v4").value;
let ipv6 = document.getElementById("peer-v6").value;
if (!(ipv6ll_enabled || ipv4_enabled || ipv6_enabled)) {
msg += "<li>at least one ip type has to be enabled and specified</li>";
}
if (ipv6ll_enabled) {
if (! ipv6ll) {
msg += "<li>ipv6 LinkLocal enabled but non specified</li>";
} else if (!ipv6ll.startsWith("fe80::")) {
msg += "<li>ipv6 LinkLocal is no valid LinkLocal address</li>";
}
}
if (ipv4_enabled) {
if (! ipv4) {
msg += "<li>ipv4 enabled but non specified</li>";
} else if (!(ipv4.startsWith("172.2") || ipv4.startsWith("10.") || ipv4.startsWith("169.254")) ) {
msg += "<li>ipv4 is no valid dn42/neo/icvpn/LinkLocal address</li>";
}
}
if (ipv6_enabled) {
if (! ipv6) {
msg += "<li>ipv6 enabled but non specified</li>";
} else if (!ipv6.startsWith("fd")) {
msg += "<li>ipv6 is no valid fd00::/8 address</li>";
}
}
// if an error occured (= there is a msg) show that msg
if (msg != "<ul>") {
document.getElementById("peer-invalid-note").innerHTML = msg+"</ul>";
return false;
}
return true
} }
</script> </script>
@ -16,7 +83,8 @@
</a> </a>
{% endfor %} {% endfor %}
</div> </div>
<form action="" method="post" class="flex" onsubmit="form_validate(this)"> <form action="" method="post" class="flex" onsubmit="return form_validate(this)">
<div id="peer-invalid-note" style="background-color:red;"></div>
<table> <table>
<tr> <tr>
<td><label for="peer-asn">Your ASN</label></td> <td><label for="peer-asn">Your ASN</label></td>
@ -26,7 +94,7 @@
<tr> <tr>
<td><label for="peer-wgkey">your Wireguard Publickey</label></td> <td><label for="peer-wgkey">your Wireguard Publickey</label></td>
<td></td> <td></td>
<td><input type="text" name="peer-wgkey" id="peer-wgkey"></td> <td><input type="text" name="peer-wgkey" id="peer-wgkey" maxlength="44" minlength="44" required></td>
</tr> </tr>
<tr> <tr>
<td><label for="peer-endpoint">your Endpoint</label></td> <td><label for="peer-endpoint">your Endpoint</label></td>
@ -49,6 +117,7 @@
<td><input type="text" name="peer-v6" id="peer-v6"></td> <td><input type="text" name="peer-v6" id="peer-v6"></td>
</tr> </tr>
</table> </table>
<input type="submit" value="submit">
</form> </form>
<div class="example-config"> <div class="example-config">