Kubernetes WebGui
Kubernetes is a go to software for all the developers out there who use docker and it’s services. Making a container is one thing but to utilize it at a product level is another thing. That’s where kubernetes come into play. I helps developers to scale and automate the docker process to keep the program ever running without having to keep a close look on it all the time.
Today, to make that process easier we will make a WebGui for kubernetes to make the process easier and accessible from anywhere.
First we will start with the index file of the front end
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Docker-webgui</title>
<!--<link rel="stylesheet" href="./stylesheet.css" />-->
</head>
<script>
function harsh() {
var xhr = new XMLHttpRequest();
cmd = document.getElementById("value").value;
xhr.open("GET", "http://<yourip>/cgi-bin/cmd.py?x=" + cmd, false);
xhr.send();
var output = xhr.responseText;
document.getElementById("value3").innerHTML = output;
}
function harsh2() {
document.getElementById("value").value = "";
document.getElementById("value3").innerHTML = "";
}
</script>
<style>
* {
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
section {
text-align: center;
}
button {
width: 8rem;
}
</style>
<body>
<section>
<h1>Welcome to your Kubernetes WebGui</h1>
<div>
It's easy, write your commands and you would see the output directly
</div>
<div>(Yeah we know, we do magic behind closed doors!)</div>
</section>
<br /><br /><br /><br />
<section>
<input type="text" id="value" />
<br /><br />
<div id="value3">.....</div>
<br />
<br />
<button onclick="harsh();">Run Command</button>
<button onclick="harsh2();">Reset</button>
</section>
</body>
</html>Now as our simple yet useful front end is ready, we will work on the python script that will do all the work in background for us.
#!/usr/bin/python3
print("content-type: text/html")
print()
import cgi
import subprocess
f=cgi.FieldStorage()
cmd=f.getvalue("y")
if "launch" in cmd:
if "pod" in cmd:
x=cmd.split('pod')
x1=x[-1].split(' ')
o=subprocess.getoutput("kubectl --kubeconfig /usr/share/httpd/admin.conf run "+ x1[1] + " --image="+x1[-1])
if "create" in cmd:
if "deployment" in cmd:
x=cmd.split('deployment')
x1=x[-1].split(' ')
o=subprocess.getoutput("kubectl --kubeconfig /usr/share/httpd/admin.conf create deployment "+ x1[1] + " --image="+x1[-1])
if "expose" in cmd:
if "deployment" in cmd:
x=cmd.split('deployment')
x1=x[-1].split(' ')
o=subprocess.getoutput("kubectl --kubeconfig /usr/share/httpd/admin.conf expose deployment "+ x1[1] + " --image="+x1[-1])
if "scale" in cmd:
if "deployment" in cmd:
x=cmd.split('deployment')
x1=x[-1].split(' ')
o=subprocess.getoutput("kubectl --kubeconfig /usr/share/httpd/admin.conf scale deployment "+ x1[1] + " --replica="+x1[-1])
if "environment" in cmd:
if "delete" in cmd:
x=cmd.split('delete')
x1=x[-1].split(' ')
o=subprocess.getoutput("kubectl --kubeconfig /usr/share/httpd/admin.conf delete svc "+ x1[1])
if "delete" in cmd:
if "pod" in cmd:
x=cmd.split('pod')
x1=x[-1].split(' ')
o=subprocess.getoutput("kubectl --kubeconfig /usr/share/httpd/admin.conf delete pod "+ x1[1])
if "kubectl" in cmd:
o=subprocess.getoutput(cmd)
print(o)This is our backend script that will run the code on the script.
Now to access this WebGui we will need to run it using httpd server. This will allow the client to run the commands on the webgui, which will be executed on the server and the output will be shown to the user.
I hope you understand how we have created this simple GUI so that you can try to add more features in the same. Thank you for reading!
