Refactor status rendering to fix XSS

This commit is contained in:
windbus 2026-04-08 20:53:42 +02:00
parent 3fbd4492db
commit 07efefff1c

View file

@ -188,12 +188,27 @@ export async function loadProfile(username) {
const statusEl = document.getElementById('profile-status'); const statusEl = document.getElementById('profile-status');
try { try {
const statusObj = JSON.parse(profile.status); const statusObj = JSON.parse(profile.status);
statusEl.innerHTML = `
<span style="opacity: 0.7; margin-right: 0.25rem;">Listening to:</span> statusEl.replaceChildren();
<img src="${statusObj.image}" style="width: 20px; height: 20px; border-radius: 2px; vertical-align: middle; margin-right: 0.5rem;">
<a href="${statusObj.link}" class="status-link" style="color: inherit; text-decoration: none; font-weight: 500;">${statusObj.text}</a> const label = document.createElement('span');
`; label.style.cssText = 'opacity: 0.7; margin-right: 0.25rem;';
statusEl.querySelector('.status-link').onclick = (e) => { label.textContent = 'Listening to:';
const img = document.createElement('img');
img.src = statusObj.image;
img.style.cssText = 'width: 20px; height: 20px; border-radius: 2px; vertical-align: middle; margin-right: 0.5rem;';
const link = document.createElement('a');
if (statusObj.link.startsWith("/")) {
link.href = statusObj.link;
}
link.className = 'status-link';
link.style.cssText = 'color: inherit; text-decoration: none; font-weight: 500;';
link.textContent = statusObj.text;
statusEl.append(label, img, link);
link.onclick = (e) => {
e.preventDefault(); e.preventDefault();
navigate(statusObj.link); navigate(statusObj.link);
}; };