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(DIRECTORY
|
||||
launch params
|
||||
launch params assets
|
||||
DESTINATION share/${PROJECT_NAME}/
|
||||
)
|
||||
|
||||
|
|
|
|||
|
|
@ -26,6 +26,8 @@ class Api:
|
|||
ui_share_directory = get_package_share_directory(self._facts.get_ui_pkg())
|
||||
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.add_routes([
|
||||
web.get('/api/ping', self.ping),
|
||||
|
|
@ -39,9 +41,12 @@ class Api:
|
|||
web.post("/api/mediamtx/auth", self.mediamtx_auth),
|
||||
web.get("/api/mediamtx/login", self.mediamtx_login),
|
||||
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
|
||||
# to work correctly.
|
||||
web.get("/{key}", self.index)
|
||||
web.get("/{key}", self.index),
|
||||
web.get("/", self.index)
|
||||
])
|
||||
|
||||
url = "0.0.0.0"
|
||||
|
|
@ -58,7 +63,11 @@ class Api:
|
|||
await runner.cleanup()
|
||||
|
||||
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):
|
||||
# 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