ゲストスペース内アプリのレコードを、スペース内アプリに転記

フォローする

(著者:サイボウズ 江﨑 全英)

はじめに

こんにちは!新人の江﨑です。

皆さん、ゲストスペース使っていますか?外部の方とやり取りするのに便利ですよね。
ただ運用していると、ときにはゲストスペースのアプリの内容をスペース内アプリに転記したいことがあると思います。

そこで、今回は新人研修で開発した「ゲストスペース内アプリのレコードを、スペース内アプリに転記する」カスタマイズをサンプルとしてご紹介します。
また、 このサンプルを作成する際に詰まった kintone.api.url 関数の勘所も分かりやすく解説します。 

やったこと

  1. ゲストスペース内アプリのレコード詳細画面に「追加ボタン」を設置
  2. 「追加ボタン」を押すと、ゲストスペース内アプリのレコードが、スペース内アプリのレコードに転記
    ※ゲストスペースにはアクション機能がないため、レコードを転記できません

__1.png

事前準備

アプリの準備(ゲストスペース)

フィールド名 フィールドタイプ フィールドコード
転記元 文字列(1行) from_field

アプリの準備(スペース)

フィールド名 フィールドタイプ フィールドコード
転記先 文字列(1行) to_field


JS/CSS設定

「アプリの設定 > JavaScript / CSSでカスタマイズ」の「PC用のJavaScriptファイル」にサンプルプログラムを設定します。

以下のサンプルプログラムをエディターにコピーして、ファイル名を「sample.js」、文字コードを「UTF-8」で保存、アップロードします。  
※ファイル名は任意ですが、ファイルの拡張子は「js」にしてください。 

 

ボタンの見た目を新デザインに揃える場合はこちらの「51-modern-default.css」を「PC用のCSSファイル」にアップロードします。

設定した画面

「JavaScript / CSSによるカスタマイズ」画面でそれぞれ設定した例を紹介します。
__3.png

注意事項

  • サンプルプログラムは、その動作を保証するものではありません。 
  • サンプルプログラムの技術的なサポート等は行っていません。  

動作確認

ゲストスペースアプリにサンプルデータを登録、ボタン「追加する」をクリックして結果を確認してください。
レコードが転記されたでしょうか?転記されない場合はアプリIDやフィールドコードをご確認ください。

ワンポイント

APIのURIを正しく指定することが大切です。
URIの指定方法についてこちらの記事[kintone.apiにゲストスペースでも使える正しいパスを指定する]が参考になります。  

ただ、今回のように異なる種類のスペースをまたがるカスタマイズの場合には注意が必要です。  
new__.png

ゲストスペースのアプリからスペースのアプリを操作する場合は、スペース用URIを指定します。 
このように「操作元のスペース」ではなく、「操作先のスペース」に沿ったAPIを指定する必要があります。

APIのパスからURIを取得するkintone.api.url関数の挙動を以下の図に示します。
__2.png

ゲストスペース内アプリで関数の2つ目の引数にtrueを指定するとゲストスペース用のURIが取得できますが、これはゲストスペース内アプリの場合のみです。
挙動が分かりにくいと思うので、ケースごとに適切なAPIのURI指定方法を以下にまとめました。  

操作元 操作先 URIの取得方法
スペース スペース kintone.api.url('/k/v1/record', true)
スペース ゲストスペース この関数は使用できない。 URIを直接指定する必要がある。
ゲストスペース スペース kintone.api.url('/k/v1/record', false)
ゲストスペース ゲストスペース kintone.api.url('/k/v1/record', true)

スペースにおいてkintone.api.url関数は引数を変更してもスペース用APIのURIしか取得できません。  
そのため、スペースからゲストスペースのときは関数を使うことができず、URIを直接指定する必要があります。

異なる種類のスペースをまたぐときのAPIの指定方法は理解していただけたでしょうか?  
難しいところもありますが、理解できると開発の幅が広がりますよ!

(参考)使用したAPI

  1. レコードの登録
  2. レコード詳細画面が表示された時のイベント
  3. eventオブジェクトによるレコードの値の取得
  4. kintone REST APIリクエストを送信する
  5. URL を取得する

記事に関するフィードバック

直接的に記事と関連がないご質問はcybozu developer コミュニティをご活用ください。

ログインしてコメントを残してください。
Powered by Zendesk