Implementation:FlowiseAI Flowise AllowedDomains

Knowledge Sources	FlowiseAI Flowise
Domains	Chatbot Configuration, Security
Last Updated	2026-02-12 07:00 GMT

Overview

AllowedDomains is a React component that provides a form for configuring which website domains are permitted to embed and use a chatflow's chatbot widget.

Description

This component renders a configuration panel with a dynamic list of domain input fields and a custom error message field. Users can add new domain entries (via a plus button on the last row), remove individual entries (via a trash icon), and specify a custom error message displayed when an unauthorized domain attempts to access the chatbot. On save, the component updates the chatflow's chatbotConfig by calling chatflowsApi.updateChatflow with the allowed origins array and error message, then dispatches a SET_CHATFLOW Redux action to update the store. It initializes from the chatflow's existing chatbotConfig.allowedOrigins configuration.

Usage

Use this component within the chatflow settings panel when configuring domain-level access control for the embedded chatbot widget.

Code Reference

Source Location

• Repository: FlowiseAI Flowise
• File: packages/ui/src/ui-component/extended/AllowedDomains.jsx
• Lines: 1-208

Signature

const AllowedDomains = ({ dialogProps, onConfirm }) => { ... }

AllowedDomains.propTypes = {
    dialogProps: PropTypes.object,
    onConfirm: PropTypes.func
}

export default AllowedDomains

Import

import AllowedDomains from '@/ui-component/extended/AllowedDomains'

I/O Contract

Inputs

Name	Type	Required	Description
dialogProps	object	Yes	Configuration object containing chatflow (object with id and chatbotConfig JSON string)
onConfirm	func	No	Optional callback invoked after a successful save operation

Outputs

Name	Type	Description
React Element	JSX.Element	Renders a Stack with domain input fields, error message input, and a Save button

Usage Examples

Basic Usage

import AllowedDomains from '@/ui-component/extended/AllowedDomains'

const MyComponent = () => {
    const dialogProps = {
        chatflow: {
            id: 'chatflow-123',
            chatbotConfig: JSON.stringify({
                allowedOrigins: ['https://example.com', 'https://app.example.com'],
                allowedOriginsError: 'Access denied from this domain.'
            })
        }
    }

    return (
        <AllowedDomains
            dialogProps={dialogProps}
            onConfirm={() => console.log('Saved successfully')}
        />
    )
}

Related Pages

• Principle:FlowiseAI_Flowise_Chatflow_Security_Configuration