Uploads a new document with options to the server in one shot.
uploadFileDocument = function(
blob,
uploadOptions
)
static uploadFileDocument(
blob: Blob,
uploadOptions: UploadDocumentOptions
): AbortableJqueryPromise;
blob
The JavaScript Blob
/File
object representing the file to upload.
uploadOptions
Options to use with the new document. This value cannot be null.
A Promise object that can resolve successfully to a special uri pointing to the location of the newly-created LEADDocument in the cache (verifiable with IsUploadDocumentUri). The returned Promise has a unique type of AbortableJQueryPromise that holds the abort method.
When the value of UploadDocumentOptions.documentId is null (the default), then the document factory will create a new, unique ID using a GUID generator. If the value is not null, then it is assumed to be a user-defined ID and used as is. In either case, the value is set in the LEADDocument.DocumentId property of the newly created document.
User-defined IDs can be used when the system already has unique IDs associated with the documents to be viewer. The document factory will neither check nor guarantee the uniqueness of these IDs.
The UploadFileDocument method is an abstraction of three other methods used together to manage the upload of a resource, as follows:
UploadFileDocument wraps together the functionality of these three methods, and returns a url to the uploaded resource when the Promise resolves. This url can be used to load the document with LoadFromUri.
The data is uploaded in chunks and the size of each chunk uploaded is determined by uploadBlobChunkSize.
The Promise for this method can receive progress events. Refer to DocumentUploadProgress for more information.
The Promise object that is returned immediately by calling UploadFileDocument is of type AbortableJQueryPromise, an extension of the usual jQuery Promise object. This class adds an additional method, Abort, which has the same functionality as AbortUploadDocument but is not static, and thus does not need the uri of the uploading file. If the upload is aborted, the fail
callback to the Promise object will be called with all three parameters set as null. See Promises for more information.
This method uses the JavaScript File
object to obtain access to a file on the local machine.
Note that the browser must support the FileReader API in order to manipulate file system data on the local machine. If the FileReader
API is not supported, an error will be thrown and IsBrowserError will return true.
Refer to Uploading Using the Document Library for detailed information on how to use this method and the various options used.
This example will upload a file from the local machine and then download it as a LEADTOOLS Document object ready to be used.
import { DocumentHelper } from "../../utilities/DocumentHelper";
export class DocumentFactory_UploadFileDocumentExample {
public constructor() {
lt.RasterSupport.setLicenseUri("https://demo.leadtools.com/licenses/v200/LEADTOOLSEVAL.txt", "EVAL", null);
DocumentHelper.initFactory();
}
public run = (buttonID: string) => {
const exampleButton = document.getElementById(buttonID);
// Add a file select
const fileInput = document.createElement("input");
fileInput.type = "file";
exampleButton.parentNode.appendChild(fileInput);
// add an "upload" button
const uploadButton = document.createElement("button");
uploadButton.type = "button";
uploadButton.innerHTML = "Click to Upload";
exampleButton.parentNode.appendChild(uploadButton);
uploadButton.onclick = () => {
const file = fileInput.files[0];
if (!file) {
alert("No file!");
return;
}
// Upload it
DocumentHelper.log("Uploading...");
// Create upload options
let uploadDocumentOptions = new lt.Document.UploadDocumentOptions();
// Enable streaming on the server
uploadDocumentOptions.enableStreaming = true;
lt.Document.DocumentFactory.uploadFileDocument(file, uploadDocumentOptions)
.done((uri) => {
// Done, now load it
DocumentHelper.log("Finished uploading. Now loading...");
const loadDocumentOptions = new lt.Document.LoadDocumentOptions();
// Set the name
loadDocumentOptions.name = file.name;
lt.Document.DocumentFactory.loadFromUri(uri, loadDocumentOptions)
.done((doc) => {
DocumentHelper.log("Document was loaded successfully");
DocumentHelper.log("Name is " + doc.name);
DocumentHelper.log("MIMEType is " + doc.mimeType);
DocumentHelper.log("Number of Pages is " + doc.pages.count);
})
.fail(DocumentHelper.showServiceError);
})
.fail(DocumentHelper.showServiceError);
}
}
}
export class DocumentHelper {
static showServiceError = (jqXHR, statusText, errorThrown) => {
alert("Error returned from service. See the console for details.");
const serviceError = lt.Document.ServiceError.parseError(jqXHR, statusText, errorThrown);
console.error(serviceError);
}
static log = (message: string, data?: any) => {
const outputElement = document.getElementById("output");
if (outputElement) {
const time = (new Date()).toLocaleTimeString();
const textElement = document.createElement("p");
textElement.innerHTML = (outputElement.childElementCount + 1) + " [" + time + "]: " + message;
outputElement.insertBefore(textElement, outputElement.firstChild);
}
if (!data)
console.log(message);
else
console.log(message, data);
}
static initFactory = () => {
// To communicate with the DocumentsService, it must be running!
// Change these parameters to match the path to the service.
lt.Document.DocumentFactory.serviceHost = "http://localhost:40000";
lt.Document.DocumentFactory.servicePath = "";
lt.Document.DocumentFactory.serviceApiPath = "api";
}
}
import { DocumentHelper } from "../../utilities/DocumentHelper";
export class DocumentFactory_UploadFileDocumentExample {
constructor() {
lt.RasterSupport.setLicenseUri("https://demo.leadtools.com/licenses/v200/LEADTOOLSEVAL.txt", "EVAL", null);
DocumentHelper.initFactory();
}
run = (buttonID) => {
const exampleButton = document.getElementById(buttonID);
// Add a file select
const fileInput = document.createElement("input");
fileInput.type = "file";
exampleButton.parentNode.appendChild(fileInput);
// add an "upload" button
const uploadButton = document.createElement("button");
uploadButton.type = "button";
uploadButton.innerHTML = "Click to Upload";
exampleButton.parentNode.appendChild(uploadButton);
uploadButton.onclick = () => {
const file = fileInput.files[0];
if (!file) {
alert("No file!");
return;
}
// Upload it
DocumentHelper.log("Uploading...");
// Create upload options
let uploadDocumentOptions = new lt.Document.UploadDocumentOptions();
// Enable streaming on the server
uploadDocumentOptions.enableStreaming = true;
lt.Document.DocumentFactory.uploadFileDocument(file, uploadDocumentOptions)
.done((uri) => {
// Done, now load it
DocumentHelper.log("Finished uploading. Now loading...");
const loadDocumentOptions = new lt.Document.LoadDocumentOptions();
// Set the name
loadDocumentOptions.name = file.name;
lt.Document.DocumentFactory.loadFromUri(uri, loadDocumentOptions)
.done((doc) => {
DocumentHelper.log("Document was loaded successfully");
DocumentHelper.log("Name is " + doc.name);
DocumentHelper.log("MIMEType is " + doc.mimeType);
DocumentHelper.log("Number of Pages is " + doc.pages.count);
})
.fail(DocumentHelper.showServiceError);
})
.fail(DocumentHelper.showServiceError);
}
}
}
export class DocumentHelper {
static showServiceError = (jqXHR, statusText, errorThrown) => {
alert("Error returned from service. See the console for details.");
const serviceError = lt.Document.ServiceError.parseError(jqXHR, statusText, errorThrown);
console.error(serviceError);
}
static log = (message, data) => {
const outputElement = document.getElementById("output");
if (outputElement) {
const time = (new Date()).toLocaleTimeString();
const textElement = document.createElement("p");
textElement.innerHTML = (outputElement.childElementCount + 1) + " [" + time + "]: " + message;
outputElement.insertBefore(textElement, outputElement.firstChild);
}
if (!data)
console.log(message);
else
console.log(message, data);
}
static initFactory = () => {
// To communicate with the DocumentsService, it must be running!
// Change these parameters to match the path to the service.
lt.Document.DocumentFactory.serviceHost = "http://localhost:40000";
lt.Document.DocumentFactory.servicePath = "";
lt.Document.DocumentFactory.serviceApiPath = "api";
}
}
<!doctype html>
<html lang="en">
<title>Document Example | UploadFileDocument</title>
<head>
<script src="https://code.jquery.com/jquery-2.2.4.min.js"
integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
<script src="../../LT/Leadtools.js"></script>
<script src="../../LT/Leadtools.Controls.js"></script>
<script src="../../LT/Leadtools.Annotations.Engine.js"></script>
<script src="../../LT/Leadtools.Annotations.Designers.js"></script>
<script src="../../LT/Leadtools.Annotations.Rendering.Javascript.js"></script>
<script src="../../LT/Leadtools.Annotations.Automation.js"></script>
<script src="../../LT/Leadtools.ImageProcessing.Main.js"></script>
<script src="../../LT/Leadtools.ImageProcessing.Color.js"></script>
<script src="../../LT/Leadtools.ImageProcessing.Core.js"></script>
<script src="../../LT/Leadtools.ImageProcessing.Effects.js"></script>
<script src="../../LT/Leadtools.Document.js"></script>
<script src="../../LT/Leadtools.Document.Viewer.js"></script>
<link rel="stylesheet" type="text/css" href="../../css/examples.css">
<!-- All demo files are bundled and appended to the window -->
<script src="../../bundle.js" type="text/javascript"></script>
</head>
<body>
<div>
<button type="button" id="exampleButton">Run Example</button>
</div>
<div id="output"></div>
<div>
<img id="img" />
</div>
</body>
<script>
window.onload = () => {
const example = new window.examples.DocumentFactory.UploadFileDocument();
example.run("exampleButton");
};
</script>
</html>
Help Collections
Raster .NET | C API | C++ Class Library | HTML5 JavaScript
Document .NET | C API | C++ Class Library | HTML5 JavaScript
Medical .NET | C API | C++ Class Library | HTML5 JavaScript
Medical Web Viewer .NET
Multimedia
Direct Show .NET | C API | Filters
Media Foundation .NET | C API | Transforms
Supported Platforms
.NET, Java, Android, and iOS/macOS Assemblies
Imaging, Medical, and Document
C API/C++ Class Libraries
Imaging, Medical, and Document
HTML5 JavaScript Libraries
Imaging, Medical, and Document