Upload Knowledge Base Images

POST /upload-image - Upload Knowledge Base Images

Upload images for use in knowledge base articles. The uploaded images are stored on CDN and can be referenced in article content.

Endpoint

POST /v1/knowledge-base/upload-image

Request Headers

Request Parameters

File Requirements

Response Format

Success Response (200 OK)

{
  "imageId": "123e4567-e89b-12d3-a456-426614174000",
  "imageUrl": "https://cdn-assets.productfruits.com/123e4567-e89b-12d3-a456-426614174000"
}

Examples

Example 1: Upload Image with cURL

curl -X POST "https://api.productfruits.com/v1/knowledgebase/upload-image" \
  -H "Authorization: Bearer YOUR_API_TOKEN" \
  -F "file=@/path/to/your/image.jpg"

Response:

{
  "imageId": "550e8400-e29b-41d4-a716-446655440000",
  "imageUrl": "https://cdn-assets.productfruits.com/550e8400-e29b-41d4-a716-446655440000"
}

Example 2: Error Handling Example

# Attempt to upload invalid file type
curl -X POST "https://api.productfruits.com/v1/knowledgebase/upload-image" \
  -H "Authorization: Bearer YOUR_API_TOKEN" \
  -F "file=@/path/to/document.pdf"

Response (400 Bad Request):

{
  "error": "Invalid file type"
}

Example 3: Upload and Use in Article Content

// Step 1: Upload the image
const uploadResponse = await fetch('{base}/v1/knowledgebase/upload-image', {
  method: 'POST',
  headers: { 'Authorization': 'Bearer YOUR_API_TOKEN' },
  body: formData
});

const { imageUrl } = await uploadResponse.json();

// Step 2: Use the image in article content
const articleContent = `
# Tutorial with Screenshots

Here's how to complete the task:

![Step 1 Screenshot](${imageUrl})

Follow these steps to complete the process...
`;

// Step 3: Import the article with the image reference
const importResponse = await fetch('{base}/v1/knowledgebase/import', {
  method: 'POST',
  headers: {
    'Authorization': 'Bearer YOUR_API_TOKEN',
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({
    articles: [{
      correlationId: 'tutorial-001',
      contents: [{
        lang: 'en',
        title: 'Tutorial with Screenshots',
        content: articleContent,
        format: 'markdown',
        publishStatus: 'published'
      }]
    }]
  })
});

Using Uploaded Images

In Markdown Content

# Article Title

Here's an embedded image:

![Alt text description](https://cdn-assets.productfruits.com/IMAGE_ID)

You can also use reference-style links:

[image]: https://cdn-assets.productfruits.com/IMAGE_ID "Image title"

![Alt text][image]

In HTML Content

<h1>Article Title</h1>

<p>Here's an embedded image:</p>

<img src="https://cdn-assets.productfruits.com/IMAGE_ID" 
     alt="Alt text description" 
     title="Image title" />

<p>You can also use responsive images:</p>

<img src="https://cdn-assets.productfruits.com/IMAGE_ID" 
     alt="Alt text description"
     style="max-width: 100%; height: auto;" />

Best Practices

• Optimize Images: Compress images before uploading to reduce file size and improve loading times
• Use Descriptive Alt Text: Always provide meaningful alt text when using images in content
• Store Image References: Save the imageId and imageUrl for future reference and content updates
• Validate Before Upload: Check file type and size on the client side before uploading
• Handle Errors Gracefully: Implement proper error handling for upload failures
• Use Appropriate Formats:
• PNG for images with transparency or sharp edges
• JPG for photographs and complex images
• WebP for modern browsers (best compression)
• GIF for simple animations
• Consider Mobile: Ensure images display well on mobile devices by using responsive sizing

Image Management

Image Lifecycle

• Upload: Image is stored on CDN with unique ID
• Reference: Use the returned URL in article content
• Usage: Image is served from CDN when articles are viewed
• Persistence: Images remain available as long as they're referenced

Image URLs

• All uploaded images are served from https://cdn-assets.productfruits.com/
• URLs are permanent and can be cached
• Images are served with appropriate caching headers for optimal performance

Security

• Only authenticated users can upload images
• File type validation prevents malicious uploads
• File size limits prevent abuse
• All uploads are scanned for security threats

Video Support

⚠️ Video uploads are not currently supported through the API.

Supported video embedding options:

• YouTube: Use YouTube video URLs or embed codes in your content
• Vimeo: Use Vimeo video URLs or embed codes in your content
• Loom: Use Loom video URLs or embed codes in your content

For direct video hosting, use external platforms and reference them in your article content.

Error Response Examples

400 Bad Request - No File Provided

{
  "error": "No file provided"
}

400 Bad Request - Invalid File Type

{
  "error": "Invalid file type"
}

400 Bad Request - File Too Large

{
  "error": "File too large. Maximum size is 10MB"
}

401 Unauthorized

{
  "error": "Authentication required or invalid API token"
}

500 Internal Server Error

{
  "error": "Internal server error occurred while uploading image"
}

Rate Limiting

Please see this article detailed information about API limits and optimization strategies.