---
title: タグ制御
description: scriptとiframeの変換仕様、除外用テンプレートタグ、YAMLルールを説明します。
canonical: 'https://mixed.co.jp/docs/governance-pack/tag-control/'
---
# タグ制御

scriptとiframeの変換仕様、除外用テンプレートタグ、YAMLルールを説明します。

公式ページ: [https://mixed.co.jp/docs/governance-pack/tag-control/](https://mixed.co.jp/docs/governance-pack/tag-control/)

## 制御対象

実装で変換するHTML要素は`script`と`iframe`だけです。

| 要素         | 変換対象                     | 主な変換                                                    |
| ---------- | ------------------------ | ------------------------------------------------------- |
| `iframe`   | 終了タグがあり、値付きの`src`属性があるもの | `src`を`data-src`へ変更。既定属性、ドメイン別属性、ドメイン置換を適用              |
| `script`   | 終了タグがあるもの                | typeなし、空のtype、JavaScript MIMEタイプを`type="text/plain"`へ変更 |
| 外部`script` | 上記に加え、値付きの`src`属性があるもの   | 既定属性、ドメイン別属性、ドメイン置換を適用                                  |

`src`と`type`の属性値は、ダブルクォート、シングルクォート、クォートなしの記述を認識します。属性名とJavaScript MIMEタイプの大文字・小文字は区別しません。

変換を有効にすると、条件に合う同種タグをすべて処理します。YAMLのドメインルールは変換対象を限定するためのものではなく、ドメインの置換と属性の追加に使用します。

## 変換から除外する

`CMPGovernancePackExclude`ブロックタグで囲んだ範囲をscript変換とiframe変換の両方から除外できます。STRIGHTのスクリプトなど、同意状態を判定するために変換せず実行する必要があるコードへ使用します。

### タグ名

`CMPGovernancePackExclude`

### 書式

```mtml
<mt:CMPGovernancePackExclude>
  変換対象外にするHTML
</mt:CMPGovernancePackExclude>
```

引数・属性はありません。

### 使用例

```mtml
<mt:CMPGovernancePackExclude>
  <script src="https://example.com/cmp.js"></script>
</mt:CMPGovernancePackExclude>
```

実際には、契約中のSTRIGHT環境から指定されたスクリプトを記述してください。

### 出力と動作

範囲内のMTMLを評価した後、その出力を変換対象から除外します。公開HTMLにはブロックタグ自体は出力されず、範囲内のHTMLだけが元の状態で出力されます。

上記の例では、scriptへ`type="text/plain"`を追加せず、`src`や属性も変更しません。範囲外にあるscriptとiframeは、設定に従って従来どおり変換されます。

### 対応CMS

Movable Type、PowerCMS

### 注意事項

* 除外範囲のscriptとiframeは、利用者の同意状態に関係なく実行・読み込み可能な状態で出力されます。
* 計測、広告、動画埋め込みなど、同意前に停止すべきタグを囲まないでください。
* STRIGHTスクリプトを囲む場合も、スクリプト自身が発行するCookieや通信が運用上許容されるか確認してください。

## iframeの変換

### 変換前

```html
<iframe src="https://video.example.com/embed/123"></iframe>
```

### 変換後

YAMLで属性やドメイン置換を指定していない場合は、次のようになります。

```html
<iframe data-src="https://video.example.com/embed/123"></iframe>
```

ブラウザは`data-src`をiframeの読み込み先として扱わないため、STRIGHT側の連携処理が`src`へ戻すまで外部コンテンツは読み込まれません。

### 変換順

1. `src`からドメインを抽出します。
2. 完全一致するドメインルールがあれば、置換先ドメインへ変更します。
3. `defaults`の属性を追加します。
4. 完全一致するルールの`element`属性を追加します。
5. `src`を`data-src`へ変更します。

既存の属性と同じ属性を追加する場合は、既存値、`defaults`、`element`の値を空白で連結します。

すでに`data-src`があるiframeに`src`もある場合は、既存の`data-src`を変換対象の`src`値で更新し、`src`を削除します。`data-src`だけのiframeは再変換しないため、再度処理しても`data-data-src`にはなりません。

## scriptの変換

### type属性がないscript

変換前：

```html
<script src="https://tag.example.com/app.js"></script>
```

変換後：

```html
<script type="text/plain" src="https://tag.example.com/app.js"></script>
```

### JavaScript MIMEタイプのscript

変換前：

```html
<script type="application/javascript">runTag();</script>
```

変換後：

```html
<script type="text/plain">runTag();</script>
```

scriptでは、`src`を`data-src`へ変更しません。実行停止は`type="text/plain"`への変更で行います。

次のJavaScript MIMEタイプを`text/plain`へ変更します。

* `text/javascript`
* `application/javascript`
* `text/ecmascript`
* `application/ecmascript`

### 変換されないtype

`type="module"`は変更されません。たとえば、次のタグは実行可能なままです。

```html
<script type="module" src="https://tag.example.com/app.js"></script>
```

`application/ld+json`など、JavaScriptとして実行しないデータ記述用のtypeも変更しません。module scriptを変換から除外する目的で使用せず、除外範囲を明示する場合は`CMPGovernancePackExclude`を使用してください。

## YAMLの構造

iframe用とscript用のYAMLは別の設定欄へ入力します。

| キー                  | 内容                        |
| ------------------- | ------------------------- |
| `iframe`または`script` | 設定欄に対応する最上位キー             |
| `defaults`          | 値付きの`src`がある対象タグへ共通追加する属性 |
| `rules`             | ドメイン別ルールの配列。ルールがなければ省略可能  |
| `match.domain`      | `src`から抽出したドメインと完全一致させる値  |
| `replace.domain`    | 一致した`src`内で置き換えるドメイン。省略可能 |
| `element`           | 一致したタグへ追加する属性。省略可能        |

次の例は、YAMLの処理を示すために標準の`class`属性と例示用ドメインを使用しています。STRIGHT固有の属性を示す例ではありません。

```yaml
iframe:
  defaults:
    class: consent-controlled
  rules:
    - match:
        domain: video.example.com
      replace:
        domain: privacy-video.example.com
      element:
        class: video-service
```

この例では、対象iframeに`consent-controlled`を追加し、ドメインが一致する場合は置換後のドメインと`video-service`を追加します。既存のclassがある場合は、既存値の後ろへ追加されます。

## ドメイン判定

* `http://`、`https://`または`//`から始まるURLでは、ホスト部分をドメインとして取得します。
* ポート番号がある場合は、ポート番号を含む値で一致させる必要があります。
* 比較は文字列の完全一致で、大文字・小文字を同一視する処理はありません。
* `//example.com/path`のようなプロトコル相対URLにもドメインルールを適用します。
* 相対URLではドメインルールを適用できませんが、タグ自体の基本変換は行われます。

## CMP同意前と同意後

| 状態        | CMSが出力する状態                              | 必要な処理                    |
| --------- | --------------------------------------- | ------------------------ |
| 同意前       | iframeは`data-src`、対象scriptは`text/plain` | 実行・読み込みさせない              |
| 対象区分へ同意後  | CMSの出力自体は変わりません                         | STRIGHT側の連携処理で対象タグを有効化する |
| 拒否または判定不能 | 無効状態のまま                                 | 有効化しない                   |

同意後の有効化処理はプラグイン本体に含まれません。

## 注意事項と制限事項

* `iframe`は`</iframe>`、`script`は`</script>`まである記述が対象です。
* inline scriptには`src`がないため、YAMLの`defaults`とドメイン別`element`は適用されません。typeの変換だけが行われます。
* YAMLで追加する属性名と属性値はHTMLへそのまま挿入されます。信頼できる管理者だけが設定し、クォートなどを含む値は使用しないでください。
* 設定画面では、YAML構文、最上位キー、`defaults`、`rules`、各ルールの基本構造、属性名を検証します。エラーがある設定はページ生成時に空として扱われます。
* YAMLの属性名として使用できない文字を含むキーは追加しません。
* `link`、`img`、`video`、`audio`、`object`、`embed`などは変換しません。
* Cookieを発行するタグを自動検出する機能はありません。
