WKWebViewのユーザーエージェントを変更する

作者:
  • 環境
    • Xcode Version 11.6
  • 言語
    • Objective-C

WKWebViewのユーザーエージェントの初期値を変更する

WKWebViewのユーザーエージェントの初期値を指定した名前に置き換える方法です。

#import <WebKit/WebKit.h>

// アプリのバージョン番号を取得
NSString* version = [[NSBundle mainBundle] objectForInfoDictionaryKey:@"CFBundleShortVersionString"];
// 設定するユーザーエージェントの名前
NSString* userAgent = [NSString stringWithFormat:@"MyApp Version=%@", version];
// ユーザーエージェントの初期値を変更する
NSDictionary* registrationDictionary = [NSDictionary dictionaryWithObjectsAndKeys:userAgent, @"UserAgent", nil];
[NSUserDefaults.standardUserDefaults registerDefaults: registrationDictionary];

WKWebViewConfiguration* webConfig = [[WKWebViewConfiguration alloc] init];
WKWebView* webView = [[WKWebView alloc] initWithFrame:self.view.bounds configuration:webConfig];

ユーザーエージェントは次のようになりました。

MyApp Version=1.0

WKWebViewのユーザーエージェントを変更する

WKWebViewのユーザーエージェントに指定した名前に置き換える方法です。

WKWebViewのcustomUserAgentにユーザーエージェントを設定します。

// アプリのバージョン番号を取得
NSString* version = [[NSBundle mainBundle] objectForInfoDictionaryKey:@"CFBundleShortVersionString"];
// 設定するユーザーエージェントの名前
NSString* userAgent = [NSString stringWithFormat:@"MyApp Version=%@", version];
// WKWebViewを作成する
WKWebViewConfiguration* webConfig = [[WKWebViewConfiguration alloc] init];
WKWebView* webView = [[WKWebView alloc] initWithFrame:self.view.bounds configuration:webConfig];
// ユーザーエージェントを変更する
webView.customUserAgent = userAgent;

ユーザーエージェントは次のようになりました。

MyApp Version=1.0

customUserAgentで設定したユーザーエージェントは、NSUserDefaultsで設定したユーザーエージェントよりも優先されます。

WKWebViewのユーザーエージェントに追記する

WKWebViewのユーザーエージェントに指定した名前を追記する方法です。

WKWebViewConfigurationのapplicationNameForUserAgentに追記する名前を設定します。

// アプリのバージョン番号を取得
NSString* version = [[NSBundle mainBundle] objectForInfoDictionaryKey:@"CFBundleShortVersionString"];
// 追記するユーザーエージェントの名前
NSString* userAgent = [NSString stringWithFormat:@"MyApp Version=%@", version];
// WKWebViewを作成する
WKWebViewConfiguration* webConfig = [[WKWebViewConfiguration alloc] init];
webConfig.applicationNameForUserAgent = userAgent;
WKWebView* webView = [[WKWebView alloc] initWithFrame:self.view.bounds configuration:webConfig];

ユーザーエージェントは次のようになりました。

Mozilla/5.0 (iPhone; CPU iPhone OS 13_6 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) MyApp Version=1.0

NSUserDefaultsやcustomUserAgentでユーザーエージェントを設定している場合、applicationNameForUserAgentの設定は適用されません。

タグの追加や削除を監視する

作者:

JavaScriptでタグの追加や削除を検知するには、MutationObserverを使用します。

MutationObserverのコンストラクタは引数にタグの追加や削除が合った時に実行するコールバック関数を受け取ります。　

const observer = new MutationObserver(mutations => {
    // 変更があった時に実行する処理
});

コールバック関数は、第1引数にMutationRecordを受け取ります。

MutationRecordのaddedNodesプロパティは追加されたノード、
removedNodesプロパティは削除されたノードを返します。

const observer = new MutationObserver(mutations => {
    mutations.forEach(mutation => {
        mutation.addedNodes.forEach(node => {
            // nodeは追加されたノード
        });
        mutation.removedNodes.forEach(node => {
            // nodeは削除されたノード
        });
    });
});

監視を開始するときは、observe()メソッドを呼びます。

observe()メソッドは引数に、監視するノードと変更の種類を指定するMutationObserverInitオブジェクトを受け取ります。

  • MutationObserverInit
    • childList 対象ノードの子ノード（テキストノードも含む）に対する追加・削除を監視する場合は true にします。
    • attributes 対象ノードの属性に対する変更を監視する場合は true にします。
    • characterData 対象ノードのデータに対する変更を監視する場合は true にします。
    • subtree 対象ノードとその子孫ノードに対する変更を監視する場合は true にします。
    • attributeOldValue 対象ノードの変更前の属性値を記録する場合は true にします（attributes が true の時に有効）。
    • characterDataOldValue 対象ノードの変更前のデータを記録する場合は true にします（characterData が true の時に有効）。
    • attributeFilter すべての属性の変更を監視する必要がない場合は、（名前空間を除いた）属性ローカル名の配列を指定します。
/ 監視するノード
const container = document.getElementById("container");
// 監視を開始する
observer.observe(container, { childList: true, });

サンプルプログラム

次のサンプルプログラムは、追加ボタンを押すとノードを追加し、削除ボタンを押すとノードを削除します。

ノートが追加・削除されると、変更されたノードのテキストが表示されます。

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>タグの追加や削除を監視するサンプル</title>
</head>

<body>
    <h1>タグの追加や削除を監視するサンプル</h1>
    <button id="insertButton">追加</button>
    <button id="deleteButton">削除</button>
    <ul id="container"></ul>
    <hr>
    <ol id="record"></ol>

    <script>
        const container = document.getElementById("container");
        // 追加ボタン
        document.getElementById("insertButton").addEventListener("click", () => {
            const li = document.createElement("li");
            li.append(document.createTextNode(Date.now()));
            container.appendChild(li);
        });
        // 削除ボタン
        document.getElementById("deleteButton").addEventListener("click", () => {
            if (container.firstChild) {
                container.removeChild(container.firstChild);
            }
        });

        const record = document.getElementById("record");
        const observer = new MutationObserver(mutations => {
            mutations.forEach(mutation => {
                mutation.addedNodes.forEach(node => {
                    const li = document.createElement('li');
                    li.append(document.createTextNode(`[追加] ${node.textContent}`));
                    record.appendChild(li);
                });
                mutation.removedNodes.forEach(node => {
                    const li = document.createElement('li');
                    li.append(document.createTextNode(`[削除] ${node.textContent}`));
                    record.appendChild(li);
                });
            });
        });
        observer.observe(container, { childList: true, });
    </script>
</body>

</html>

Linux Mint 20にdocker-composeをインストールする

作者:

公式サイトの手順に従って、Docker Composeをインストールします。

Docker Composeの現在の安定リリースをダウンロードします。

sudo curl -L "https://github.com/docker/compose/releases/download/1.26.2/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose

実行権限を設定します。

sudo chmod +x /usr/local/bin/docker-compose

インストールできたことを確認します。

$ docker-compose --version
docker-compose version 1.26.2, build eefe0d31

Linux Mint 20にDockerをインストールする

作者:

Linux Mint 20にDockerをインストールする手順

実行環境

$ cat /etc/issue
Linux Mint 20 Ulyana \n \l

公式サイトに書かれている手順に従ってインストールする。

aptパッケージのインデックスを更新する。

$ sudo apt-get update

パッケージをインストールする。

$ sudo apt-get install \
    apt-transport-https \
    ca-certificates \
    curl \
    gnupg-agent \
    software-properties-common

Dockerの公式GPGキーを追加する。

$ curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo apt-key add -

追加したキーを確認する。

$ sudo apt-key fingerprint 0EBFCD88
pub   rsa4096 2017-02-22 [SCEA]
      9DC8 5822 9FC7 DD38 854A  E2D8 8D81 803C 0EBF CD88
uid           [  不明  ] Docker Release (CE deb) <docker@docker.com>
sub   rsa4096 2017-02-22 [S]

リポジトリを設定する。
注意書きにあるように、コマンドを一部変更する必要がある。

$ sudo add-apt-repository \
 "deb [arch=amd64] https://download.docker.com/linux/ubuntu focal stable"

aptパッケージのインデックスを更新する。

$ sudo apt-get update

Dockerをインストールする。

$ sudo apt-get install docker-ce docker-ce-cli containerd.io

正しくインストールされていることを確認する。

$ sudo docker run hello-world

現在のユーザーをdockerグループに所属させる。

sudo gpasswd -a $USER docker