Hi,
I started building out a web app using Webflow, Wized, and Xano. I have some content which is statically rendered in Webflow rather than injected via API request to the database. I would like that content to not be parsed to the client should the authentication validation API request be unauthorized. Is this possible? This is the script I have in the head tag of my page, and it handles the API request then the redirection great, but the HTML content is still being parsed to the client before the redirect which I can see in an HTTP trace. Not sure if I’m wording this all right, I’m super new to development.
<script>
// Delete the token cookie.
delete token;
delete tokenCookie;
// Get the user's token from the cookie.
const tokenCookie = document.cookie.match('token=([^;]+)');
const token = tokenCookie[1];
// If the token is not valid, do not load the Wized scripts and redirect the user to the login page.
if (!token || token === '') {
window.location.href = '/auth/login';
}
// Create a variable to track whether the auth has failed.
let authFailed = false;
async function initialize() {
// Wait for the `/auth/me` API call to complete before redirecting the user.
const response = await fetch('https://--------.xano.io/-------/auth/me', {
headers: {
Authorization: `Bearer ${token}`
}
});
// If the API call is unauthorized, set the authFailed flag to true and redirect the user to the login page.
if (response.status === 401) {
authFailed = true;
window.location.href = '/auth/login';
return;
}
}
// Call the initialize() function.
initialize();
// Wait for the DOM to load before executing the first script.
document.addEventListener('DOMContentLoaded', function() {
// Create the Wized script elements.
const script1 = document.createElement('script');
const script2 = document.createElement('script');
// Set the src attribute of the first script element to the Wized script URL.
script1.src = 'https://embed.wized.com/----------------------';
// Set the data-wized-id attribute and src attribute of the second script element to the Wized script URL.
script2.setAttribute('data-wized-id', '----------');
script2.src = 'https://embed.wized.com';
// Append the script elements to the head element of the document in the correct order.
document.head.appendChild(script1);
document.head.appendChild(script2);
});
</script>
Thanks in advance for any help here!