1. 始める前に
Desk Connector は、ウェブページからプログラムで ChromeOS 仮想デスクにアクセスできる ChromeOS の機能です。この Codelab では、Chrome DevTools で Desk Connector を使用する方法を学びます。
前提条件
- ChromeOS 仮想デスクに関する知識
学習内容
- ウィンドウ プロパティを設定する方法
- デスクを起動する方法
- デスクを削除する方法
- アクティブなデスクを取得する方法
- 別のデスクに切り替える方法。
必要なもの
- Chromebook
- ChromeOS バージョン 113.* 以降。目的のバージョンがまだ利用できない場合は、Beta チャンネルに切り替えます。
- Google Chrome
- Desk Connector Demo 拡張機能
2. セットアップする
設定手順は以下のとおりです。
- このウェブページを右クリックし、[検証] をクリックします。
- Chrome DevTools パネルで [Console] をクリックします。この Codelab のすべてのコードは [Console] パネルで実行します。
- （省略可）Codelab 全体にわたって仮想デスクを手動で操作するには、
F3または[]||キーを押して概要モードに切り替えます。
3. ウィンドウ プロパティを設定する
SetWindowProperties API を使用すると、ウェブページをプログラムでそのウィンドウのプロパティを設定できます。allDesks プロパティを true 値に設定すると、現在のタブのウィンドウがすべてのデスクに固定されます。
ウィンドウ プロパティを設定する手順は次のとおりです。
- [Console] パネルで、すべてのデスクに表示されるウィンドウを設定します。
chrome.runtime.sendMessage("oagemgapjncacjdaockjfaidedggjond", {
"messageType": "SetWindowProperties",
"operands": {
"allDesks": true
}
},
function(response) {
console.log(response);
}
);
- ウィンドウを再び 1 つのデスクに表示するように設定します。
chrome.runtime.sendMessage("oagemgapjncacjdaockjfaidedggjond",{
"messageType": "SetWindowProperties",
"operands": {
"allDesks": false
}
},
function(response) {
console.log(response);
}
);
- わかりやすくするために、ウィンドウをもう一度すべてのデスクに固定します。
chrome.runtime.sendMessage("oagemgapjncacjdaockjfaidedggjond", {
"messageType": "SetWindowProperties",
"operands": {
"allDesks": true
}
},
function(response) {
console.log(response);
}
);
Chromebook に複数の仮想デスクがある場合、すべてのデスクで現在のウィンドウを確認できます。
4. 現在アクティブなデスクを取得する
GetActiveDesk API を使用すると、ウェブページから現在アクティブなデスクをプログラムでクエリできます。
- 現在のアクティブなデスクを取得するには、現在のデスク ID を取得し、
deskUuidプロパティをbaseDesk変数に格納します。
let baseDesk;
chrome.runtime.sendMessage("oagemgapjncacjdaockjfaidedggjond", {
"messageType": "GetActiveDesk",
},
function(response) {
console.log(response);
if(response && response.operands) {
baseDesk = response.operands.deskUuid;
}
}
);
5. デスクを起動する
LaunchDesk API を使用すると、ウェブページで空のデスクをプログラムで起動して切り替えることができます。
デスクを起動する手順は次のとおりです。
testという名前のデスクを起動します。- デスクの
deskUuidプロパティを格納するnewDesk1変数を作成します。
let newDesk1;
chrome.runtime.sendMessage(
"oagemgapjncacjdaockjfaidedggjond", {
"messageType": "LaunchDesk",
"operands": {
"deskName": "test"
}
},
function(response) {
console.log(response);
if(response&&response.operands) {
newDesk1 = response.operands.deskUuid;
}
}
);
新しくなったデスクに移動します。同時に最大 8 つのデスクを作成できます。API から DesksCountCheckFailedError エラーが返された場合は、追加を開始する前に一部のデスクを削除する必要があります。
6. デスクを削除する
RemoveDesk API を使用すると、ウェブページをデスク ID でプログラムで削除できます。デスクのすべてのウィンドウを閉じることができます。
わかりやすくするために、新しく起動したデスクを削除します。しかし実際には、ウェブページはデスク ID で指定されたすべてのデスクを削除できます。
デスクを削除する手順は次のとおりです。
- 新しく立ち上げたデスクを削除します。
chrome.runtime.sendMessage("oagemgapjncacjdaockjfaidedggjond", {
"messageType": "RemoveDesk",
"operands": {
"deskId": newDesk1
}
},
function(response) {
console.log(response);
}
);
- 削除の確認または放棄を求めるダイアログで、デスクの削除を確定します。デスクのすべてのウィンドウを閉じます。
- 確認ウィンドウなしで API を呼び出してデスクを削除するには、
skipConfirmationパラメータを使用します。
chrome.runtime.sendMessage("oagemgapjncacjdaockjfaidedggjond", {
"messageType": "RemoveDesk",
"operands": {
"deskId": newDesk1,
"skipConfirmation":true
}
},
function(response) {
console.log(response);
}
);
7. 別のデスクに切り替える
SwitchDesk API を使用すると、ウェブページを指定されたデスクにプログラムで切り替えることができます。
わかりやすくするため、デスクを起動して前のデスクに切り替える。ただし実際には、ウェブページはデスク ID で指定されたデスクに切り替えることができます。
別のデスクに切り替える手順は次のとおりです。
- デスクを起動する:
let newDesk1;
chrome.runtime.sendMessage(
"oagemgapjncacjdaockjfaidedggjond", {
"messageType": "LaunchDesk",
"operands": {
"deskName": "test"
}
},
function(response) {
console.log(response);
if(response && response.operands) {
newDesk1 = response.operands.deskUuid;
}
}
);
- 前のデスクに切り替えます。
chrome.runtime.sendMessage("oagemgapjncacjdaockjfaidedggjond", {
"messageType": "SwitchDesk",
"operands": {
"deskId": baseDesk
}
},
function(response) {
console.log(response);
}
);
8. 完了
これで完了です。Desk Connector Demo 拡張機能と Chrome DevTools を使用して、ウェブページから ChromeOS Desk にプログラムでアクセスする方法を学びました。