Инструменты для захвата и конвертирования Интернета
Интернет-сообщество GrabzIt

Использование JavaScript GrabzIt на локальном компьютере

Задайте вопросы о том, как захватывать или конвертировать веб-страницы или HTML into изображения, CSV, PDF или DOCX документы, а также о том, как конвертировать видео into анимированные GIF с использованием нашего API.

Is there a way for me to use GrabzIt javascript on my local and/or a page that is not public?

 

Спасибо

Asked by Josh Wiley on the 9th of September 2019

Yes, just call it from localhost or even just a html file and it will work. Please tell me if you have any issues.

Ответ от службы поддержки GrabzIt от 9 сентября 2019 г.

OK, thanks.  I am starting to understand this a little more. I was reading this page: https://grabz.it/support/article/html-tips/.

Пара вопросов по этому поводу:

1) If I use ConvertHTML, does the CSS need to be inside Div I am trying to take a screenshot of? Or is it OK to have stylesheets outside that Div?

2) Some of the fonts I am trying to screenshot, do not show with the correct font. Are fonts treated differently?

Ответ от службы поддержки GrabzIt от 9 сентября 2019 г.

ConvertHtml can convert a string of HTML you can include the CSS but if you don't you will need to ensure any external stylesheet is using absolute URLs.

Fonts should work if they are properly referenced using absolute URLs etc in the CSS.

Ответ от службы поддержки GrabzIt от 9 сентября 2019 г.

Thanks.  Another question. Is there a way to scale up the final image without having blank space on the right and bottom?  

For example, I am trying to screenshot a Div that is 500x300 but I want to scale it up to 750x450. When I set the width to 750 and the height to 450, it creates a 750x450 image but the div that I am taking a screenshot of only shows up as a 500x300 image and the rest of the space is blank.

 

Спасибо

Answered by Josh Wiley on the 10th of September 2019

Also, I have been trying ConvertPage and it's not working either, but with different results. Below is an example of what I did. It cuts off the image though and only shows about half of it.

 

GrabzIt("APPLICATION KEY").ConvertPage({
"target": "#paddAroundExport",
"delay": 3000,
"format": "png",
"transparent": 1,
"bheight": -1,
"height": -1,
"width": -1
}).AddTo("finalImageID");

Answered by Josh Wiley on the 10th of September 2019

Привет, Джош,

For your first question you could set the browser size to 500 by 300. Then set the larger width to scale it up.

There is more information in the linked article.

On your second point, would it be possible to look at the page you are having issues with?

Ответ от службы поддержки GrabzIt от 10 сентября 2019 г.

OK, I see how scaling up works now for ConvertHTML. Thanks, that is very helpful. I was a little confused by what bheight and bwidth were. I am getting really close with using ConverHTML but a few things are still off. This option might be difficult for me because all the stylesheets need to be accessible, which is hard for me to do since I need to work on my local version to test it out.

 

The ConverPage option seems to be my best but I am a little further off from getting this one to work. Most of what I am doing is on my local or behind a login. Would screenshots help?  Maybe I could email you some screenshots?  If not, I can maybe use something like JSFiddel to try to recreate the issue.

Спасибо

 

Answered by Josh Wiley on the 10th of September 2019

Can you not still reference the CSS with absolute urls? e.g. https://www.example.com/styles/main.css

A screenshot wouldn't help much unfortunatley as we wouldn't be able to work out why it is only capturing part of the div. If you can put it in a seperate HTML file or JSFiddle so we can see the problem. We hopefully will be able to fix or advise about it.

Ответ от службы поддержки GrabzIt от 10 сентября 2019 г.

Regarding CapturePage I have just releasized what the issue is. The CapturePage method needs to have access to any publicly available resources as described in этой статье.

Ответ от службы поддержки GrabzIt от 10 сентября 2019 г.

OK, I am stuck on what my best option is here. I think I still don't fully understand what I need to do. It looks like the only option I have for this to work on my local is to use ConvertHTML. Is that correct?

Not sure if you do this, but would it be possible for me to connect with you over Zoom briefly?  If I can get this to work as I need it, I will be upgrading to the Enterprise.  I am even willing to upgrade to Enterprise right away if you are willing to jump on Zoom ( I can set it up). I think this would save us both time so we can stop the back and forth. 

 

Answered by Josh Wiley on the 10th of September 2019

Ok, I haven't used that before but I will give it a go.

Please can you send the details through our Форма обратной связи.

Ответ от службы поддержки GrabzIt от 10 сентября 2019 г.

Thanks for the help today. I was able to get it to work with your help and one additional detail. I added a div that wrapped around the content I sent through convertHTML and use the target option to get that specific div. That made it work perfectly. 

I realized what was happening when I created a test page with the exact contents I was sending through ConvertHTML. The captured image was capturing a body tag that appears to be added by the browser, even though I was not sending one.  Not sure if that is my fault or a bug in GrabzIt but wanted to mention it in case it's a bug.

Answered by Josh Wiley on the 10th of September 2019