1. 시작하기 전에
Desk Connector는 웹페이지에서 ChromeOS 가상 데스크에 프로그래매틱 방식으로 액세스할 수 있는 ChromeOS 기능입니다. 이 Codelab에서는 Chrome DevTools로 Desk 커넥터를 사용하는 방법을 알아봅니다.
기본 요건
- ChromeOS 가상 데스크에 관한 이해
학습할 내용
- 창 속성을 설정하는 방법
- 데스크를 실행하는 방법
- 데스크를 삭제하는 방법
- 활성 데스크를 사용하는 방법
- 다른 데스크로 전환하는 방법
필요한 항목
- Chromebook
- ChromeOS 버전 113.* 이상 아직 버전을 사용할 수 없는 경우 베타 채널로 전환하세요.
- Chrome
- 데스크 커넥터 데모 확장 프로그램
2. 설정
시작하려면 다음 단계를 수행합니다.
- 이 웹페이지를 마우스 오른쪽 버튼으로 클릭하고 검사를 클릭합니다.
- Chrome DevTools 패널에서 콘솔을 클릭합니다. Console 패널에서 이 Codelab의 모든 코드를 실행합니다.
- (선택사항) Codelab 전체에서
F3또는[]||를 눌러 개요 모드로 전환하여 가상 데스크와 수동으로 상호작용할 수 있습니다.
3. 창 속성 설정
SetWindowProperties API를 사용하면 웹페이지에서 창의 속성을 프로그래매틱 방식으로 설정할 수 있습니다. allDesks 속성을 true 값으로 설정하면 현재 탭의 창이 모든 데스크에 고정됩니다.
창 속성을 설정하려면 다음 단계를 따르세요.
- 콘솔 패널에서 창이 모든 데스크에 표시되도록 설정합니다.
chrome.runtime.sendMessage("oagemgapjncacjdaockjfaidedggjond", {
"messageType": "SetWindowProperties",
"operands": {
"allDesks": true
}
},
function(response) {
console.log(response);
}
);
- 창이 단일 데스크에 다시 표시되도록 설정합니다.
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. 축하합니다
축하합니다. 데스크 커넥터 데모 확장 프로그램 및 Chrome DevTools를 사용하여 웹페이지에 ChromeOS Desk에 프로그래매틱 액세스 권한을 부여하는 방법을 알아봤습니다.