Narzędzia do przechwytywania i konwertowania Internetu

Wskazówki dotyczące pisania HTML do konwersji

Interfejs API GrabzIt umożliwia konwersję dowolnego kodu HTML into PDF, DOCX, obrazy i więcej. Aby to zrobić, musisz przekazać zwykły kod HTML do naszego interfejsu API. Na przykład coś takiego jak HTML pokazany w poniższym przykładzie.

<html>
<body>
<h1>Hello World</h1>
</body>
</html>

Zauważ, że ten przykład HTML zawierał tagi HTML i BODY, ale nie jest to wymagane, jeśli chcesz tylko przekonwertować fragment kodu HTML. Jeśli jednak nie dodasz tagów HTML i BODY, zostaną one automatycznie dodane, tak jak w normalnej przeglądarce. Aby temu przeciwdziałać, możesz określić CSS, aby usunąć dodatkowe dopełnienie i marginesy w znaczniku BODY, jak pokazano poniżej.

<style>
body{margin:0;padding:0}
</style>

Jeśli chcesz dołączyć JavaScript, obrazy lub CSS do kodu HTML, który zamierzasz przekonwertować, możesz udostępnić te zasoby w dworku wbudowanym lub referencyjnym. Na przykład poniższy kod pokazuje, jak tworzyć zasoby w HTML w sposób wbudowany.

<html>
<head>
<script>
document.getElementsByTagName('H1')[0].innerText = 'Goodbye';
</script>
<style>
h1{
color:red;
}
</style>
</head>
<body>
<img width="16" height="16" alt="star" src="data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOV
SKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGA
iqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7" />
<h1>Hello World</h1>
</body>
</html>

Jak widać w powyższym przykładzie, JavaScript i CSS są zawarte bezpośrednio na stronie HTML i w jaki sposób obraz został przekształcony intlub adres URL danych.

Jeśli zamiast tego chcemy odwoływać się do tych zasobów, musimy upewnić się, że wszystkie adresy URL prowadzące do tych plików korzystają z bezwzględnych adresów URL, które są również publicznie dostępne. Oznacza to, że adres URL zawiera wszystkie informacje niezbędne do zlokalizowania zasobu. Głównym powodem jest niestosowanie bezwzględnych adresów URL obrazy, CSS i JavaScript nie są renderowane podczas konwersji HTML.

Aby to zrobić, należy umieścić JavaScript, CSS i obraz into oddzielne pliki, a następnie odnośniki w kodzie HTML, które wyglądałyby podobnie do poniższego przykładu.

<html>
<head>
<script src="http://www.example.com/myscript.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.example.com/mystyle.css">
</head>
<body>
<h1>Hello World</h1>
<img width="16" height="16" alt="star" src="http://www.example.com/star.gif" />
</body>
</html>