axios/axios · error · AxiosError

ERR_INVALID_URL

ERR_INVALID_URL

Error message

Invalid URL

What it means

Thrown by the data-URI parser when a URL with the `data:` protocol does not match the RFC 2397 grammar `data:[<mediatype>][;base64],<data>`. axios supports requesting data: URLs directly (mainly in Node), and this ERR_INVALID_URL means the part after `data:` is malformed — most often a missing comma separating the metadata from the payload.

Source

Thrown at lib/helpers/fromDataURI.js:35

 * @param {?Function} options.Blob
 *
 * @returns {Buffer|Blob}
 */
export default function fromDataURI(uri, asBlob, options) {
  const _Blob = (options && options.Blob) || platform.classes.Blob;
  const protocol = parseProtocol(uri);

  if (asBlob === undefined && _Blob) {
    asBlob = true;
  }

  if (protocol === 'data') {
    uri = protocol.length ? uri.slice(protocol.length + 1) : uri;

    const match = DATA_URL_PATTERN.exec(uri);

    if (!match) {
      throw new AxiosError('Invalid URL', AxiosError.ERR_INVALID_URL);
    }

    const type = match[1];
    const params = match[2];
    const encoding = match[3] ? 'base64' : 'utf8';
    const body = match[4];

    // RFC 2397 section 3: default mediatype is text/plain;charset=US-ASCII
    // Bare `data:,` leaves mime undefined; Blob normalises that to "" per spec.
    let mime = '';
    if (type) {
      mime = params ? type + params : type;
    } else if (params) {
      mime = 'text/plain' + params;
    }

    const buffer = encoding === 'base64'
      ? Buffer.from(body, 'base64')

View on GitHub (pinned to c3f553c740)

Solutions

  1. Fix the data URI format: it must be `data:[mime][;base64],<payload>` — e.g. `data:image/png;base64,iVBORw0...`; the comma is mandatory.
  2. If the URI is generated, verify the full string isn't truncated (check its length against the expected payload).
  3. If you already hold the raw bytes, skip the data URI round-trip and use the Buffer/Blob directly instead of routing it through axios.

Example fix

// before — missing comma
await axios.get('data:image/png;base64' + b64);
// after
await axios.get('data:image/png;base64,' + b64);
Defensive patterns

Strategy: validation

Validate before calling

const DATA_URI = /^data:([^;,]*)?(;[^,]*)?,/i;
if (!DATA_URI.test(uri)) {
  throw new Error('not a well-formed data: URI');
}

Type guard

function isDataURI(value) {
  return typeof value === 'string' && /^data:[^,]*,/i.test(value);
}

Try / catch

try {
  const res = await axios.get(dataUri);
} catch (err) {
  if (axios.isAxiosError(err) && err.code === 'ERR_INVALID_URL') {
    // the data: URI was malformed — reject the input at its source
  } else throw err;
}

Prevention

When it happens

Trigger: Calling axios with a URL starting with `data:` whose body fails the DATA_URL_PATTERN regex — e.g. `axios.get('data:base64AAAA')` (no comma), a mediatype without a slash plus malformed parameters, or a truncated data URI produced by string slicing.

Common situations: Programmatically constructing data URIs and forgetting the comma or the `;base64` marker; passing a truncated data URI (copied from devtools or cut by a logging/length limit); template bugs that concatenate `data:` with raw base64 directly.

Related errors


AI-assisted analysis of axios/axios@c3f553c740 (2026-07-31). Data as JSON: /data/errors/cbd1cfef9ef410a1.json. Report an issue: GitHub.