AdoptでURLを使ってページのタグ付けを行う

最終更新日: 2023年06月22日 21:38

この記事では、URL構文を使用して、ページのタグ付けでルールを作成する方法について説明します。また、ページのタグ付けルールの編集方法の例とガイダンスが含まれています。ページのタグ付けの概要については、Adoptでのページのタグ付けと表示を参照してください。

URL構文

Pendoは標準的なウェブURL構文ルールに従って、ページにタグ付けを行います。URLは複数の部分で構成されています。URLの主要部分は、通信プロトコル、サブドメイン、ドメインもしくはホスト名、およびパスから成ります。たとえば、URL「https://www.example.com/category/user/profile.html」は、次のように構成されています。

URL構文	説明
`https://`	ブラウザがウェブサイトにアクセスするために使用する必要がある通信プロトコルまたはスキーム。
`www.`	サブドメイン。これはドメインを共有するウェブサイトのさまざまな部分をグループ化したものです。これは、`www.`である必要はありません。たとえば、`https://app.example.com`のように`app.`とすることも可能です。
`example.com`	ドメイン名。これはセカンドレベルドメイン（`example`）とトップレベルドメイン（`.com`）の2つの部分で構成されます。これらは、単純にまとめて参照されることがよくあります。 Pendoはデフォルトでワイルドカード（`*`）を使用してドメインを非表示にできます。これは、Pendoを複数の環境（ステージング、テスト、本番）にインストールする際にワイルドカードを使うことで、各環境ですべてに再度タグ付けする必要がないようにするためです。
`/category/user/profile.html`	ウェブサーバー上のリソースへのパス。ドメインの後にあるものはすべてパスです。これは、ドメイン内の特定のコンテンツやフォルダを識別するものです。以下に例を示します。 `category`はサブフォルダーであり、サブディレクトリと呼ばれることもあります。ちょうどパソコンのフォルダーのようなものです。 `profile.html`はページです。これはコンテンツを含むエンドポイントです。ファイルの種類によって異なる拡張子を持つことも、単にスラッシュで終わることもあります。ほとんどの場合、パスは大文字と小文字が区別されます。このため、Pendoではタグ付けされたページのケース構文を取り込むことをお勧めします。

URLはこれより複雑な場合もあれば、そうでない場合もあります。以下の例を参照してください。

フラグメントの例

フラグメントは、ウェブページ内のセクションを参照する内部ページ参照で、名前付きアンカーと呼ばれることもあります。通常、フラグメントはURLの末尾に表示され、ハッシュタグ（#）で始まり、その後に識別子が続きます。たとえば、URL https://www.example.com#someHeaderには、次の部分が含まれています。

https://は通信プロトコル
www.はサブドメイン
example.comはドメイン
#someHeaderはフラグメント

パスフラグメントの例

パスフラグメントとは、ウェブサイトのウェブフレームワーク技術のルーティングとして使用される内部ページ参照のことです。通常、パスフラグメントはURLの末尾に表示され、ハッシュタグ（#）で始まり、その後に識別子が続きます。たとえば、URL https://www.example.com#products/widgets/12345には、次の部分が含まれています。

https://は通信プロトコル
www.はサブドメイン
example.comはドメイン
#products/widgets/12345はパスフラグメント

クエリパラメータの例

クエリパラメータは、URLの末尾で渡されるデータに基づいて、特定のコンテンツやアクションを定義します。通常、クエリパラメータはURLの末尾に表示され、疑問符（?）で始まり、その後にクエリパラメータが続きます。たとえば、URL https://www.example.com?products=widgetsには、次の部分が含まれます。

https://は通信プロトコル
www.はサブドメイン
example.comはドメイン
?products=widgetsはクエリパラメータで、キーと値のペア

疑問符（?）に続く文字列に複数のクエリパラメータがある場合、通常、キーと値のペアはアンパサンド（&）で区切られます。例：?products=widgets&source=browser-search

パスフラグメントクエリパラメータの例

URLの末尾には、パス、フラグメント、クエリパラメータを組み合わせて記述することが可能です。たとえば、URL https://www.example.com/#products/widgets?item=12345 には、次の部分が含まれています。

https://は通信プロトコル
www.はサブドメイン
example.comはドメイン
#products=widgetsは、ウェブフレームワークのルーティングに使用されるパスフラグメント
?item=12345は、パスフラグメントのクエリパラメータで、キーと値のペア

URL構文の例

このセクションでは、ビジュアルデザインスタジオ（Visual Design Studio）でページにタグ付けする際に、ルールビルダー、もしくはカスタムURLオプションを使用してルールを作成する場合に使用できるステートメントと同等の構文の概要と例を示します。この2つのオプションについては、Adoptでのページのタグ付けと表示の記事を参照してください。

ルールビルダーのステートメントとURL構文

ビジュアルデザインスタジオ（Visual Design Studio）でページにタグ付けするためのルールビルダーオプションは、タグ付け用に入力したURLの一部にステートメントを適用するオプションを提供することによって、ルールを作成するのに役立ちます。このセクションでは、これらのステートメントについて説明します。

詳細	構文	説明
`<Ignore>`	`/*/`	2つのスラッシュ内すべてを無視します。
`<Ignore after>`	`**`	2つのアスタリスクの後のURL内のすべてを無視します。
`<Contains>`	`~contains:`	後続の特定の文字列が含まれます。
`search_params=_value`	`?parameter= value`	パラメータが指定した値と一致する場合。
`search_params=<anything>`	`?parameter`	パラメータが任意の値と一致する場合。

カスタムURL構文の例

ビジュアルデザインスタジオでページのタグ付けに、カスタムURLオプションを使用すると、標準のURL構文を使用してページルールを作成できます。このセクションでは、この構文の例をご紹介します。詳細については、本記事のサポートされているURLのセクションを参照してください。

タイプの例	カスタムURL	一致する	一致しない
サブドメイン	`//~contains:pendo.io/**`	`https://app.pendo.io` および `https://help.pendo.io`	`https://www.insert.io/`
クエリパラメータ	`//www.pendo.io/features?language=english`	`https://www.pendo.io/features?language=english`	`https://www.pendo.io/features?language=french`
クエリパラメータ	`//www.pendo.io/features?language`	`https://www.pendo.io/features?language=english` および `https://www.pendo.io/features?language=french`

サポートされているURL

次の表に、サポートされている標準のURL構文と例を示します。

	説明	例
標準URL	ウェブページの完全なアドレス。	`https://www.pendo.io/features/platform/index.html`
ワイルドカード（`*`）	URLに含まれる任意の数の文字と一致するようにするために使用されるシンボル。複数のワイルドカードを使用できます。	`https://www.pendo.io/features/` `https://www.pendo.io/features/platform/index.html//*`
以降は無視（`**`）	2つのワイルドカードの後はすべて無視します。	`https://www.pendo.io/features/platform/index.html/users/**`
フラグメント（`#`）	内部ページの参照。	`https://domain.com/#page1`。ページルールでは、フラグメント（`#`）の後にワイルドカード（`*`）を使用することはできません。
パスフラグメント（`#`もしくは`#!`）	内部ページのルーティング。	`https://domain.com/#documents/engineering/widgets`。パスフラグメントにワイルドカード（`*`）を使用できます。
含む（`~contains:`）	特定の文字列を含めます。	`https://www.pendo.io/features/platform/index.html/users/~contains:dashboard`
パラメータの存在を照会（`?`）	パラメータが存在するかどうかを照会します。	`https://pendo.io?mobile`
パラメータ値を照会（`?`および`=`）	パラメータの値を照会します。	`https://pendo.io?language=english`
複数のクエリパラメータ（`?`、`&`、および`=`）	複数のパラメータの存在と値を照会します。	`https://pendo.io?mobile&language=english`

Pendoはhttps://domain.com/#page1とhttps://domain.com/#page2の違いを認識します。ページルールhttps://*は、両方のURLと一致します。URLがこのように構成されていて、https://domain.comのみに対応するページルールが必要な場合は、ロケーションAPIについてのドキュメントを確認してください。

サポートされていないURL

以下の表は、サポートされていないURL構文と例を示します。

ページパラメータ（`;`の後、`?`または`#`の前のセクション）	Pendoは、URLで動的に設定されたページパラメータをスキップします。
ページルール内の`NOT`のあらゆる形式	PendoはURL構文で`NOT`をサポートしていません。
クエリ（`?`）の後に含む（`~contains:`）	PendoはURL構文で`~contains:?`をサポートしていません。
`*`は、2つのスラッシュの間で文字列の全体を照合する場合にのみワイルドカードとして機能する	たとえば、`https://www.pendo.io/features`は`https:///`と一致しますが、`//.pendo.io/features`や`//www.pendo.io/fs`とは一致しません。
`*`も`~contains:`も`?`の後では機能しない	ワイルドカードと「Contains」は文字通りに扱われます。
クエリパラメータの順序は、`?`の後では無視される	たとえば、`https://www.pendo.io?first=one&second=two`と`https://www.pendo.io?second=two&first=one`は、どちらもページルール`//www.pendo.io?first=one&second=two`と一致します。

URLの正規化

正規化により、URLをルールに一致した、一貫性と信頼性が高いフォーマットに変換します。具体的には、スペースに対して%20や+などの特別なルールを適用します。これは、URLでスペースが伝達される方法ごとに、複数のルールを作成する必要がないようにするためです。また、パスフラグメントに対しては、#を#!に正規化します。これは、フラグメントとパスフラグメントを区別するためのものです。

下の表は、元のURLがどのように正規化され、どのようなルールに一致するのかの例を示しています。

元のURL	正規化済みURL	一致ルール
`https://www.example.com/foo%20bar`	`http://www.example.com/foo+bar`	`//*/foo%20bar`
`https://www.example.com/foo+bar`	`http://www.example.com/foo%2Bbar`	`///foo+bar` `///foo%20bar`
`https://www.example.com/?query=foo%20bar`	`http://www.example.com/foo+bar`	`//?query=foo+bar` `//?query=foo%20bar`
`https://www.example.com/#path/to/page/`	`http://www.example.com/#!path/to/page/`	`//*#!/page/to/page`
`https://domain.com/#documents/123/widgets`	`http://domain.com/#!documents/123/widgets`	`///#!/documents//widgets`