File Uploader API
On this page
For convenience, we provide the <lr-upload-ctx-provider>
tag, which offers
additional uploader management methods. Simply place the context provider
on the page and wire it to the uploader via the ctx-name
attribute.
<lr-config
pubkey="YOUR_PUBLIC_KEY"
ctx-name="my-uploader"
></lr-config>
<lr-upload-ctx-provider
id="uploaderctx"
ctx-name="my-uploader"
></lr-upload-ctx-provider>
<lr-file-uploader-inline
css-src="https://cdn.jsdelivr.net/npm/@uploadcare/blocks@0.30.2/web/lr-file-uploader-inline.min.css"
ctx-name="my-uploader"
></lr-file-uploader-inline>
html
To access the context provider element and utilize its methods, simply retrieve it as follows:
const uploaderCtx = document.querySelector('#uploaderctx')
javascript
Upload all
uploadAll() => void
This method uploads all files that are currently in the upload list.
Add file from object
addFileFromObject(file: File, options?: { silent?: boolean; fileName?: string; }) => void
Add a file to the upload list from a File
object. The options
parameter is optional:
silent
- iftrue
, the file will be added to the upload list without triggering an event.fileName
- the name of the file to be displayed in the upload list.
Add file from UUID
addFileFromUuid(uuid: string, options?: { silent?: boolean; fileName?: string; }) => void
Add a file to the upload list from a UUID. The options
parameter is optional:
silent
- iftrue
, the file will be added to the upload list without triggering an event.fileName
- the name of the file to be displayed in the upload list.
Add file from URL
addFileFromUrl(url: string, options?: { silent?: boolean; fileName?: string; }) => void
Add a file to the upload list from a URL. The options
parameter is optional:
silent
- iftrue
, the file will be added to the upload list without triggering an event.fileName
- the name of the file to be displayed in the upload list.
Init uploader flow
initFlow() => void
This method initiates the uploader flow. Its behavior varies depending on the solution used (regular, inline, or minimal), and it is particularly useful for the regular option when you want to open the dialog programmatically.
Done uploader flow
doneFlow() => void
This method terminates the uploader flow. Its behavior depends on the solution used (regular, inline, or minimal) and is particularly useful for the regular option when you want to close the dialog programmatically.