Flag of Ukraine   We stand with the brave people of Ukraine. Stop the war. Find out how you can help.

Import From URL

The @uppy/url plugin allows users to import files from the internet. Paste any URL and it will be added!

A Companion instance is required for the @uppy/url plugin to work. Companion will download the files and upload them to their destination. This saves bandwidth for the user (especially on mobile connections) and helps to avoid CORS restrictions.

import Url from '@uppy/url'

uppy.use(Url, {
  // Options

Try it live


This plugin is published as the @uppy/url package.

Install from NPM:

npm install @uppy/url

In the CDN package, the plugin class is available on the Uppy global object:

const { Url } = Uppy


The @uppy/url plugin requires the following CSS for styling:

import '@uppy/core/dist/style.css'
import '@uppy/url/dist/style.css'

Import general Core styles from @uppy/core/dist/style.css first, then add the Url styles from @uppy/url/dist/style.css. A minified version is also available as style.min.css at the same path. The way to do import depends on your build system.


The @uppy/url plugin has the following configurable options:

uppy.use(Url, {
  target: Dashboard,
  companionUrl: 'https://companion.uppy.io/',
  locale: {},

id: 'Url'

A unique identifier for this plugin. It defaults to 'Url'.

Configures the title / name shown in the UI, for instance, on Dashboard tabs. It defaults to 'Link'.

target: null

DOM element, CSS selector, or plugin to mount the URL provider into. This should normally be the @uppy/dashboard plugin.

companionUrl: null

URL to an Companion instance.

companionCookiesRule: 'same-origin'

This option correlates to the RequestCredentials value, which tells the plugin whether to send cookies to Companion.

locale: {}

export default {
  strings: {
    // Label for the "Import" button.
    import: 'Import',
    // Placeholder text for the URL input.
    enterUrlToImport: 'Enter URL to import a file',
    // Error message shown if Companion could not load a URL.
    failedToFetch: 'Companion failed to fetch this URL, please make sure it’s correct',
    // Error message shown if the input does not look like a URL.
    enterCorrectUrl: 'Incorrect URL: Please make sure you are entering a direct link to a file',



You can add a file to the Url plugin directly via the API, like this: