Make a separate login page and protect assets.
This commit is contained in:
parent
01523517d2
commit
28fc4e0f68
|
|
@ -14,7 +14,7 @@ install(DIRECTORY
|
||||||
|
|
||||||
# Install launch and param files.
|
# Install launch and param files.
|
||||||
install(DIRECTORY
|
install(DIRECTORY
|
||||||
launch params
|
launch params assets
|
||||||
DESTINATION share/${PROJECT_NAME}/
|
DESTINATION share/${PROJECT_NAME}/
|
||||||
)
|
)
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -26,6 +26,8 @@ class Api:
|
||||||
ui_share_directory = get_package_share_directory(self._facts.get_ui_pkg())
|
ui_share_directory = get_package_share_directory(self._facts.get_ui_pkg())
|
||||||
ui_static_directory = ui_share_directory + "/dist/assets"
|
ui_static_directory = ui_share_directory + "/dist/assets"
|
||||||
|
|
||||||
|
server_static_directory = get_package_share_directory("am_i_up") + "/assets"
|
||||||
|
|
||||||
app = web.Application(middlewares=[self._authenticator.build_middleware()])
|
app = web.Application(middlewares=[self._authenticator.build_middleware()])
|
||||||
app.add_routes([
|
app.add_routes([
|
||||||
web.get('/api/ping', self.ping),
|
web.get('/api/ping', self.ping),
|
||||||
|
|
@ -39,9 +41,12 @@ class Api:
|
||||||
web.post("/api/mediamtx/auth", self.mediamtx_auth),
|
web.post("/api/mediamtx/auth", self.mediamtx_auth),
|
||||||
web.get("/api/mediamtx/login", self.mediamtx_login),
|
web.get("/api/mediamtx/login", self.mediamtx_login),
|
||||||
web.static("/assets", ui_static_directory),
|
web.static("/assets", ui_static_directory),
|
||||||
|
web.static("/server_assets", server_static_directory),
|
||||||
|
web.get('/login', self.login_page),
|
||||||
# we're not actually using key anywhere, but doing this allows react router
|
# we're not actually using key anywhere, but doing this allows react router
|
||||||
# to work correctly.
|
# to work correctly.
|
||||||
web.get("/{key}", self.index)
|
web.get("/{key}", self.index),
|
||||||
|
web.get("/", self.index)
|
||||||
])
|
])
|
||||||
|
|
||||||
url = "0.0.0.0"
|
url = "0.0.0.0"
|
||||||
|
|
@ -58,7 +63,11 @@ class Api:
|
||||||
await runner.cleanup()
|
await runner.cleanup()
|
||||||
|
|
||||||
def get_open_endpoints(self):
|
def get_open_endpoints(self):
|
||||||
return ["/login", "/api/login", "/assets/(.*)", "/api/mediamtx/auth"]
|
return ["/login", "/api/login", "/server_assets/(.*)", "/api/mediamtx/auth"]
|
||||||
|
|
||||||
|
async def login_page(self, request):
|
||||||
|
login_page = get_package_share_directory("am_i_up") + "/assets/login.html"
|
||||||
|
return web.FileResponse(login_page)
|
||||||
|
|
||||||
async def mediamtx_auth(self, request):
|
async def mediamtx_auth(self, request):
|
||||||
# Take the mediamtx json and figure out if I'm a valid user.
|
# Take the mediamtx json and figure out if I'm a valid user.
|
||||||
|
|
|
||||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,54 @@
|
||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<title>Bootstrap HTML Example</title>
|
||||||
|
<link href="server_assets/bootstrap.css" rel="stylesheet">
|
||||||
|
<style>
|
||||||
|
.vert-padded {
|
||||||
|
padding-top: 10px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<div class="container vert-padded">
|
||||||
|
<form id="loginForm">
|
||||||
|
<div class="mb-3">
|
||||||
|
<label for="passwordForm" class="form-label">Password</label>
|
||||||
|
<input name="password" type="password" class="form-control" id="passwordForm" />
|
||||||
|
</div>
|
||||||
|
<button type="submit" class="btn btn-primary">Submit</button>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
console.log("Hello");
|
||||||
|
document.getElementById('loginForm').addEventListener('submit', async (event) => {
|
||||||
|
console.log("submit");
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
|
console.log(event.target);
|
||||||
|
const formEntries = new FormData(event.target);
|
||||||
|
const formData = Object.fromEntries(formEntries);
|
||||||
|
console.log(formData);
|
||||||
|
|
||||||
|
const resp = await fetch("/api/login", {
|
||||||
|
method: "POST",
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "application/json",
|
||||||
|
},
|
||||||
|
body: JSON.stringify(formData),
|
||||||
|
});
|
||||||
|
if (resp.redirected) {
|
||||||
|
window.location.assign("/");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<script src="server_assets/bootstrap.bundle.js"</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Loading…
Reference in New Issue