continuedev/continue · warning

Anthropic: skipping image with invalid data URL format

Error message

Anthropic: skipping image with invalid data URL format

What it means

convertMessageContentToBlocks converts OpenAI-style multimodal messages to Anthropic blocks. For an image_url part, it attempts to parse the data URL; when parsing fails (not a valid data:...;base64,<data> URL), the image is skipped from the request with this warning and the rest of the message is sent without it.

Source

Thrown at packages/openai-adapters/src/apis/Anthropic.ts:218

        (p) =>
          p.type === "text" || p.type === "image_url" || p.type === "refusal",
      );
      for (const part of supportedParts) {
        if (part.type === "image_url") {
          const dataUrl = part.image_url.url;
          if (dataUrl?.startsWith("data:")) {
            const base64Data = extractBase64FromDataUrl(dataUrl);
            if (base64Data) {
              blocks.push({
                type: "image",
                source: {
                  type: "base64",
                  media_type: getAnthropicMediaTypeFromDataUrl(dataUrl),
                  data: base64Data,
                },
              });
            } else {
              console.warn(
                "Anthropic: skipping image with invalid data URL format",
                dataUrl,
              );
            }
          }
        } else {
          const text = part.type === "text" ? part.text : part.refusal;
          if (text) {
            blocks.push({
              type: "text",
              text,
            });
          }
        }
      }
    }
    return blocks;
  }

View on GitHub (pinned to 5522c6f44c)

Solutions

1. Convert remote images to data URLs first: fetch the bytes and build `data:<mime>;base64,<b64>`
2. Validate the data URL shape before sending (regex or URL parsing: scheme data:, `;base64,` marker present)
3. Ensure the media type is one Anthropic supports (image/jpeg, image/png, image/gif, image/webp)
4. Check that base64 data was not URL-encoded or truncated

Example fix

// before
{ type: "image_url", image_url: { url: "https://example.com/cat.png" } }

// after
const b64 = fs.readFileSync("cat.png").toString("base64");
{ type: "image_url", image_url: { url: `data:image/png;base64,${b64}` } }

const ok = /^data:[\w./+-]+;base64,[A-Za-z0-9+/=]+$/.test(url);

const isDataUrl = (u: string): u is `data:${string};base64,${string}` =>
  /^data:[\w./+-]+;base64,[A-Za-z0-9+/=]+$/.test(u);

When it happens

Trigger: Sending a ChatMessage whose content includes an image_url with an http(s) URL instead of a data URL, a malformed base64 payload, or a data URL missing the base64 marker or media type.

Common situations: Passing remote image URLs (Anthropic's OpenAI-compat path here requires data URLs), hand-building data URLs with typos, or double-encoding base64.

Related errors

• Bedrock: failed to process image part - invalid URL
• Bedrock: failed to process image part
• Bedrock: skipping unsupported image part format: ${format}
• Error getting prompt: MCP Connection ${serverName} not found
• Failed to fetch Anthropic models: ${response.status}

AI-assisted analysis of continuedev/continue@5522c6f44c (2026-08-27). Data as JSON: /api/errors/f70c24d770c9007a. Report an issue: GitHub.