Files
zcli-playground/cdn/index.html
T
2026-03-24 10:13:48 +01:00

53 lines
1.3 KiB
HTML

<html>
<head>
<title>CDN TEST</title>
</head>
<body>
<h1>STATIC</h1>
<p>
direct:
<img height="128" src="static/gopher_profilovka.png" alt="gopher"/>
</p>
<p>
cdn:
<img height="128" src="https://static.cdn.zerops.app/%%DOMAIN%%/static/gopher_profilovka.png" alt="gopher"/>
</p>
<p>
fetch cdn:
<div id="image-container"></div>
</p>
<hr/>
<h1>STORAGE</h1>
<p>
direct:
<img height="128" src="https://%%STORAGE_HOST%%/%%STORAGE_BUCKET%%/%%STORAGE_OBJECT%%" alt="s3-image"/>
</p>
<p>
cdn:
<img height="128" src="https://storage.cdn.zerops.app/%%STORAGE_BUCKET%%/%%STORAGE_OBJECT%%" alt="s3-image"/>
</p>
<script>
fetch('https://static.cdn.zerops.app/%%DOMAIN%%/static/gopher_profilovka.png')
.then(response => response.blob())
.then(blob => {
const objectURL = URL.createObjectURL(blob);
const img = document.createElement('img');
img.height = 128;
img.src = objectURL;
img.alt = 'gopher'
document.getElementById('image-container').appendChild(img);
img.onload = () => {
URL.revokeObjectURL(objectURL);
};
})
.catch(error => {
console.error('Error:', error);
});
</script>
</body>
</html>