ByteScout Cloud API Server - Add Text And Images To PDF - JavaScript - Add Text to Existing PDF (jQuery) - ByteScout

ByteScout Cloud API Server – Add Text And Images To PDF – JavaScript – Add Text to Existing PDF (jQuery)

  • Home
  • /
  • Articles
  • /
  • ByteScout Cloud API Server – Add Text And Images To PDF – JavaScript – Add Text to Existing PDF (jQuery)

How to add text and images to PDF in JavaScript using ByteScout Cloud API Server

If you want to learn more then this tutorial will show how to add text and images to PDF in JavaScript

The sample source codes on this page shows how to add text and images to PDF in JavaScript. What is ByteScout Cloud API Server? It is API server that is ready to use and can be installed and deployed in less than 30 minutes on your own Windows server or server in a cloud. It can save data and files on your local server-based file storage or in Amazon AWS S3 storage. Data is processed solely on the API server and is powered by ByteScout engine, no cloud services or Internet connection is required for data processing.. It can help you to add text and images to PDF in your JavaScript application.

The following code snippet for ByteScout Cloud API Server works best when you need to quickly add text and images to PDF in your JavaScript application. IF you want to implement the functionality, just copy and paste this code for JavaScript below into your code editor with your app, compile and run your application. Check JavaScript sample code samples to see if they respond to your needs and requirements for the project.

ByteScout Cloud API Server free trial version is available on our website. JavaScript and other programming languages are supported.

On-demand (REST Web API) version:
 Web API (on-demand version)

On-premise offline SDK for Windows:
 60 Day Free Trial (on-premise)

addTextToPDF.js
      
$(document).ready(function () { $("#resultBlock").hide(); $("#errorBlock").hide(); $("#result").attr("href", '').html(''); }); $(document).on("click", "#submit", function () { $("#resultBlock").hide(); $("#errorBlock").hide(); $("#inlineOutput").text(''); // inline output div $("#status").text(''); // status div var inputText = $("#inputText").val(); var fontName = $("#fontName").val(); var fontSize = $("#fontSize").val(); var fontColor = $("#fontColor").val(); var destinationXCoordinate = $("#destinationXCoordinate").val(); var destinationYCoordinate = $("#destinationYCoordinate").val(); var formData = $("#SourceFile")[0].files[0]; // file to upload $("#status").html('Getting presigned url... &nbsp;&nbsp;&nbsp; <img src="ajax-loader.gif" />'); // Please NOTE: In this sample we're assuming Cloud Api Server is hosted at "https://localhost". // If it's not then please replace this with with your hosting url. $.ajax({ url: 'https://localhost/file/upload/get-presigned-url?name=test.pdf&contenttype=application/pdf&encrypt=true', type: 'GET', success: function (result) { if (result['error'] === false) { console.log(result); var presignedUrl = result['presignedUrl']; // reading provided presigned url to put our content into $("#status").html('Uploading... &nbsp;&nbsp;&nbsp; <img src="ajax-loader.gif" />'); $.ajax({ url: presignedUrl, // no api key is required to upload file type: 'PUT', headers: { 'content-type': 'application/pdf' }, // setting to pdf type as we are uploading pdf file data: formData, processData: false, success: function (result) { var cUrl = 'https://localhost/pdf/edit/add?name=result.pdf&type=annotation&x=' + destinationXCoordinate + "&y=" + destinationYCoordinate + "&text=" + inputText + "&fontname="+ fontName +"&size="+ fontSize +"&color=" + fontColor + "&url=" + presignedUrl; $("#status").html('Processing... &nbsp;&nbsp;&nbsp; <img src="ajax-loader.gif" />'); $.ajax({ url: cUrl, type: 'POST', processData: false, contentType: false, //data: oData, success: function (result) { $("#status").text('done processing.'); if (result.error) { $("#errorBlock").show(); $("#errors").text(result.message); } else { $("#resultBlock").show(); $("#inlineOutput").text(JSON.stringify(result)); $("#iframeResultPdf").prop("src", result.url); } } }); }, error: function () { $("#status").text('error'); } }); } } }); });

ON-PREMISE OFFLINE SDK

60 Day Free Trial or Visit ByteScout Cloud API Server Home Page

Explore ByteScout Cloud API Server Documentation

Explore Samples

Sign Up for ByteScout Cloud API Server Online Training

ON-DEMAND REST WEB API

Get Your API Key

Explore Web API Docs

Explore Web API Samples

VIDEO

ON-PREMISE OFFLINE SDK

60 Day Free Trial or Visit ByteScout Cloud API Server Home Page

Explore ByteScout Cloud API Server Documentation

Explore Samples

Sign Up for ByteScout Cloud API Server Online Training

ON-DEMAND REST WEB API

Get Your API Key

Explore Web API Docs

Explore Web API Samples

Tutorials:

prev
next