Microsoft Dynamics 365 での JavaScript の使用

[アーティクル]
03/03/2017

公開日: 2017年1月

対象: Dynamics 365 (online)、Dynamics 365 (on-premises)、Dynamics CRM 2016、Dynamics CRM Online

Microsoft Dynamics 365 (オンラインおよび設置型) には、JavaScriptを使用する機会が多くあります。Microsoft Dynamics 365 で使用されるすべての JavaScript は、JavaScript Web リソースを作成することによって追加されます。このトピックには、JavaScript を使用する開発者のための情報と、Microsoft Dynamics 365 SDK およびそのほかのソースの関連するトピックへのリンクが含まれます。

このトピックの内容

Microsoft Dynamics 365 で Javascript を使用できる領域

jQuery の使用

複数のブラウザーで Javascript を記述する

JavaScript プログラミングのベストプラクティス

Microsoft Dynamics 365 での JavaScript のデバッグ

Microsoft Dynamics 365 で Javascript を使用できる領域

JavaScript を使用して、フォームスクリプト、コマンドバー (リボン) コマンド、および Web リソースでのアクションを実行できます。

フォームスクリプト

Microsoft Dynamics 365 の JavaScript の最も一般的な用途は、エンティティフォームイベントのイベントハンドラーとして関数を追加することです。詳細については、「Microsoft Dynamics 365 フォームのコードを記述する」を参照してください。

コマンドバー (リボン) コマンド

Microsoft Dynamics 365 コマンドバーをカスタマイズすると、追加するコントロールのコマンドを構成できます。次のコマンドには、コントロールを有効化するかどうか、コントロールが使用されたときはどのアクションを実行するかを制御するルールが含まれています。詳細については、「コマンドおよびリボンをカスタマイズする」を参照してください。

Web リソース

Microsoft Dynamics 365 は、URL を使用してアクセスできるファイルのバイナリ表現を保管する組織所有のエンティティを提供します。このファイルは、Web リソースと呼ばれます。 Web リソースには複数の種類があります。JavaScript ライブラリを表す Web リソースは、JavaScript Web リソースと呼ばれます。 Web ページ (HTML) Web リソースを使用して、Web サーバーのファイルにするように、JavaScript ライブラリを使用するユーザーインターフェイスを提供できます。これらのファイルは Microsoft Dynamics 365の一部であるため、これらにアクセスするユーザーはすでに認証されています。したがって、ユーザーを認証するためにコードを記述せずに Microsoft Dynamics 365 Web サービスを使用できます。詳細については、「Microsoft Dynamics 365 の Web リソース」および「Web リソースを使用した Dynamics 365 データの操作」を参照してください。

jQuery の使用

HTML Web リソースで jQuery を使用する
マイクロソフトは、jQuery は優れたクロスブラウザーライブラリなので、HTML Web リソースとともに jQuery を使用して、ユーザーインターフェイスを提供することをお勧めします。

HTML Web リソースで、提供されたライブラリを制御します。DOM の操作に対しての制限はありません。 HTML Web リソース内で jQuery を気軽に使用してください。
フォームスクリプトまたはリボンコマンドに jQuery の使用を避ける
フォームスクリプトおよびリボンコマンドで jQuery を使用することをお勧めしません。

jQuery が提供する最大の益は、DOM のクロスブラウザー操作が簡単になることです。これにより、フォームスクリプトとリボンコマンドは明示的にサポートされていません。スクリプトを制限して、フォームスクリプトとリボンコマンドで使用できる Xrm.Page と Xrm.Utility ライブラリを使用します。Microsoft Dynamics 365 で有用な jQuery のそのほかの機能を使用し、$.ajaxを使用する機能を含めることにした場合、次のことを考慮します。
- 最良のパフォーマンスを得るには、必要でない場合はページで jQuery をロードしないでください
- Microsoft Dynamics 365 Web サービスに対して要求を実行するために $.ajax を使用することはサポートされていますが、代替手段があります。$.ajax を使用する代替策は、ブラウザーの XMLHttpRequest オブジェクトの直接使用することです。 jQuery $.ajax メソッドは、このオブジェクトのラッパーのみです。ネイティブ XMLHttpRequest オブジェクトを直接使用する場合、jQuery を読み込む必要はありません。
- ページに読み込まれる jQuery の各バージョンは、違うバージョンの場合があります。 jQuery のさまざまなバージョンはさまざまな動作をするので、jQuery の複数バージョンが同じページで読み込まれるときは、問題が発生する可能性があります。これはこの問題を軽減する手法ですが、jQuery ライブラリおよび jQuery に依存する他のライブラリの編集によって異なります。詳細:「Dynamics CRM 2011 と 2013 での jQuery および jQuery UI, jQuery.noConflict()」を参照してください
  
  注意
  
  Microsoft Dynamics CRM Online 2015 更新プログラム 1 以降、フォームスクリプトは、アプリケーションによって使用される jQuery インスタンスとは異なるスコープで実行されます。これは、コードで jQuery.noConflict が使用されようとするときに使用できる jQuery のインスタンスが存在しない場合があることを意味します。 jQuery を使用する必要がある場合は、jQuery.noConflict の使用を試みる前に、最初に、jQuery のインスタンスが存在するかどうかを検出する必要があります。

複数のブラウザーで Javascript を記述する

どのブラウザーが使用されるかわからないので、使用するスクリプトはサポートされているすべてのブラウザーで動作することを確認してください。Internet Explorer と他のブラウザーの重要な違いのほとんどは、HTML および XML DOM の操作と関係しています。 HTML DOM の操作がサポートされていないため、スクリプトロジックだけがサポートされる操作を実行し、Xrm.Page API を使用している場合、他のブラウザーをサポートするために大きな変更は必要ではありません。Custom Code Validation Tool を使用して、Internet Explorerでのみ動作するコードを識別します。

jQuery などのクロスマッピングライブラリは、Web リソース開発のための良いソリューションですが、フォームスクリプトまたはリボンコマンドに必要ありません。詳細:jQuery の使用

そのほかのブラウザーのサポート

Microsoft Dynamics 365 (オンラインおよび設置型)は W3C 標準をサポートするため、アプリケーションは最近のブラウザーを使用したり、それらの標準をサポートする任意のプラットフォームからアクセスできます。ただし、Microsoft Dynamics 365 は特定のブラウザーセットおよびプラットフォームを使用してのみテストされます。サポートされるプラットフォームとブラウザーの一覧については、「TechNet: サポートされる Web ブラウザー」を参照してください。

サポートされていないブラウザーまたはブラウザーバージョンを使用しており、サーバー名または URL として組織のサーバー名を入力している場合、電話用 Microsoft Dynamics 365 ページにリダイレクトされます。電話用 Dynamics 365 ページは、モバイルデバイスで使用できる機能が制限されているブラウザーなどほとんどのブラウザーで適切に動作するはずです。

JavaScript プログラミングのベストプラクティス

以下のセクションは Microsoft Dynamics 365で JavaScript を使用する際のベストプラクティスについて説明します。

サポートされないメソッドを使用しない

インターネットでは、サポートされていないメソッドを使用するさまざまな例や提案があります。これらは、ページコントロールに文書化されていない内部関数を活用するものもあります。これらのメソッドは機能するかもしれませんが、サポートされていないため Microsoft Dynamics 365の将来のバージョンでも引き続き使用できるとは期待できません。

Custom Code Validation Tool を使用して、サポートされていないメソッドを使用しているコードを特定します。

HTML Web リソースユーザーインターフェイスにクロスブラウザー Javascript ライブラリを使用する

jQuery などのクロスブラウザー JavaScript ライブラリには、複数のブラウザーをサポートする HTML Web リソースを開発する際は多くの利点があります。jQuery などの JavaScript ライブラリは、Microsoft Dynamics 365 でサポートされるすべてのブラウザーに統合開発環境を提供します。これらの機能は HTML Web リソースを使用してユーザーインターフェイスを提供するのに適しています。jQuery などの JavaScript ライブラリは、ドキュメントオブジェクトモデル (DOM) と対話する一貫性のある方法を提供します。

フォームスクリプトまたはコマンドで jQuery を使用しない

マイクロソフトはアプリケーション内のどのページでも jQuery を使用することをお勧めしませんし、サポートもしません。これには、フォームスクリプトおよびリボンコマンドが含まれています。詳細:jQuery の使用。

コンテンツデリバリネットワーク (CDN) ライブラリの制限を認識する

コンテンツデリバリネットワーク (CDN) の JavaScript ライブラリは、公開されている Web サイトに多くの利点を提供します。これらのライブラリはインターネットでホストされるため、ライブラリのコンテンツを含む Web リソースを作成する必要はありません。Microsoft Dynamics 365 では、CDN JavaScript ライブラリを使用する前に、以下の問題を考慮する必要があります。

オフラインアクセス対応 Microsoft Office Outlook 用 Microsoft Dynamics 365 クライアントのユーザーは、オフライン作業中にインターネット接続がない状態で作業できます。JavaScript ライブラリにインターネット接続が必要な場合、コードは失敗します。
組織によっては、従業員のインターネットアクセスを制限することがあります。ネットワークを CDN ライブラリのサイトにアクセスできるように構成しないと、それらの組織において、コードが失敗することがあります。

CDN ライブラリの使用の代替方法は、ライブラリのコンテンツと共にスクリプト (JavaScript) Web リソースを作成することです。 Web リソースは組織所有のエンティティなので、オフラインアクセス対応 Outlook 用 Microsoft Dynamics 365 ユーザーがオフラインのときに同期されます。これらの Web リソースはアプリケーションの一部になるため、組織がインターネットへのアクセスを制限しても妨げられません。

複数のブラウザーに関数を記述する際、機能検出を使用する

jQuery のようなクロスブラウザーライブラリを使用する場合でも、ブラウザー間の違いを認識する必要があります。navigator.useragent プロパティのクエリに使用されるブラウザーを検出できます。これでは、ブラウザーの検出と呼ばれます。ブラウザーの検出は、新しいバージョンのブラウザーにどんな機能があるかを検討することはできないので、通常適切な方法ではありません。また、一部のブラウザーには navigation.useragent プロパティを変更する機能があるので、別のブラウザーのように見えます。

機能検出が推奨されている方法です。利用できる機能を検出することで、どのブラウザーを使用しているかわからなくても、サポートするブラウザーのコードパスを作成できます。機能検出に関する詳細については、「ブラウザーではなく機能を検出する方法」を参照してください。

DOM にアクセスしない

JavaScript デベロッパは、コードのドキュメントオブジェクトモデル (DOM) 要素との対話に使用されます。window.getElementById メソッドまたは jQuery ライブラリを使用する場合があります。HTML Web リソースでこれらの方法を自由に使用できますが、Microsoft Dynamics 365 アプリケーションページまたはエンティティフォームの要素にアクセスするためにはサポートされていません。代わりに、エンティティフォーム要素へのアクセスは、Xrm.Page オブジェクトモデルを通して公開されます。Microsoft Dynamics 365 開発チームが、要素の ID の値を含むページの構成方法を変更する権利を保持します。それで、Xrm.Page オブジェクトモデルを使用することで、コードがページの実装方法の変更から保護されます。詳細については、「Xrm.Page オブジェクトモデルの使用」を参照してください。

JavaScript 関数に一意の名前を指定する

HTML ページの開発者が一人しかいない場合、使用する JavaScript 関数名を簡単に管理できます。Microsoft Dynamics 365で、他のソリューションは JavaScript 関数を関数が使用されているページに追加する場合があります。

ページに同じ名前の 2 種類の JavaScript 関数がある場合は、最初に定義された関数は 2 番目の関数で上書きされます。したがって JavaScript 関数に一意の名前を定義してください。詳細については、「スクリプトライブラリの作成」を参照してください。

非同期データアクセス方法を使用する

Microsoft Dynamics 365 Web サービスを使用してデータにアクセスするときは、常に、非同期に実行するように構成された XMLHttpRequest を使用してください。なぜならば、ブラウザーは単一スレッドで作動するからです。そのスレッドが長時間のプロセスを同期して実行するのに使用されている場合、ブラウザーは応答を停止します。

注意

同期 XMLHttpRequests は、エンドユーザーのエクスペリエンスに悪影響があるため、ブラウザーのメインスレッドで使用されなくなりました。一部のブラウザーは、今ではこれが検出されると警告を提供します。ブラウザーが将来的にいつかの時点で仕様を実装すると、InvalidAccessError 例外がスローされます。詳細:http://www.w3.org/TR/XMLHttpRequest/#synchronous-flag および https://xhr.spec.whatwg.org/#the-open()-method

Microsoft Dynamics 365 での JavaScript のデバッグ

各ブラウザーは特定の種類のデバッグ拡張機能を提供します。Internet Explorer は、Microsoft Dynamics 365 でスクリプトをデバッグするのに使用できる開発者ツールを提供します。Internet Explorerを使用してページを表示しているときに、Internet Explorer 開発者ツールは F12 を押して開くことができます。詳細については、「F12開発者ツールの使用」を参照してください。

Google Chromeで、F12 を押して開発者ツールを開きます。Firebug は、Mozilla Firefox を使用する Web 開発の一般的なブラウザー拡張機能です。Apple Safariでは、最初に [高度な設定] の [メニューバーメニューに開発メニューを表示する] を選択する必要があります。次に [開発] メニューから [Web 検査の表示] を選択できます。

Microsoft Visual Studio を使用することもできます。詳細については、「Microsoft Dynamics CRM 2011 での JScript のデバッグの方法」を参照してください。

Microsoft Dynamics 365 で JavaScript ライブラリを使用すると、ライブラリは Web ページで読み込まれます。デバッグ環境では、自分の特定なライブラリを分離することが困難な場合があります。Microsoft Edgeでデバッグツールを使用している場合、[デバッガー] タブで、左上の隅でフォルダーアイコンをクリックし、使用できるスクリプトを展開し、次に示す new_myCustomJavaScript.js Web リソースなど JavaScript Web リソース名に対応する名前を持つスクリプトを検索します。検索ボックスにファイル名を入力することにより、JavaScript ライブラリも検索できます。

JavaScript のデバッグ

さまざまなブラウザーのデバッグツールは、同様の機能を備えています。ライブラリを見つけたら、ブレークポイントを設定し、コードが実行する原因となるイベントを再作成します。

新しい対話型サービスハブクライアント (Dynamics 365 で導入された) で、ページで読み込む代わりに、Dynamics 365 は動的に JavaScript ライブラリの内容を挿入します。この場合、ページが再度読み込みされるたびにコードが動的ライブラリの 1 つに挿入され、ブレークポイントにヒットすることが防止されるため、コードにはブレークポイントを設定できません。この場合、コードをデバッグするために、他のテクノロジを使用する必要があります。詳細:ブログ: ブラウザーの開発者ツールを使用して CRM で JavaScript コードをデバッグする

コンソールにメッセージを作成する

JavaScript をデバッグするときに window.alert メソッドを使用することは、アプリケーションのコードをトラブルシューティングする一般的な方法です。最近のすべてのブラウザーでは、デバッグツールへ簡単にアクセスできますが、デバッグしているアプリケーションを他の人が使用している場合、ベストプラクティスではありません。

代わりにコンソールにメッセージを記述することを検討してください。次に、ライブラリに追加できる小さな関数を示します。それにより、コンソールを開いたときに表示するメッセージを送信するために使用できます。

function writeToConsole(message)
{
 if (typeof console != 'undefined') {
  console.log(message);
 }
}

alert メソッドとは異なり、この関数を使用するコードを削除することを忘れた場合は、アプリケーションを使用するユーザーにはメッセージが表示されません。

Microsoft Dynamics 365 での JavaScript の使用

このトピックの内容

Microsoft Dynamics 365 で Javascript を使用できる領域

フォームスクリプト

コマンドバー (リボン) コマンド

Web リソース

jQuery の使用

複数のブラウザーで Javascript を記述する

そのほかのブラウザーのサポート

JavaScript プログラミングのベストプラクティス

サポートされないメソッドを使用しない

HTML Web リソースユーザーインターフェイスにクロスブラウザー Javascript ライブラリを使用する

フォームスクリプトまたはコマンドで jQuery を使用しない

コンテンツデリバリネットワーク (CDN) ライブラリの制限を認識する

複数のブラウザーに関数を記述する際、機能検出を使用する

DOM にアクセスしない

JavaScript 関数に一意の名前を指定する

非同期データアクセス方法を使用する

Microsoft Dynamics 365 での JavaScript のデバッグ

コンソールにメッセージを作成する

関連項目

その他のリソース

Microsoft Dynamics 365 での JavaScript の使用

このトピックの内容

Microsoft Dynamics 365 で Javascript を使用できる領域

フォーム スクリプト

コマンド バー (リボン) コマンド

Web リソース

jQuery の使用

複数のブラウザーで Javascript を記述する

そのほかのブラウザーのサポート

JavaScript プログラミングのベスト プラクティス

サポートされないメソッドを使用しない

HTML Web リソース ユーザー インターフェイスにクロスブラウザー Javascript ライブラリを使用する

フォーム スクリプトまたはコマンドで jQuery を使用しない

コンテンツ デリバリ ネットワーク (CDN) ライブラリの制限を認識する

複数のブラウザーに関数を記述する際、機能検出を使用する

DOM にアクセスしない

JavaScript 関数に一意の名前を指定する

非同期データ アクセス方法を使用する

Microsoft Dynamics 365 での JavaScript のデバッグ

コンソールにメッセージを作成する

関連項目

その他のリソース

フォームスクリプト

コマンドバー (リボン) コマンド

JavaScript プログラミングのベストプラクティス

HTML Web リソースユーザーインターフェイスにクロスブラウザー Javascript ライブラリを使用する

フォームスクリプトまたはコマンドで jQuery を使用しない

コンテンツデリバリネットワーク (CDN) ライブラリの制限を認識する

非同期データアクセス方法を使用する