chatwoot/chatwoot · error · Error

WhatsApp App ID is required

Error message

WhatsApp App ID is required

What it means

Thrown by the WhatsApp 'Reauthorize' screen in the Chatwoot dashboard when handleLoginAndReauthorize() runs and window.chatwootConfig.whatsappAppId is falsy. The App ID is injected server-side into the vueapp layout from the installation config (GlobalConfigService loading WHATSAPP_APP_ID), and the Facebook embedded-signup flow cannot launch without it. Because the throw is not caught in the click handler, it surfaces as an uncaught promise rejection and the button silently does nothing.

Source

Thrown at app/javascript/dashboard/routes/dashboard/settings/inbox/channels/whatsapp/Reauthorize.vue:113

    isRequestingAuthorization.value = false;
    useAlert(
      data.error_message ||
        t('INBOX_MGMT.ADD.WHATSAPP.EMBEDDED_SIGNUP.SIGNUP_ERROR')
    );
  }
};

const startEmbeddedSignup = authCode => {
  const messageHandler = createMessageHandler(data =>
    handleEmbeddedSignupEvents(data, authCode)
  );
  window.addEventListener('message', messageHandler);
};

const handleLoginAndReauthorize = async () => {
  // Validate required configuration
  if (!whatsappAppId.value) {
    throw new Error('WhatsApp App ID is required');
  }
  if (!whatsappConfigurationId.value) {
    throw new Error('WhatsApp Configuration ID is required');
  }

  try {
    const authCode = await initWhatsAppEmbeddedSignup(
      whatsappConfigurationId.value
    );

    // Check if this is a reauthorization scenario where we already have the business data
    const existingConfig = props.inbox.provider_config;
    if (
      existingConfig &&
      existingConfig.business_account_id &&
      existingConfig.phone_number_id
    ) {
      await reauthorizeWhatsApp({

View on GitHub (pinned to ed230f9bc0)

Solutions

  1. Set WHATSAPP_APP_ID (and WHATSAPP_CONFIGURATION_ID, WHATSAPP_APP_SECRET) in installation config via Super Admin > App Configs > WhatsApp embedded signup, then hard-reload the dashboard so window.chatwootConfig is re-rendered
  2. If self-hosting via env vars, set them and restart/redeploy so GlobalConfigService picks them up
  3. Verify window.chatwootConfig.whatsappAppId in the browser console after reload to confirm the fix

Example fix

# before (installation config missing)
# WHATSAPP_APP_ID not set -> clicking Reauthorize throws

# after
# Super Admin > App Configs > whatsapp_embedded
WHATSAPP_APP_ID: '1234567890'
WHATSAPP_CONFIGURATION_ID: 'abc-def'
# then hard reload the dashboard page
Defensive patterns

Strategy: validation

Validate before calling

const ready = Boolean(window.chatwootConfig?.whatsappAppId);
// in component:
if (!window.chatwootConfig?.whatsappAppId) {
  useAlert(t('INBOX.REAUTHORIZE.WHATSAPP_APP_ID_MISSING'));
  return;
}
handleLoginAndReauthorize();

Type guard

function hasWhatsappAppId(cfg = window.chatwootConfig) {
  return Boolean(cfg?.whatsappAppId) && cfg.whatsappAppId !== 'none';
}

Prevention

When it happens

Trigger: Clicking 'Reauthorize' or 'Complete registration' on a WhatsApp inbox while the installation has no WHATSAPP_APP_ID set (or it is the literal string 'none'/blank). The value comes from Super Admin > App Configs (WHATSAPP_APP_ID) rendered into window.chatwootConfig by vueapp.html.erb.

Common situations: Self-hosted install where only the cloud API provider was configured but not the embedded-signup env vars; the dashboard page was loaded before the admin saved the config and the cached window.chatwootConfig is stale; using a test/staging install cloned without the WhatsApp configuration secrets.

Related errors


AI-assisted analysis of chatwoot/chatwoot@ed230f9bc0 (2026-08-21). Data as JSON: /api/errors/67a4afd8f0d6d06f. Report an issue: GitHub.