- Registrado
- 27 Abr 2026
- Mensajes
- 5
- Tema Autor
- #1
Buenas a todos, estoy en nivel 0 de ia, aunque llevo un par de años con ella no la uso para casi nada, porque mi dia a dia no la necesito.
Os cuento que ayer me pico la curiosidad para crear una pagina web que hiciera lo siguiente:
os pongo en contexto:
Hay una web que es https://prnt.sc/ donde si tu le escribes dos letras y seguidamente 4 digitos aleatorios, ves imagenes de la gente que ha sibido sus screenshoots a esa web.
ejemplo:
https://prnt.sc/aq1334
Entonces me pico la curiosidad, y me dije si podria crear un prompt donde me creara una web html (no python para facilitar la interfaz) donde se conectara directamente a la web y me mostrara las5 imagenes, donde yo le diera dos letras aleatorias y 4 digitos.
Os he puesto unas capturas, pero no consigo que funcione, entonces me preguntaba si los expertos me podeis decor donde fallo. Os pongo tambien el codigo:
Os cuento que ayer me pico la curiosidad para crear una pagina web que hiciera lo siguiente:
os pongo en contexto:
Hay una web que es https://prnt.sc/ donde si tu le escribes dos letras y seguidamente 4 digitos aleatorios, ves imagenes de la gente que ha sibido sus screenshoots a esa web.
ejemplo:
https://prnt.sc/aq1334
Entonces me pico la curiosidad, y me dije si podria crear un prompt donde me creara una web html (no python para facilitar la interfaz) donde se conectara directamente a la web y me mostrara las5 imagenes, donde yo le diera dos letras aleatorias y 4 digitos.
Os he puesto unas capturas, pero no consigo que funcione, entonces me preguntaba si los expertos me podeis decor donde fallo. Os pongo tambien el codigo:
HTML:
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Prnt.sc Image Downloader</title>
<style>
body {
font-family: Arial;
text-align: center;
background-color: #f4f4f4;
}
#images-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 10px;
}
img {
max-width: 300px;
max-height: 300px;
border: 2px solid #333;
object-fit: contain;
}
.input-group {
margin-bottom: 20px;
}
#error-message {
color: red;
margin-top: 10px;
}
</style>
</head>
<body>
<div class="input-group">
<input type="text" id="letters" placeholder="Dos letras" maxlength="2">
<input type="number" id="start-number" placeholder="Número inicial" min="1000">
<button onclick="downloadImages()">Buscar Imágenes</button>
</div>
<div id="error-message"></div>
<div id="images-container"></div>
<script>
async function getImageUrl(url) {
try {
// Intentar obtener la imagen directamente
const response = await fetch(`https://cors-anywhere.herokuapp.com/${url}`, {
headers: {
'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.124 Safari/537.36'
}
});
const html = await response.text();
// Patrones de búsqueda de imagen más específicos
const imagePatterns = [
/https:\/\/image\.prntscr\.com\/image\/[^"'\s]+/,
/https:\/\/i\.imgur\.com\/[a-zA-Z0-9]+\.(jpg|png|gif)/,
/image\.prntscr\.com\/[^"'\s]+/,
/src="(https:\/\/[^"]+\.(jpg|png|gif))"/,
/https:\/\/[^"'\s]+\.(jpg|png|gif)/
];
for (const pattern of imagePatterns) {
const imageMatch = html.match(pattern);
if (imageMatch) {
let finalUrl = imageMatch[1] || imageMatch[0];
// Normalizar URL si es necesario
if (!finalUrl.startsWith('http')) {
finalUrl = `https://${finalUrl}`;
}
return finalUrl;
}
}
} catch (error) {
console.error('Error al obtener imagen:', error);
}
return null;
}
async function downloadImages() {
const letters = document.getElementById('letters').value.toLowerCase();
const startNumber = parseInt(document.getElementById('start-number').value);
const container = document.getElementById('images-container');
const errorMessage = document.getElementById('error-message');
container.innerHTML = '';
errorMessage.textContent = '';
if (!letters || letters.length !== 2) {
errorMessage.textContent = 'Por favor, introduce dos letras válidas';
return;
}
for (let i = 0; i < 5; i++) {
const currentNumber = startNumber + i;
const url = `https://prnt.sc/${letters}${currentNumber}`;
try {
const imageUrl = await getImageUrl(url);
if (imageUrl) {
const img = document.createElement('img');
img.src = imageUrl;
img.alt = `Imagen ${letters}${currentNumber}`;
img.onerror = () => {
console.log(`No se pudo cargar la imagen: ${imageUrl}`);
img.style.display = 'none';
};
container.appendChild(img);
}
} catch (error) {
console.error(`Error procesando ${url}:`, error);
}
}
if (container.children.length === 0) {
errorMessage.textContent = 'No se encontraron imágenes. Prueba con otros parámetros.';
}
}
</script>
</body>
</html>
Debe funcionar en un archivo HTML standalone (sin servidor backend)
