Fortsatta försök att få med api_endpoint genom Flask till frontend.js där den behövs

This commit is contained in:
Joakim Persson
2024-07-25 22:55:21 +02:00
parent ccc8e73f48
commit 20fa94f533
3 changed files with 111 additions and 20 deletions
+17 -12
View File
@@ -4,25 +4,30 @@
<!-- <title>Frontend</title> -->
</head>
<body>
<script>
// Extract apiEndpoint for use in your frontend code...
const apiEndpoint = '{{ api_endpoint }}'; // Templating syntax (Jinja2)
console.log("index.html - API Endpoint: ", apiEndpoint);
</script>
<!-- This iframe will hold the content from client.html -->
<iframe id="client-frame" style="width: 100%; height: 100vh;" srcdoc="{{ client_content }}"></iframe>
<!-- Passing the API endpoint as a query parameter to the srcdoc attribute -->
<iframe id="client-frame"
style="width: 100%; height: 100vh;"
srcdoc="{{ client_content }}?apiEndpoint={{ api_endpoint }}/">
</iframe>
<!-- Responsive scaling and some padding -->
<script>
const clientFrame = document.getElementById('client-frame');
const clientFrame = document.getElementById('client-frame');
function resizeIframe() {
clientFrame.style.height = window.innerHeight - 50 + 'px'; // Adjust the subtraction for padding/margins if needed
}
function resizeIframe() {
clientFrame.style.height = window.innerHeight - 50 + 'px'; // Adjust the subtraction for padding/margins if needed
}
window.addEventListener('resize', resizeIframe);
resizeIframe(); // Call it once on page load
window.addEventListener('resize', resizeIframe);
resizeIframe(); // Call it once on page load
</script>
<script>
const apiEndpoint = '<%= api_endpoint %>'; // Templating syntax (Jinja2)
console.log("API Endpoint:", apiEndpoint);
// Use apiEndpoint in your frontend code...
</script>
</body>
</html>