0

Estoy realizando un proyecto de scraping con BeautifulSoup, para lo cual he creado un diccionario dentro de un ciclo for de manera que este ciclo se repite para todos los contenedores del sitio web del que los estoy raspando, me imprime en la terminal todo correcto.

El problema está cuando quiero mostrar los datos de este diccionario en una plantilla HTML, si uso:

{% for b in buscar %} 

Y empiezo a llamar a cada uno de los valores del diccionario para ordenarlos dentro de un contenedor con

{{ b.nombre }} 

Al ejecutarlo me muestra el contenedor vacío repitiéndose el número de veces como valores tiene el diccionario.

Entiendo que es un error en el bucle de HTML porque en las vistas todo me funciona bien. Y si no le pongo el bucle for en HTML solo me muestra el último elemento raspado.

Aquí dejo el código de views.py

busqueda = dict() 
product_list = soup.find_all('div', attrs= {'class':'grid-item'})
        
        for product in product_list: 
            busqueda['imagen'] = product.find('img', attrs= {'class':'no-js','srcset':True})
            busqueda['nombre'] = product.find('p').text
            busqueda['precio'] = product.find('small', attrs= {'aria-hidden':'true'}).text
            sleep(randint(3, 5))
            print(busqueda)

context = {"buscar": busqueda} 
return render(request, "index.html", context) 

Código en html

{% for b in buscar %}
<div class="card" style="width: 18rem; margin-left: 5px; margin-right: 5px;">
   <img src="{{ b.imagen }}" class="card-img-top">
   <div class="card-body">
      <h5 class="card-title">{{ b.nombre }}</h5>
      <p class="card-text">{{ b.precio }}</p>
   </div>
</div>
{% endfor %}

En este caso, el contenedor .card se mostraría 3 veces por los 3 valores que

 tiene el diccionario (imagen, nombre, precio).

Les agradecería mucho si me pudieran ayudar, llevo días en esto.

1 respuesta 1

0

Estimado Milo.7725

Identifico 2 problemas en tu código:

  1. El primero de ellos es el tipo de dato al que corresponde buscar; es un diccionario y no una lista, asumiendo que product_list contiene múltiples productos lo que deseas mostrar es la información de esos productos

Si el problema es ese lo podemos corregir de la siguiente manera:

busqueda = []
product_list = soup.find_all("div", attrs={"class": "grid-item"})

for product in product_list:
    producto = dict()
    producto["imagen"] = product.find("img", attrs={"class": "no-js", "srcset": True})
    producto["nombre"] = product.find("p").text
    producto["precio"] = product.find("small", attrs={"aria-hidden": "true"}).text
    busqueda.append(producto)
    sleep(randint(3, 5))
    print(producto)

context = {"buscar": busqueda}
return render(request, "index.html", context)

Si lo de arriba no es el enfoque que tiene tu aplicación procedemos al siguiente punto

  1. Estas iterando el diccionario como si fuera una lista y no estas obteniendo el resultado esperado: Al iterar de esta manera el diccionario lo único que logras es mostrar su key (clave) y no su valor.

Ejemplo:

sample = {"imagen": "picture.png", "precio": 125}
for item in sample:
    print(item)

El resultado que obtienes es:

imagen
precio

En todo caso si lo que deseas es obtener su valor tienes que hacer lo siguiente:

{% for key, value in buscar.items %}
<div class="card" style="width: 18rem; margin-left: 5px; margin-right: 5px;">
   <img src="{{ value }}" class="card-img-top">
   <div class="card-body">
      <h5 class="card-title">{{ value }}</h5>
      <p class="card-text">{{ value }}</p>
   </div>
</div>
{% endfor %}

Como podrás observar el código de arriba solo opera sobre los elementos de un diccionario, osea que por cada clave,valor tendrías un card y no creo que ese sea tu enfoque

Quedo al pendiente de tus comentarios

Saludos!

1
  • tenías toda la razón, estaba equivocado el tipo de dato por lo que la primera solución que mencionaste me funcionó muy bien. Muchas gracias por tu colaboración.
    – Milo.7725
    el 21 oct. 2022 a las 17:46

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.