Herramientas para capturar y convertir la web
Comunidad en línea de GrabzIt

Usando GrabzIt javascript en local

Haga preguntas sobre cómo capturar o convertir páginas web o HTML into imágenes, documentos CSV, PDF o DOCX también sobre cómo convertir videos into GIF animados usando nuestra API.

¿Hay alguna manera de usar GrabzIt javascript en mi página local y/o en una página que no sea pública?

 

Muchas Gracias

Preguntado por Josh Wiley el 9 de septiembre de 2019

Sí, simplemente llámelo desde localhost o incluso desde un archivo html y funcionará. Por favor dígame si tiene algún problema.

Respondido por GrabzIt Support el 9 de septiembre de 2019

Bueno, gracias. Estoy empezando a entender esto un poco más. Estaba leyendo esta página: https://grabz.it/support/article/html-tips/.

Un par de preguntas sobre esto:

1) Si uso ConvertHTML, ¿es necesario que el CSS esté dentro del Div del que estoy intentando tomar una captura de pantalla? ¿O está bien tener hojas de estilo fuera de esa Div?

2) Algunas de las fuentes que estoy intentando capturar no se muestran con la fuente correcta. ¿Se tratan las fuentes de manera diferente?

Respondido por GrabzIt Support el 9 de septiembre de 2019

ConvertHtml puede convertir un string de HTML, puede incluir CSS, pero si no lo hace, deberá asegurarse de que cualquier hoja de estilo externa utilice URL absolutas.

Las fuentes deberían funcionar si se hace referencia a ellas correctamente mediante URL absolutas, etc. en el CSS.

Respondido por GrabzIt Support el 9 de septiembre de 2019

Gracias. Otra pregunta. ¿Hay alguna manera de ampliar la imagen final sin tener espacios en blanco a la derecha e inferior?  

Por ejemplo, estoy intentando hacer una captura de pantalla de un Div de 500x300 pero quiero ampliarlo a 750x450. Cuando configuro el ancho en 750 y el alto en 450, se crea una imagen de 750x450, pero el div del que estoy tomando una captura de pantalla solo aparece como una imagen de 500x300 y el resto del espacio está en blanco.

 

Muchas Gracias

Respondido por Josh Wiley el 10 de septiembre de 2019

Además, he estado probando ConvertPage y tampoco funciona, pero con resultados diferentes. A continuación se muestra un ejemplo de lo que hice. Sin embargo, corta la imagen y solo muestra aproximadamente la mitad.

 

GrabzIt("CLAVE DE APLICACIÓN").ConvertPage({
"destino": "#paddAroundExport",
"retraso": 3000,
"formato": "png",
"transparente": 1,
"baltura": -1,
"altura": -1,
"ancho": -1
}).AddTo("finalImageID");

Respondido por Josh Wiley el 10 de septiembre de 2019

Hola Josh,

Para su primera pregunta, puede configurar el tamaño del navegador en 500 por 300. Luego, establezca el ancho mayor en ampliarlo.

Hay más información en el artículo vinculado.

En tu segundo point, ¿sería posible ver la página con la que tienes problemas?

Respondido por GrabzIt Support el 10 de septiembre de 2019

Bien, veo cómo funciona la ampliación ahora para ConvertHTML. Gracias, eso es muy útil. Estaba un poco confundido acerca de lo que eran el alto y el ancho. Me estoy acercando mucho al uso de ConverHTML, pero aún quedan algunas cosas por resolver. Esta opción puede resultarme difícil porque todas las hojas de estilo deben ser accesibles, lo cual me resulta difícil porque necesito trabajar en mi versión local para probarla.

 

La opción ConverPage parece ser la mejor, pero estoy un poco más lejos de lograr que esta funcione. La mayor parte de lo que estoy haciendo es en mi local o detrás de un inicio de sesión. ¿Ayudarían las capturas de pantalla? ¿Quizás podría enviarte por correo electrónico algunas capturas de pantalla? Si no, tal vez pueda usar algo como JSFiddel para intentar recrear el problema.

Muchas Gracias

 

Respondido por Josh Wiley el 10 de septiembre de 2019

¿Todavía no puedes hacer referencia al CSS con URL absolutas? por ejemplo, https://www.example.com/styles/main.css

Desafortunadamente, una captura de pantalla no ayudaría mucho, ya que no podríamos entender por qué solo captura parte del div. Si puede ponerlo en un archivo HTML separado o JSFiddle para que podamos ver el problema. Con suerte podremos solucionarlo o asesorarlo.

Respondido por GrabzIt Support el 10 de septiembre de 2019

Con respecto a CapturePage, acabo de publicar cuál es el problema. El método CapturePage debe tener acceso a cualquier recurso disponible públicamente como se describe en este artículo.

Respondido por GrabzIt Support el 10 de septiembre de 2019

Bien, estoy estancado en cuál es mi mejor opción aquí. Creo que todavía no entiendo del todo lo que tengo que hacer. Parece que la única opción que tengo para que esto funcione en mi local es usar ConvertHTML. ¿Es eso correcto?

No estoy seguro de si haces esto, pero ¿me sería posible comunicarme contigo a través de Zoom brevemente? Si puedo hacer que esto funcione como lo necesito, me actualizaré a Enterprise. Incluso estoy dispuesto a actualizar a Enterprise de inmediato si estás dispuesto a utilizar Zoom (puedo configurarlo). creo que esto seria save ambos tenemos tiempo para que podamos detener el ir y venir. 

 

Respondido por Josh Wiley el 10 de septiembre de 2019

Ok, no lo he usado antes pero lo intentaré.

Por favor, ¿puedes enviar los detalles a través de nuestro Formulario de contacto.

Respondido por GrabzIt Support el 10 de septiembre de 2019

Gracias por la ayuda de hoy. Pude hacerlo funcionar con su ayuda y un detalle adicional. Agregué un div que envolvía el contenido que envié a través de convertHTML y utilicé la opción de destino para obtener ese div específico. Eso hizo que funcionara perfectamente. 

Me di cuenta de lo que estaba pasando cuando creé una página de prueba con el contenido exacto que estaba enviando a través de ConvertHTML. La imagen capturada capturaba una etiqueta corporal que parece ser agregada por el navegador, aunque no estaba enviando ninguna. No estoy seguro si es culpa mía o un error en GrabzIt, pero quería mencionarlo en caso de que sea un error.

Respondido por Josh Wiley el 10 de septiembre de 2019