Upload content to HuggingFace Spaces with support for base64 data and URL sources. Includes robust error handling and automatic content type detection for sharing operations within the Gradio ecosystem.
Uploads content to HuggingFace Spaces for sharing. Supports both base64-encoded data and URL sources with automatic content type detection and error handling.
/**
* Uploads content to HuggingFace Spaces for sharing
* @param data - Content to upload: string (base64/URL) or object with url/path properties
* @param type - Data type: "base64" for base64-encoded data, "url" for URL sources
* @returns Promise resolving to the upload result URL
* @throws ShareError if not on Spaces or upload fails
*/
function uploadToHuggingFace(
data: string | { url?: string; path?: string },
type: "base64" | "url"
): Promise<string>;Usage Examples:
import { uploadToHuggingFace, ShareError } from "@gradio/utils";
// Upload base64 image
try {
const base64Image = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA...";
const result = await uploadToHuggingFace(base64Image, "base64");
console.log("Upload successful:", result);
} catch (error) {
if (error instanceof ShareError) {
console.error("Upload failed:", error.message);
}
}
// Upload from URL
try {
const imageUrl = "https://example.com/image.jpg";
const result = await uploadToHuggingFace(imageUrl, "url");
console.log("Upload successful:", result);
} catch (error) {
console.error("Upload failed:", error.message);
}
// Upload with object syntax
try {
const result = await uploadToHuggingFace(
{ url: "https://example.com/document.pdf" },
"url"
);
console.log("Upload successful:", result);
} catch (error) {
console.error("Upload failed:", error.message);
}
// Upload base64 with path syntax
try {
const result = await uploadToHuggingFace(
{ path: "data:image/jpeg;base64,/9j/4AAQSkZJRgABA..." },
"base64"
);
console.log("Upload successful:", result);
} catch (error) {
console.error("Upload failed:", error.message);
}Custom error class specifically for sharing operation failures. Provides clear error identification and messaging for upload-related issues.
/**
* Custom error class for sharing operation failures
*/
class ShareError extends Error {
/**
* Creates a new ShareError
* @param message - Error message describing the failure
*/
constructor(message: string);
/** Error name is always "ShareError" */
name: "ShareError";
}Usage Example:
import { uploadToHuggingFace, ShareError } from "@gradio/utils";
async function safeUpload(data: string, type: "base64" | "url") {
try {
return await uploadToHuggingFace(data, type);
} catch (error) {
if (error instanceof ShareError) {
// Handle sharing-specific errors
if (error.message.includes("Must be on Spaces")) {
console.error("This feature only works on HuggingFace Spaces");
return null;
} else if (error.message.includes("Upload failed")) {
console.error("Upload failed, please try again");
return null;
}
}
// Re-throw non-sharing errors
throw error;
}
}For base64 uploads, the function accepts:
"data:image/png;base64,..."){ path: "data:image/png;base64,..." }The function automatically extracts content type and filename from the data URL.
For URL uploads, the function accepts:
"https://example.com/file.jpg"){ url: "https://example.com/file.jpg" }The function fetches the content, determines the content type from response headers, and handles filename extraction from the content-disposition header.
The uploadToHuggingFace function throws ShareError in the following cases:
window.__gradio_space__ is nullfetch, File, Blob)