Skip to main content

SDK Configuration

Complete reference for configuring the Rise SDK.

Basic Configuration​

import Rise from '@getrise-ai/web-sdk';

Rise.init({
    appKey: 'your-app-key'
});

Configuration Options​

RiseConfig Interface​

interface RiseConfig {
    appKey: string;           // Required: Your Rise AI API key
    apiEndpoint?: string;     // Optional: Custom API endpoint
    wsEndpoint?: string;      // Optional: WebSocket endpoint
    isDevelopment?: boolean;  // Optional: Enable development mode
    autoShowBubble?: boolean; // Optional: Auto-show chat bubble
    bubbleConfig?: BubbleConfig; // Optional: Bubble appearance
}

Required Options​

appKey (string)​

Your Rise application key. Get this from your Rise dashboard under Settings > API Keys.

Rise.init({
    appKey: 'rsk_live_abc123...'
});

Optional Options​

apiEndpoint (string)​

Custom API endpoint URL. Defaults to https://service.getrise.ai/.

Rise.init({
    appKey: 'your-app-key',
    apiEndpoint: 'https://your-custom-endpoint.com/'
});

wsEndpoint (string)​

WebSocket endpoint for real-time features. Defaults to wss://chat-socket.getrise.ai.

Rise.init({
    appKey: 'your-app-key',
    wsEndpoint: 'wss://your-websocket-endpoint.com'
});

isDevelopment (boolean)​

Enable development mode for additional logging and debug features. Defaults to false.

Rise.init({
    appKey: 'your-app-key',
    isDevelopment: process.env.NODE_ENV === 'development'
});

Development mode features:

  • Verbose console logging
  • Debug overlays
  • Event stream visibility
  • No data sampling

autoShowBubble (boolean)​

Automatically show the AI chat bubble on initialization. Defaults to false.

Rise.init({
    appKey: 'your-app-key',
    autoShowBubble: true
});

bubbleConfig (BubbleConfig)​

Customize the appearance of the AI chat bubble.

interface BubbleConfig {
    position?: 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
    offset?: { x: number; y: number };
    primaryColor?: string;
    size?: 'small' | 'medium' | 'large';
}

Example:

Rise.init({
    appKey: 'your-app-key',
    bubbleConfig: {
        position: 'bottom-right',
        offset: { x: 20, y: 20 },
        primaryColor: '#000000',
        size: 'medium'
    }
});

Environment-Specific Configuration​

Development​

Rise.init({
    appKey: process.env.RISE_DEV_KEY,
    isDevelopment: true,
    apiEndpoint: 'https://dev.getrise.ai/'
});

Production​

Rise.init({
    appKey: process.env.RISE_PROD_KEY,
    isDevelopment: false
});

Framework-Specific Setup​

React​

import { useEffect } from 'react';
import Rise from '@getrise-ai/web-sdk';

function App() {
    useEffect(() => {
        Rise.init({
            appKey: process.env.REACT_APP_RISE_KEY
        });
    }, []);

    return <div>Your App</div>;
}

Vue 3​

<script setup>
import { onMounted } from 'vue';
import Rise from '@getrise-ai/web-sdk';

onMounted(() => {
    Rise.init({
        appKey: import.meta.env.VITE_RISE_KEY
    });
});
</script>

Angular​

import { Component, OnInit } from '@angular/core';
import Rise from '@getrise-ai/web-sdk';

@Component({
    selector: 'app-root',
    template: '<div>Your App</div>'
})
export class AppComponent implements OnInit {
    ngOnInit() {
        Rise.init({
            appKey: environment.riseKey
        });
    }
}

Next Steps​