link

PrintCSS

Can I use JavaScript within my Code?

PagedJS and Vivliostyle both handle JavaScript just like your browser would do. Why? Because they also use a headless Chromium in the background but have a layer on top to support the modern CSS Paged Media features.

To send JavaScript, either you directly put it in a script tag within your HTML or add it in the JavaScript section within the JSON body.

{
    "html": "<h1 id='js'>Hello PrintCSS Cloud!</h1>",
    "css": "h1 { color: red; }",
    "javascript": "document.getElementById('js').style.backgroundColor = 'blue';"
}

To send the request to our API now, you need to subscribe to a plan on RapidAPI. With this, you get the API key that is required to authenticate with our REST service.

The Request as cURL would look like the following:

curl --location --request POST 'https://printcss-cloud.p.rapidapi.com/render' \
--header 'x-rapidapi-host: printcss-cloud.p.rapidapi.com' \
--header 'x-rapidapi-key: YOUR_API_KEY' \
--data-raw '{
    "html": "<h1 id='\''js'\''>Hello PrintCSS Cloud!</h1>",
    "css": "h1 { color: red; }",
    "javascript": "document.getElementById('\''js'\'').style.backgroundColor = '\''blue'\'';"
}'

In PHP, you can do it like this:

<?php

$curl = curl_init();

curl_setopt_array($curl, [
    CURLOPT_URL => 'https://printcss-cloud.p.rapidapi.com/render',
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_ENCODING => '',
    CURLOPT_MAXREDIRS => 10,
    CURLOPT_TIMEOUT => 0,
    CURLOPT_FOLLOWLOCATION => true,
    CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
    CURLOPT_CUSTOMREQUEST => 'POST',
    CURLOPT_POSTFIELDS =>'{
        "html": "<h1 id=\'js\'>Hello PrintCSS Cloud!</h1>",
        "css": "h1 { color: red; }",
        "javascript": "document.getElementById(\'js\').style.backgroundColor=\'blue\';"
    }',
    CURLOPT_HTTPHEADER => [
        'x-rapidapi-host: printcss-cloud.p.rapidapi.com',
        'x-rapidapi-key: YOUR_API_KEY'
    ],
]);

$response = curl_exec($curl);

curl_close($curl);
echo $response;

If you use Java, your request might look like the following:

OkHttpClient client = new OkHttpClient().newBuilder()
  .build();
MediaType mediaType = MediaType.parse("text/plain");
RequestBody body = RequestBody.create(mediaType, "{\r\n\t\"html\": \"<h1 id='js'>Hello PrintCSS Cloud!</h1>\",\r\n\t\"css\":  \"h1 { color: red; }\",\r\n\t\"javascript\": \"document.getElementById('js').style.backgroundColor='blue';\"\r\n}");
Request request = new Request.Builder()
  .url("https://printcss-cloud.p.rapidapi.com/render")
  .method("POST", body)
  .addHeader("x-rapidapi-host", "printcss-cloud.p.rapidapi.com")
  .addHeader("x-rapidapi-key", "YOUR_API_KEY")
  .build();
Response response = client.newCall(request).execute();

The result of the above-mentioned request body can be found in the attached PDF.

pdf rendered with javascript (PDF, 11.58 KB)