スピーカーとしての腕前はまだまだこれから磨かねばならない私です。Caféに臨んで行きたいと思っています。kintoneを知らない方に、kintoneの良さを少しでも伝える。これもまたエバンジェリストのあり方の一つだと信じて。昨夏から試行錯誤してきたエバンジェリストとして行くべき道がようやく少し見えてきた気がします。Café某所のご案内は流して行きたいと思います。その場でまだ見ぬ皆様とお会いできることを楽しみにしています。既存の業務要件を入口に、納品を出口としたシステムでは拾いきれなかったニーズを持ったユーザー様は、あちこちにいらっしゃるはずですから。Tumblr年賀状の宛名書きをkintoneにお願いする。Calendarへの参加表明をしたはいいですが、ネタ選びで思惑が狂ってしまいました。API(eightではなくてSansanの方)とkintoneの連携。ところがSansan様よりAPIの技術情報をブログ等で出すことなかれ、と言われてしまいまして。え、あと私の担当日まで3日しかないのに、どうしよう・・飲み会も続くし、年賀状も書いてないのに。思いついたのがこちらです。はがきといえば差し込み印刷。Wordからkintoneを読み込めないか、という浅い思いつきで調べてみました。実践的な内容とはいえませんが、ごらん頂ければ幸いです。2010で構築しています。12/12に予定されていたkintoneアップデートは延期されてしまいました。アップデートの後も本記事にある技術は使えると思います。あ、それとQiitaから頂いたリマインドメールにはブログにアップしたurlを連携してもよいと書かれていたので、当方のブログにアップしました。不都合があればQiitaに上げなおします。Wordの差し込み印刷さて、まずはWordを立ち上げて下さい。メニューの差し込み文書から、宛先の選択を選びます。すると、新しいアドレス帳というダイアログが開き、情報が入れられます。ちなみに私、Wordの差し込み印刷はほとんど触ったことがありません。入れ終わって閉じてみると、mdbの保存ダイアログが出てきました。ほう、Wordの裏側はAccessだったんですね。これは思惑が狂いました。調べてみたのですが直接Wordを触って差し込み印刷の値を設定する方法がわかりませんでした。Accessとkintoneって近いようであまり連携例を見かけません。この機会に連携も試してみましょう。Accessを任意の場所に保存してみましょう。Accessの設定Accessが出来ました。Address.mdbというやつです。これを元にしてkintoneに一つアプリを作ってみましょうか。作成されたAddress.mdbにあるテーブルは一つだけ。Office_Address_Listというテーブルです。これをエクスポートして、csvファイルとして保存し、そのcsvファイルをkintoneに備わっているcsvからアプリを作る機能で作れば何とかなりそうです。テキストエクスポートウィザードで出してみます。あとは先頭行をフィールドとして使うにチェックを入れてください。kintoneのアプリストアでExcel/CSVからのアプリ作成で、先頭行に見出し行が設定されている必要があります。この場所にcsvを作ってみましょう。kintoneへいよいよkintoneの出番です。アプリストアから「Excel/CSVから作成」を選びましょう。Access.mdbから出力したcsvファイルは、以下の通りとなっています。これはWordのアドレス帳のテーブルです。各項目のフィールドタイプはホームページとメール以外は「文字列(一行)」で設定しましょう。無事、アプリが作成できました。あとはここに住所を入れて行けば、念願のクラウドでの住所録管理は目の前です。あ、それと、kintoneのフォームで各フィールドのフィールドコードの設定を以下の通りでお願いします。CountryいよいよAccessからkintoneへkintoneにアプリを作ったら、今度はAddress.mdbです。このAccessとkintoneが連携できればよいわけです。Editorを開いていただき、ツール(T)→参照設定をお願いします。Runtimeにチェック。それとmdbへのテーブル操作にADOを入れてみましょう。2.8が無難でしょうね。これもチェックをお願いします。つづきまして、以下の標準モジュールとクラスモジュールを入れてください。ファイルのインポートで可能です。それぞれのモジュールファイルは用意しました。ダウンロードしやすいようにzip化しておきました。解凍してお使い頂ければ。^_^JSONMod_CommonDeclarationMod_DataTrustMod_GetKintoneさて、インポート頂いたファイルですが、ほとんどはそのままで使えるようにしていますが、皆様の環境に応じて若干の変更が必要です。Mod_GetKintoneのファイルの19行目。このアスタリスクの2文字は、先にkintoneに作ったアプリのUrlにある数字を入れてください。Mod_DataTrustです。部分に、ご契約されているkintoneのドメイン名を当ててください。Mod_DataTrustです。ここは76、77、78、79行目に情報を入れて頂きます。76行目はベーシック認証の情報です。BAsic_IDの部分にIDを。Basic_PWの部分にパスワードをお願いします。77行目はご契約されているkintoneのドメイン名を****の部分に入力してください。78行目はBAsic_IDの部分にIDを。Basic_PWの部分にパスワードをお願いします。79行目はkintone内で使用するユーザーのIDとパスワードです。PWの部分にPWをお願いします。ここまででAccess.mdbとkintoneの連携は出来ました。AccessからMod_GetKintoneの中にあるgS_CmdDataRequeryClickを実行すれば、kintoneのデータを反映するのがわかります。Wordへさて、Wordに戻りましょう。Wordの文書は新たに作成して結構です。作成したら、差し込み文書を選びます。はがき印刷を選んでください。宛名面の作成を選びましょう。するとはがき宛名面印刷ウィザードが開きます。種類は、年賀/暑中見舞いを選びます。好みで縦書きでも横書きでも結構です。フォントも選びましょう。差出人の情報を選びます。差出人を印刷するにチェックを入れると差出人情報が印刷されます。既存の住所録ファイルにラジオにチェックして下さい。住所録ファイル名は、先ほどAccessのmdbを保存したパスを入力して下さい。これではがき宛名面印刷ウィザードは完了です。すると、年賀状のイメージと各項目のフィールドに、kintoneに入力した情報が出てきます。この時点で出ているのは、当初アドレス帳に入力して、Address.mdbに入った情報です。違う宛先を表示させるには、差し込み文書からメニューの右にある矢印をクリックすればそれぞれの情報にアクセスできます。それではこのWord文書を保存して閉じましょう。一度開き直すと、以下のようなメッセージが表示されます。これは毎回Address.mdbの情報を見に行き、SQL文を発行してAccess.mdbの情報を取得していることを意味します。ここまで出来ているのであれば、もう一段階進んでみましょうか。先程Accessにモジュールを組み込んで頂いた際に、「AccessからMod_GetKintoneの中にあるgS_CmdDataRequeryClickを実行すれば、kintoneからデータを取りに行ってくれます」と書きました。これをWordから行えるようにすれば、いちいちAccessを起動せずに済みますよね。そんなわけで、GetKintoneFromWordをご用意いたしました。こちらもzip化しています。解凍したらGetKintoneFromWord.basが現れます。Editorからファイルのインポートで取り込んで頂ければ。すると、Wordからkintoneの取り込みを行い、その結果をAccess.mdbに取り込むことが出来ます。ある前提で作成しています。組み込んだマクロを実行してみましょう。メニューの表示からマクロ→マクロの表示を選びます。一覧が出るので「アドレス帳最新化」を選んで実行を押してください。するとkintoneで変更した内容がwordにも反映されます。Tokyoに行ってまいりました。conferenceは3年半前に参加して以来となります。2012では「世界に通用する日本の企業クラウドを作る」という青野社長の基調講演から、各種セミナーにいたるまでじっくりと参加できました。その少し前に行われたcybozu.comのプレス発表会にも参加させて頂いた私は、海外製品が幅を利かせる現状にサイボウズさんが風穴を開けてくれることに期待し、心地良い期待感と昂揚感に胸躍らせたことを覚えています。以来、cybozu.comの成長は素晴らしいものがあります。日本発のソフトウェア企業として、有数の会社になっていると思います。2012の直後から参画したプロジェクトに忙殺され、まったくユーザー会にもカンファレンスにもお伺いできずじまい。忸怩たる思いをずっと抱えていました。Kintoneの正式リリース前からkintoneβ版で開発し、正式リリースとほぼ変わらぬ時期にお客様に販売管理システムを無事納品し、以来ずっと運用している自負を持つだけになおさら。現状をどうこう言っていても仕方ありません。現状をいかにして将来に役立てるかが重要です。今回のサイボウズカンファレンス2015ではセミナー2つのみの参加でした。その2つのセミナーこそが、今私が参画しているプロジェクトでの経験を将来に役立てるにあたり、ためになると思ったので参加しました。最初のNotesセミナーですが、私にとって現状を活かすには最適なセミナーでした。Designerを使ってのNotesDB作成があります。正直なところクラウド全盛の今にあって、クライアント/サーバー(クラサバ型)システムによるNotesグループウェアが通用するかは微妙です。NotesはNotesで今まで広く使われていただけに、慣れた人には使いやすいのでしょう。Designerを使い始めたのはこの1、2年ですが、拡張性や機能自体は悪くないと思います。Scriptのデバッグやエディタなどがイライラするほどユーザーに優しくないことを除けば、やれないことはあまりないといってもよいと思います。それにはスキルがいります。NotesはNotesでクラウド化を推進していると聞きますが、多くの現場では依然としてクラサバ型の構成が主流でしょう。特定のNotes技術者を育成せねばならぬところ、開発者向けの環境充実にあまり力を入れていないところからすると、衰退も致し方ないのかもしれません。Designerを触って思ったのが、テーブルいらずの発想が、クラウド製品に似通っていること。普通はテーブル設計から入り、Create文を作ってストアド・プロシージャ―などを流してDBを作り込みます。Notesはいきなりフォーム設計から入ります。フォーム設計でフィールドとして項目を埋め込んでいくことで、それがテーブルとなっていく。この構成は実は、kintoneやSalesForce.comといったクラウドの代表的なアプリにも見えます。ここらに、両者に共通する点を見つけることができました。セミナーでうかがったのですが、青野社長がサイボウズ社を創業するにあたり、Notesの管理者をされていたことがベースにあったとか。サイボウズさんでは、Notesマイグレーション事業を行うにあたり、ターゲットとなる製品をGaroonとkintoneで想定していらっしゃるようです。私はkintoneユーザーかつエバンジェリストの端くれでもあります。Designerの現役開発者であり、かつ、kintoneの開発者。ここに私には現状を将来に向けて活かせる突破口を見出したのです。私はkintoneには慣れていますが、Garoonはまだ触ったこともない状態。今回はGaroonに取り組むきっかけになるのでは、とも思いました。Notes上の文書に貼り付ける添付ファイルの位置、これもGaroon上でほぼ再現できるそうです。これは大きいセールスポイントです。ここ3年ほど、私の人生にとって、技術力の成長面では停滞していたといわれても仕方ありません。エバンジェリストにして頂いたり、法人化を成し遂げたり、診療所を開設したり、自治会で総務部長を完遂したりと個人的にはかなりの成長を遂げることができた3年ですが、最新技術の吸収ではかなり遅れを取っています。危機感も相当持っています。今回のセミナーは、そういった意味でも勉強になりましたし、今後の自分のスキルとして営業に加えていこうと考えています。続いてのセキュリティセミナー。実は今までもサイボウズさんのセキュリティに関するセミナーには参加させてもらっています。現役の運用本部長からのお話は、紙やディスプレイで読むのと違い、頭に入ります。クラウドに興味を持っていただくお客様の第一の要件は、業務を遂行することができるか、ということです。お客様自身、あまり口には出しませんが、クラウドのセキュリティへの不安はお持ちではないかと思うことがあります。それはまた、2016年1月からのマイナンバー導入を目前にした今、ますます注視されていることでしょう。私にとって、改めてサイボウズさんの施している万全のセキュリティに対する体制を伺わせて頂いたことは、良かったと思います。今参画しているプロジェクトでも、セキュリティ遵守に関する話は統括部門だけに当然耳に入ってきます。運用本部長の山本氏のセキュリティについての謙虚な姿勢も良かったです。100%安全ですというセキュリティに対する態度程危ないものはないと思っています。常に努力と改善しかないのだろうな、と思います。今回のセキュリティセミナーの受講で新たになった私の知識は、今後のクラウド提案に活かせると思っています。会場でも配布していましたが、セキュリティ&運用基盤というパンフレットは常に最新版を持ち歩いていたいと思いました。説明を求められた際には対応できるように。現場の作業の都合もあり、青野社長をはじめとした豪華ゲストの方々による基調講演は行かれず。夜の池上彰氏による特別講演も聞かれませんでした。わずかな時間であっても、昨年は参加すら出来なかったことに比べたら状況は回復の途中にあるといえます。私も、このまま回復基調を維持し、次なるキャリアステップに役立てたいと思います。Tumblr3.kintoneからのJavaScript呼び出しとJavaScript内でのAjaxの記載についてここでは、kintoneへのJavaScriptの適用方法その他の説明は割愛します。記述が大変参考になります。私も最初はここから勉強しました^^ただし、本稿でもまた、前書きを書かねばなりません。API呼び出しのタイミングについてです。冒頭でも挙げたように、本稿ではレコードの詳細画面でAmazon情報を呼び出すのが目的です。レコード詳細画面の編集時画面での実装については、本稿では触れていません。APIでは、レコード詳細画面のテキストボックスの値変更時にJavaScriptを呼び出すことができません。そのため、編集時画面でAmazonからの情報を表示させる意味がないと判断し、記載から外させて頂きました。API更新で実装されました。本稿ではまだ検証に至っておらず、掲載しておりません。Amazonからの呼び出し自体にも、全く問題がない訳ではありません。Unavailableのエラーが返ってくる場合があります。リクエストはほどほどに・・・ということなのでしょう。strictが両立できていません。時間をおいて再実行ということでご了承ください。最後にクロスドメイン制約についてです。*****.co.jpといった違ったドメインのサーバーにAjaxリクエストを発行します。そのような別ドメインへのリクエストは、セキュリティ上脆弱になりかねないため、環境によっては簡単に通信ができないようになっています。本稿ではphpからkintoneへ渡すデータ形式をXMLにしました。JSONPを使えばクロスドメイン制約についても解決できるようです。今回はXMLを選択しました。ご了承頂ければと思います。随所にそのあたりについてあと、jQueryの呼び出しも必要となりますので、kintoneのアプリ設定画面から、JavaScript登録を忘れずに。気を取り直して実装開始^^以下は、AmazonCallBookInfoDetail.jsの内容です。200行あるすべてのコードを開示しながら、適宜解説を加えていきたいと思います。クロスドメイン制約をかいくぐるための呪文の一つです。function(event){は詳細レコード呼び出し時に書く呪文です。実行しているブラウザの種別をここで取得しています。呼び出し先のURLがhttpsから始まっても、画像はhttpが返されることがあり、それを防ぐために一部ブラウザによって画像のアドレスを変更しています。表示したkintone詳細レコードのISBNフィールド(フィールド名はF_Isbn)の値を取得しています。ハイフンを除去しています。kintoneフォーム上で事前に作成しておいたスペースをここで取得しています。情報を書き込んでいきます。kintoneフォーム上で事前に作成しておいたスペースをここで取得しています。大きな画像を表示させます。本稿で実装する内容では、ユーザ入力データからのサニタイズ処理はあまりありません。唯一この場所で実施しています。なる場合があり、その場合のみ許可しています。12行目で取得した画像表示用イメージの横幅を指定しています。11行目で取得したAmazonデータ表示用スペースにユーザを飽きさせないために表示しております。先に紹介しましたが、codeとIsbnという2つのパラメーター以外に、nowというパラメーターも追加しています。実はnowパラメーターは以下の処理では使われていません。Explorer上でうまく値が戻ってこないという情報から、このような記載を設けています。jsonpでもjsonでもうまくいくことでしょう。Explorerで正常に戻ってこないという情報を基に追加しました。非同期処理をONにしています。ここをOFFまたは記載なしにすると、何らかのエラーがAjaxで発生した場合、ブラウザがフリーズしてしまいます。10000ミリ秒、つまり10秒間だけphpからの戻り値を待ちましょう。正常にデータが戻ってきた場合の処理を30行目以下に記載します。関数の引数dataが、成功した場合に受け取るデータが格納された変数です。商品情報に関するすべてのAmazonからの戻り値を変数として宣言してあります。ここまでやる必要はありません。82行目以下は、実際のXMLの内容を基に、DOMの森を探索することになります。以下ではXMLを実際に表示させてみます。この中で実際に表示させるのに必要なのは、32行目の<Item>タグ以下のデータとなります。53-101行目までは各種商品イメージの情報が記載されています。この中で53行目から67行目までのSmallImageとMediumImageとLargeImageは。その下の68行目から101行目までの間に同一の情報があります。この部分は取得を省略してもよいでしょう。102行目以下は主要な情報が並んでいます。これらはほぼ取得すべきところです。データの種類によってはタグ自体がないものもあります。以下の例でいうと、104行目の<Creator>タグは小説のように著者がある本には登場しません。著者がある本は<Author>タグが替わりをつとめます。112行から117行の<Languages>タグや135行目の<ReleaseDate>タグがないデータがあることも確認しています。一件、AmazonからのXMLデータで気を付けるべき点があります。それは書籍とkindle書籍の場合です。kindle書籍はISBN項目を持っていないのですが、Amazonの仕様でISBNに対してデータ検索結果にkindleデータも含まれます。XML上では、2つの<Item>タグが紐付いています。その場合は、JavaScript側で<Item>タグ内をループさせるのですが、<ISBN>タグの有無で判別しています。大体のXMLデータの構造がおわかり頂けましたでしょうか。先に紹介したAmazonのガイドですが、項目の位置はこちらでガイドされています。各項目がどのように商品データに関連付いているかはわかりません。上に挙げた項目以外にも存在することもあるかと思います。jQueryの文法に則り、XMLのデータが格納された変数dataに対し、<item>タグの要素を検索しています。その結果をループしたのが82行目の記述となります。条件文が真の場合、84行以下の処理を実行しています。82行目でループを開始した<item>タグの要素データを指します。<item>タグ内でさらに<ItemAttributes>タグを検索し、さらにその中で<ISBN>タグを検索しています。この構造については、3ページ前のXMLをご参照ください。ISBNの要素の有無によって判定を分けています。これは先にXMLの構造を説明する際にも書きましたが、kindle書籍データが含まれている場合の退避処理となります。<item>タグの要素データ内の<ASIN>タグや<DetailPageURL>タグの要素内データを取得しています。82行目で始めた<item>タグ内ループの中で、さらに<ItemLink>タグを検索し、さらに<Description>タグを検索し、それをループしています。Listに等しいかを尋ねています。87行目で条件に合致した場合、<Description>タグと同じレベルの隣のタグ<URL>タグの要素内のデータを取得しています。87、88行目と同様です。それぞれの<URL>タグの内容を取得しています。86行目で始めたループを閉じています。82行目で始めた<item>タグ内ループの中で、さらに<ImageSet>タグを検索し、それをループしています。100行目で始めた<ImageSet>タグ内ループの中で、それぞれの要素タグの内容を取得しています。100行目で始めたループを閉じています。ここまで来たら大分要領がつかめてきたのではないでしょうか。あともう少しで終わりです。お疲れのことでしょう。それぞれの要素内データを取得しています。121行目ですが、Attrという見慣れない記述があります。XMLの104行目に当ります。Role="監修"というRole属性の値を取得するために、Attrという命令を発行しています。いう文字列を組み立てているわけです。83行目の<ISBN>タグの有無を判定したif文の終わりです。82行目で始めたループを閉じています。aws_ASINの値が真かどうかを判定しています。undefined以外のデータの場合、150行目以下の処理を実行します。11行目で取得したスペースに対し、innerHTMLを使用して書き込むべき文字列を生成しています。今回の実装では、一つのスペース内に改行で区切ってAmazonからの情報を羅列する手法を採りました。冒頭に記載しましたが、編集時画面に実装し、Isbnの値の変更時に各フィールドに自動入力するほうが望ましいという考えもあります。169行目から173行目は取得したURL文字列を<a>タグの中に含めています。6行目でブラウザの種別を取得しました。取得したブラウザ文字列にfirefoxが含まれているかどうか、要は実行しているブラウザの種類を問うているのがこの行です。画像を読み込もうとするとエラーが出るため、このような処置を取っています。149行目で判定したaws_ASINの値が偽だった場合に、180~184行目の処理が動作します。Amazon側に渡したISBNコードが不正な値だった場合、XMLは違う種類のメッセージを返します。ほとんどの部分は一緒なのですが、<Items>タグの中の<Item>タグが<Errors>タグに置き換えられています。以下にエラー時のXMLを提示します。11行目で取得したスペースにエラー情報を含めます。上の図にあるとおりのエラー構造に基づいて、適宜整形して頂ければと思います。149行目で判定した条件式の終わりの部分です。29行目で判定したAmazonから正常な値が戻ってきたかどうかの判定式の終わりの括弧です。Ajax通信に何らかのエラーが生じた場合、処理はこちらのステートメント内で行われます。関数の引数として、XMLHttpRequest、textStatus、errorThrownといった値が返されますので、その値に応じてメッセージを整形されるとよいでしょう。errorThrownは場所の数だけ配列として戻ってきますので、193~195行では配列の要素数だけ処理を行っています。ここでは取得したエラー情報をアラートとしてポップアップ表示しています。Amazon情報を表示するスペースに表示するのもよいでしょう。187行目からのエラー時に実行される関数の終わり部分です。22行目からの$.ajaxの関数の終わりの括弧です。5行目からのkintone詳細レコード表示時に実行される関数を終えるにあたり、戻り値を返しています。5行目からのkintone詳細レコード表示時に実行される関数の終わりの括弧です。本JavaScript全体の無名関数の終わりの括弧です。これでJavaScriptの実装は終了です。お互い・・・さて、JavaScriptを完成させ、あとはこれをkintoneのアプリ管理画面からアップすれば完成!のはずですが・・・・・実は先ほどのJavaScriptの仕組みでは動かないブラウザがあります。Explorerです。9より前のバージョンに対応しておらず、別の仕組みを経由してAjaxを実装する必要があります。なんてこった!またまたクロスドメインではまることになりました。9以前のバージョンでのクロスドメイン実装についてのJavaScriptが存在します。私もいくつか試しましたが、私の環境ではそのうち動いたのが以下の1つだけでした。MoonScript/jQuery-ajaxTransport-XDomainRequestなので、今回はこちらのJavaScriptも使わせて頂きました。ありがとうございます。結果として、kintone上にアップするJavaScriptファイルは3種類となりました。最初にjQuery本体。次にIE9以前対応のクロスドメイン制約対応のJavaScript。最後に今回作成したJavaScriptです。