UMD

Complete guide for using UMD version Bitrix24 JS SDK in you applications.

Import

Via CDN

You can include the library directly via CDN. Add the following <script> tag to your HTML file:

<script src="https://unpkg.com/@bitrix24/b24jssdk@latest/dist/umd/index.min.js"></script>

Local Import

Download the UMD version of the library from unpkg.com and add it to your project.

Then include it in your HTML file:

<script src="/path/to/umd/index.min.js"></script>

Example

After including, the library will be available through the global variable B24Js.

Here's a simple example demonstrating how to get a list of companies.

The example below assumes that the code is used within applications that open in frames in the Bitrix24 user interface:

example.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Bitrix24 JS SDK Demo</title>
</head>
<body>
<h1>Company Loader Example</h1>
<p>Check developer console for results</p>

<script src="https://unpkg.com/@bitrix24/b24jssdk@latest/dist/umd/index.min.js"></script>
<script>
  // Create logger
  const logger = B24Js.LoggerFactory.createForBrowser('B24/jsSdk::umd', true);

  /**
   * Load company list
   */
  async function loadCompanies(b24) {
    try {
      logger.info('Loading companies...');

      const response = await b24.callMethod(
        'crm.item.list',
        {
          entityTypeId: B24Js.EnumCrmEntityTypeId.company,
          order: { id: 'desc' },
          select: ['id', 'title', 'createdTime']
        }
      );

      const data = response.getData().result;

      const companies = (data?.items || []).map(function(item) {
        return {
          id: Number(item.id),
          title: item.title,
          createdTime: B24Js.Text.toDateTime(item.createdTime) // @memo this is luxon/DateTime
        };
      });

      logger.info('Companies loaded successfully', { companies });
      return companies;
    } catch (error) {
      logger.error('Request failed', { error });
      throw error;
    }
  }

  /**
   * Main application function
   */
  async function main() {
    try {
      // Initialize B24Frame instance
      let b24 = await B24Js.initializeB24Frame();

      // Load companies
      const companies = await loadCompanies(b24);

      // Further data processing...
      logger.info('Loaded ' + companies.length + ' companies');
    } catch (error) {
      logger.error('Failed to load companies', { error })
    }
  }

  /// Start application after DOM load
  document.addEventListener('DOMContentLoaded', function() {
    main();
  });
</script>
</body>
</html>

Documentation

B24Frame

To work with the application built into the Bitrix24 interface

NodeJs

Complete guide for installing and using Bitrix24 JS SDK in NodeJs applications.

MCP Server

Use Bitrix24 JS SDK in your AI assistants with Model Context Protocol support.