Intermediate Lesson 3: Integration Patterns

Learning Objectives

By the end of this lesson, you will be able to:

Implement different integration patterns for Manus AI in various systems
Design effective interfaces between Manus AI and other applications
Select appropriate integration approaches based on specific requirements
Troubleshoot common integration challenges

Integration Architecture Patterns

Direct Integration

Direct integration involves embedding Manus AI capabilities directly within an application:

API-Based Integration: Using Manus AI's APIs to access functionality from within applications
SDK Implementation: Incorporating Manus AI software development kits into application code
Embedded Components: Including Manus AI UI components within application interfaces

Direct Integration Example:

// Example of API-based integration in JavaScript
async function generateContentWithManus(prompt) {
  try {
    const response = await fetch('https://api.manus.ai/generate', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
        'Authorization': 'Bearer ' + API_KEY
      },
      body: JSON.stringify({
        prompt: prompt,
        max_tokens: 1000,
        temperature: 0.7
      })
    });
    
    const data = await response.json();
    return data.content;
  } catch (error) {
    console.error('Error calling Manus AI:', error);
    throw error;
  }
}

Middleware Integration

Middleware integration uses an intermediate layer to connect Manus AI with other systems:

Integration Platform: Using specialized middleware to manage connections between systems
Message Queues: Implementing asynchronous communication through message brokers
API Gateway: Centralizing API management for multiple systems including Manus AI

Figure 1: OpenManus Integration Ecosystem

Middleware Integration Example:

# Example of message queue integration with RabbitMQ
import pika
import json

# Connect to RabbitMQ
connection = pika.BlockingConnection(pika.ConnectionParameters('localhost'))
channel = connection.channel()

# Declare queues
channel.queue_declare(queue='manus_requests')
channel.queue_declare(queue='manus_responses')

# Function to send a request to Manus AI
def send_manus_request(request_data):
    channel.basic_publish(
        exchange='',
        routing_key='manus_requests',
        body=json.dumps(request_data)
    )
    print(f"Sent request: {request_data}")

# Function to process responses from Manus AI
def process_manus_response(ch, method, properties, body):
    response_data = json.loads(body)
    print(f"Received response: {response_data}")
    # Process the response...

# Set up consumer for responses
channel.basic_consume(
    queue='manus_responses',
    on_message_callback=process_manus_response,
    auto_ack=True
)

# Example usage
send_manus_request({
    'task': 'content_generation',
    'prompt': 'Write a product description for a new smartphone',
    'parameters': {
        'tone': 'professional',
        'length': 'medium'
    }
})

Service-Oriented Integration

Service-oriented integration treats Manus AI as a standalone service within a larger architecture:

Microservices Architecture: Implementing Manus AI as one of many microservices
Service Mesh: Managing service-to-service communication with specialized infrastructure
Event-Driven Architecture: Using events to trigger Manus AI processing

Service-Oriented Integration Example:

# Example of Manus AI as a microservice with Flask
from flask import Flask, request, jsonify
import manus_client

app = Flask(__name__)

@app.route('/api/analyze', methods=['POST'])
def analyze_data():
    data = request.json
    
    # Validate input
    if 'text' not in data:
        return jsonify({'error': 'Missing required field: text'}), 400
    
    # Process with Manus AI
    try:
        result = manus_client.analyze_text(
            text=data['text'],
            analysis_type=data.get('type', 'sentiment'),
            options=data.get('options', {})
        )
        return jsonify(result)
    except Exception as e:
        return jsonify({'error': str(e)}), 500

@app.route('/api/generate', methods=['POST'])
def generate_content():
    data = request.json
    
    # Validate input
    if 'prompt' not in data:
        return jsonify({'error': 'Missing required field: prompt'}), 400
    
    # Generate with Manus AI
    try:
        result = manus_client.generate_content(
            prompt=data['prompt'],
            parameters=data.get('parameters', {})
        )
        return jsonify(result)
    except Exception as e:
        return jsonify({'error': str(e)}), 500

if __name__ == '__main__':
    app.run(host='0.0.0.0', port=5000)

Integration Interfaces

API-Based Interfaces

API-based interfaces provide programmatic access to Manus AI capabilities:

REST APIs: HTTP-based interfaces for synchronous communication
GraphQL: Query language for more flexible and efficient data retrieval
gRPC: High-performance RPC framework for efficient communication

REST API Interface Example:

// Example REST API request to Manus AI
curl -X POST https://api.manus.ai/v1/analyze \
  -H "Content-Type: application/json" \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -d '{
    "text": "The new product launch exceeded our expectations with record-breaking sales in the first week.",
    "analysis_type": "sentiment",
    "include_entities": true,
    "language": "en"
  }'

GraphQL Interface Example:

// Example GraphQL query to Manus AI
query {
  analyzeText(
    text: "The new product launch exceeded our expectations with record-breaking sales in the first week.",
    options: {
      analysisType: SENTIMENT,
      includeEntities: true,
      language: "en"
    }
  ) {
    sentiment {
      score
      magnitude
      label
    }
    entities {
      name
      type
      salience
      sentiment {
        score
        magnitude
      }
    }
    language
    processedAt
  }
}

Event-Driven Interfaces

Event-driven interfaces enable asynchronous communication with Manus AI:

Webhooks: HTTP callbacks triggered by specific events
Message Queues: Asynchronous message passing between systems
Pub/Sub: Publisher-subscriber pattern for event distribution

Webhook Interface Example:

// Example webhook configuration for Manus AI
{
  "webhook_url": "https://your-app.com/api/manus-callback",
  "events": ["content_generated", "analysis_completed", "error_occurred"],
  "secret_token": "your_webhook_secret",
  "retry_policy": {
    "max_retries": 3,
    "retry_interval": 60
  }
}

Pub/Sub Interface Example:

# Example using Google Cloud Pub/Sub with Manus AI
from google.cloud import pubsub_v1
import json

# Initialize clients
publisher = pubsub_v1.PublisherClient()
subscriber = pubsub_v1.SubscriberClient()

# Topic and subscription paths
topic_path = publisher.topic_path('your-project-id', 'manus-requests')
subscription_path = subscriber.subscription_path('your-project-id', 'manus-responses')

# Publish a message to Manus AI
def send_request_to_manus(request_data):
    data = json.dumps(request_data).encode('utf-8')
    future = publisher.publish(topic_path, data)
    print(f"Published message ID: {future.result()}")

# Process responses from Manus AI
def process_manus_response(message):
    print(f"Received message: {message.data}")
    response_data = json.loads(message.data)
    # Process the response...
    message.ack()

# Set up subscription
streaming_pull_future = subscriber.subscribe(
    subscription_path, callback=process_manus_response
)

# Example usage
send_request_to_manus({
    'task': 'text_analysis',
    'text': 'The customer feedback indicates high satisfaction with our new service.',
    'analysis_type': 'sentiment'
})

UI-Based Interfaces

UI-based interfaces provide visual ways to interact with Manus AI:

Embedded Components: Pre-built UI elements that can be integrated into applications
iFrames: Embedding Manus AI interfaces within web applications
Custom UI: Building specialized interfaces on top of Manus AI APIs

Embedded Component Example:

<!-- Example of embedding a Manus AI component in HTML -->
<div id="manus-assistant-container"></div>

<script src="https://cdn.manus.ai/components/v1/assistant.js"></script>
<script>
  ManusAI.initialize({
    apiKey: 'YOUR_API_KEY',
    theme: 'light',
    defaultLanguage: 'en'
  });
  
  ManusAI.createAssistant({
    containerId: 'manus-assistant-container',
    capabilities: ['text_generation', 'document_analysis', 'image_recognition'],
    initialPrompt: 'How can I help you today?',
    height: '500px',
    width: '100%'
  });
</script>

Integration Patterns for Specific Use Cases

Content Management Systems

Integrating Manus AI with content management systems (CMS):

Content Generation: Automated creation of articles, product descriptions, and other content
Content Enhancement: Improving existing content with suggestions and optimizations
Metadata Generation: Automatically creating tags, categories, and SEO metadata
Content Moderation: Reviewing and filtering user-generated content

WordPress Plugin Integration Example:

// Example WordPress plugin for Manus AI integration
add_action('admin_post_generate_content', 'manus_generate_content');

function manus_generate_content() {
    // Verify nonce and permissions
    check_admin_referer('manus_content_generation');
    if (!current_user_can('edit_posts')) {
        wp_die('Unauthorized access');
    }
    
    // Get parameters from request
    $topic = sanitize_text_field($_POST['topic']);
    $length = sanitize_text_field($_POST['length']);
    $tone = sanitize_text_field($_POST['tone']);
    
    // Call Manus AI API
    $response = wp_remote_post('https://api.manus.ai/generate', [
        'headers' => [
            'Content-Type' => 'application/json',
            'Authorization' => 'Bearer ' . get_option('manus_api_key')
        ],
        'body' => json_encode([
            'prompt' => "Write a {$length} article about {$topic} in a {$tone} tone.",
            'parameters' => [
                'max_tokens' => ($length === 'short') ? 500 : (($length === 'medium') ? 1000 : 2000),
                'temperature' => ($tone === 'creative') ? 0.8 : 0.4
            ]
        ])
    ]);
    
    // Process response
    if (is_wp_error($response)) {
        wp_redirect(admin_url('admin.php?page=manus-ai&error=api_error'));
        exit;
    }
    
    $body = json_decode(wp_remote_retrieve_body($response), true);
    
    // Create new draft post
    $post_id = wp_insert_post([
        'post_title' => $topic,
        'post_content' => $body['content'],
        'post_status' => 'draft',
        'post_author' => get_current_user_id()
    ]);
    
    wp_redirect(admin_url('post.php?post=' . $post_id . '&action=edit'));
    exit;
}

Business Intelligence Systems

Integrating Manus AI with business intelligence (BI) systems:

Automated Analysis: Generating insights from data without manual intervention
Natural Language Querying: Allowing users to ask questions about data in plain language
Report Generation: Creating narrative reports from data visualizations
Anomaly Detection: Identifying unusual patterns and potential issues in data

Figure 2: Contextual Understanding in BI Integration

Development Environments

Integrating Manus AI with development environments:

Code Generation: Creating code based on requirements or comments
Code Completion: Suggesting code completions as developers type
Documentation Generation: Creating documentation from code
Code Review: Analyzing code for issues and suggesting improvements

VS Code Extension Integration Example:

// Example VS Code extension for Manus AI integration
const vscode = require('vscode');
const axios = require('axios');

async function generateCode(prompt) {
    const config = vscode.workspace.getConfiguration('manusAI');
    const apiKey = config.get('apiKey');
    
    try {
        const response = await axios.post('https://api.manus.ai/code/generate', {
            prompt: prompt,
            language: vscode.window.activeTextEditor.document.languageId,
            context: vscode.window.activeTextEditor.document.getText()
        }, {
            headers: {
                'Content-Type': 'application/json',
                'Authorization': `Bearer ${apiKey}`
            }
        });
        
        return response.data.code;
    } catch (error) {
        vscode.window.showErrorMessage(`Manus AI Error: ${error.message}`);
        return null;
    }
}

function activate(context) {
    let disposable = vscode.commands.registerCommand('manusAI.generateCode', async function () {
        const editor = vscode.window.activeTextEditor;
        if (!editor) {
            vscode.window.showInformationMessage('No editor is active');
            return;
        }
        
        const selection = editor.selection;
        const prompt = editor.document.getText(selection);
        
        if (!prompt) {
            vscode.window.showInformationMessage('Please select text to use as a prompt');
            return;
        }
        
        vscode.window.withProgress({
            location: vscode.ProgressLocation.Notification,
            title: "Generating code with Manus AI...",
            cancellable: false
        }, async (progress) => {
            const generatedCode = await generateCode(prompt);
            
            if (generatedCode) {
                editor.edit(editBuilder => {
                    editBuilder.replace(selection, generatedCode);
                });
            }
        });
    });
    
    context.subscriptions.push(disposable);
}

Integration Challenges and Solutions

Authentication and Security

Ensuring secure integration with Manus AI:

API Key Management: Securely storing and rotating API keys
OAuth Integration: Implementing OAuth for user-based authentication
Rate Limiting: Managing API usage to prevent abuse
Data Encryption: Protecting sensitive data in transit and at rest

Error Handling and Resilience

Building robust integrations that handle failures gracefully:

Retry Mechanisms: Automatically retrying failed requests with backoff strategies
Circuit Breakers: Preventing cascading failures when services are unavailable
Fallback Mechanisms: Providing alternative functionality when Manus AI is unavailable
Monitoring and Alerting: Detecting and responding to integration issues

Resilient Integration Example:

// Example of resilient integration with retry logic
const axios = require('axios');
const { CircuitBreaker } = require('opossum');

// Configure circuit breaker
const breaker = new CircuitBreaker(callManusAPI, {
    timeout: 10000, // If function takes longer than 10 seconds, trigger failure
    resetTimeout: 30000, // After 30 seconds, try again
    errorThresholdPercentage: 50, // If 50% of requests fail, open circuit
    rollingCountTimeout: 60000 // Consider last 60 seconds of requests
});

// Set up listeners
breaker.on('open', () => console.log('Circuit breaker opened - Manus API may be down'));
breaker.on('close', () => console.log('Circuit breaker closed - Manus API is operational again'));
breaker.on('halfOpen', () => console.log('Circuit breaker half-open - testing if Manus API is back'));

// Function to call Manus API with retries
async function callManusAPI(endpoint, data, maxRetries = 3) {
    let retries = 0;
    
    while (true) {
        try {
            const response = await axios.post(`https://api.manus.ai/${endpoint}`, data, {
                headers: {
                    'Content-Type': 'application/json',
                    'Authorization': `Bearer ${process.env.MANUS_API_KEY}`
                },
                timeout: 5000 // 5 second timeout
            });
            
            return response.data;
        } catch (error) {
            retries++;
            
            // If we've reached max retries or it's a 4xx error (client error), don't retry
            if (retries > maxRetries || (error.response && error.response.status >= 400 && error.response.status < 500)) {
                throw error;
            }
            
            // Exponential backoff
            const delay = Math.pow(2, retries) * 1000;
            console.log(`Retry ${retries}/${maxRetries} after ${delay}ms`);
            await new Promise(resolve => setTimeout(resolve, delay));
        }
    }
}

// Example usage with circuit breaker
async function generateContent(prompt) {
    try {
        // Use the circuit breaker
        const result = await breaker.fire('generate', {
            prompt: prompt,
            max_tokens: 1000
        });
        
        return result.content;
    } catch (error) {
        console.error('Failed to generate content:', error);
        
        // Fallback mechanism
        return "We're unable to generate content at the moment. Please try again later.";
    }
}

Performance Optimization

Ensuring efficient integration with Manus AI:

Caching: Storing and reusing results for common requests
Batching: Combining multiple requests into a single API call
Asynchronous Processing: Using non-blocking calls for better responsiveness
Load Balancing: Distributing requests across multiple instances or regions

Practical Exercise: Integration Design

Design an integration between Manus AI and a system of your choice:

Select a target system (e.g., CMS, CRM, development environment)
Identify the specific capabilities of Manus AI you want to integrate
Choose an appropriate integration pattern and interface
Outline the key components and data flows of your integration
Address potential challenges and how you would solve them