Kintone発信連携モジュール（無料） - 電信和楽屋

Kintone × RSuite ソフトフォン連携ガイド

新規アプリで安全にお試し、ワンクリック発信を体験できます

このガイドでは、新規Kintoneアプリを作成して「電話番号をクリックするだけ」でソフトフォンを起動する方法を丁寧に解説します。文書だけでなく、動画でも手順を確認できます。

1. 連携概要

①

Kintoneの顧客情報からワンクリックでソフトフォンを起動して発信できます。

MicroSIP
RECTEL2（着信ポップアップ対応）
その他 calltoリンク対応ソフトフォン

一覧・詳細・編集画面のすべてで通話ボタンが利用できます。

2. 新規アプリでお試し

②

新規アプリを作成し、以下のフィールドを追加します。

① 顧客名（1行テキスト）
② 電話番号（1行テキスト）
　フィールドコード：電話番号
③ メモ（複数行テキスト）
④ ボタン用スペース（スペース）
　要素ID：call_space

※ 既存アプリに追加すると既存データに影響する可能性があります。必ず新規アプリでお試しください。

3. JavaScript登録

③

下記コードをメモ帳に貼り付け、clickcall.jsとして保存します。

保存形式：すべてのファイル / UTF-8 / 拡張子「.js」

(function() {
  'use strict';

  function makeButton(text, bgColor) {
    const btn = document.createElement('button');
    btn.textContent = text;
    btn.style.marginLeft = '6px';
    btn.style.padding = '4px 10px';
    btn.style.background = bgColor || '#28a745';
    btn.style.color = '#fff';
    btn.style.border = 'none';
    btn.style.borderRadius = '6px';
    btn.style.cursor = 'pointer';
    btn.style.fontWeight = 'bold';
    btn.style.fontSize = '13px';
    btn.style.boxShadow = '1px 1px 3px rgba(0,0,0,0.3)';
    return btn;
  }

  function normalizePhoneNumber(raw) {
    if (!raw) return '';
    let phone = raw.replace(/[０-９]/g,
      s => String.fromCharCode(s.charCodeAt(0) - 0xFEE0));
    phone = phone.replace(/[\s‐－ー]/g, '');
    phone = phone.replace(/[^0-9+]/g, '');
    return phone;
  }

  function addCallButton(record) {
    const phone = normalizePhoneNumber(record['電話番号']?.value);
    const space = kintone.app.record.getSpaceElement('call_space');
    if (!space) return;
    space.innerHTML = '';
    const btn = makeButton('📞 通話', '#28a745');
    btn.addEventListener('click', () => {
      if (!phone) return alert('電話番号が未入力です');
      window.open('callto:' + phone);
    });
    space.appendChild(btn);
  }

  kintone.events.on(
    ['app.record.detail.show','app.record.edit.show'],
    event => { addCallButton(event.record); return event; }
  );

  kintone.events.on('app.record.index.show', event => {
    const fieldEls = kintone.app.getFieldElements('電話番号');
    if (!fieldEls) return event;
    event.records.forEach((record, i) => {
      const el = fieldEls[i];
      if (!el || el.querySelector('.call-btn')) return;
      const phone = normalizePhoneNumber(record['電話番号']?.value);
      const btn = makeButton('📞 通話', '#28a745');
      btn.className = 'call-btn';
      btn.addEventListener('click', e => {
        e.stopPropagation();
        if (!phone) return alert('電話番号が未入力です');
        window.open('callto:' + phone);
      });
      el.appendChild(btn);
    });
    return event;
  });

})();

Kintone アプリ設定 → 「JavaScript / CSS でカスタマイズ」 → 「PC用 JavaScript」 に、上記の clickcall.js をアップロードします。

4. 完了

新規アプリでのテストにより、既存データを汚さず安全に動作確認できます。 これで、ワンクリックでソフトフォン発信できる環境の完成です！