iPhone 또는 iPad에 설치된 단축어 앱의 웹 페이지에서 JavaScript 실행 동작 개요
거의 모든 웹 페이지는 웹 브라우저에서 애니메이션, 대화식 메뉴, 비디오 재생 등의 다이내믹한 효과를 만드는 프로그래밍 언어인 JavaScript를 사용하여 스크립트가 작성됩니다. 일반적으로 사용자가 웹 사이트를 볼 때는 JavaScript가 노출되지 않습니다. ‘웹 페이지에서 JavaScript 실행’ 동작을 포함하는 단축어를 빌드하고 Safari 앱에서 단축어를 실행하면, 웹 페이지의 JavaScript를 제어할 수 있습니다.
웹 페이지에서 사용자 설정 JavaScript를 실행하는 단축어를 다양하게 활용할 수 있습니다. 예를 들어 웹 페이지에서 특정 데이터를 가져오고 작업에 해당 데이터를 통합하는 단축어를 생성할 수 있습니다(예: 수업 시간표를 추출하여 캘린더 앱에 추가하기, 소셜 미디어 그룹의 구성원 데이터를 추출하여 스프레드시트에 추가하기).
웹 페이지의 텍스트 서체를 바꾸거나 비디오 재생 속도를 변경하는 등의 웹 페이지를 수정하는 단축어를 생성할 수 있습니다. 단축어에서 JavaScript를 실행하려면 먼저 해당 설정을 활성화해야 합니다. iPhone 또는 iPad에 설치된 단축어 앱의 고급 개인 정보 보호 및 보안 설정를 참조하십시오.
웹 페이지에서 JavaScript를 실행하는 단축어 사용에 대한 추가 정보를 보려면 iPhone 또는 iPad에 설치된 단축어 앱의 웹 페이지에서 JavaScript 실행 동작 사용하기를 참조하십시오.
웹 페이지 데이터 가져오기에 관하여
‘웹 페이지에서 JavaScript 실행’ 동작은 특정 조건에 일치하는 모든 요소를 가져오고 이러한 요소를 반복하여 데이터와의 작업을 수행함으로써(또는 요소를 추가 검사함으로써) 사용자가 웹 페이지에서 데이터를 가져올 수 있도록 합니다.
예를 들어 웹 페이지에서 모든 이미지 요소 목록을 생성하려면 다음을 사용하십시오.
var elements = document.querySelectorAll("img");
또 예를 들어 ‘post’ 클래스가 있는 모든 요소를 가져오려면 다음을 사용하십시오.
var elements = document.querySelectorAll(".post");
NodeList가 생성되면 다음과 같은 코드를 사용하여 요소들을 반복(요소를 추가로 필터링하거나 데이터 구조에 요소를 추가하여)할 수 있습니다.
var elements = ...;
for (let element of elements) {
// ...
}
웹 페이지 질의 결과에 대한 추가 정보를 보려면 https://developer.mozilla.org/Selectors 및 https://developer.mozilla.org/SelectorAll 사이트를 참조하십시오.
‘웹 페이지에서 JavaScript 실행’ 동작 입력
‘웹 페이지에서 JavaScript 실행’ 동작에 대한 입력은 활성 상태의 Safari 웹 페이지에 있어야 합니다. 이는 공유 시트(특히 Safari, SFSafariViewController 또는 ASWebAuthenticationSession에서)의 단축어를 실행해야 함을 의미합니다.
단축어가 공유 시트에서 실행되면 Safari 앱에서의 입력은 단축어의 첫 번째 동작으로 전달됩니다.
‘웹 페이지에서 JavaScript 실행’ 동작으로 전달되는 입력은 반드시 Safari 웹 페이지여야 하지만, 매직 변수를 사용하여 동작에 데이터를 추가로 삽입할 수 있습니다. 예를 들어 갤러리에서 사용할 수 있는 비디오 재생 속도 변경 단축어는 웹 페이지의 비디오를 수정하는 동작인 웹 페이지에서 JavaScript 실행 동작을 포함합니다. 비디오 재생 속도는 속도 변수로 제어할 수 있습니다.
Safari에서 단축어 실행하기에 관한 추가 정보를 보려면 iPhone 또는 iPad에 설치된 다른 앱에서 단축어 실행하기를 참조하십시오.
‘웹 페이지에서 JavaScript 실행’ 동작 출력
데이터를 반환하려면 completion(result)
와 같은 JavaScript에서 컴플리션 핸들러를 호출해야 합니다. JavaScript는 대게 비동기식 패턴으로 사용되므로 호출은 의도적으로 동기화되지 않습니다. 이렇게 하여 비동기적으로 동작을 완료할 수 있습니다. 예를 들어 다음 코드를 사용할 수 있습니다.
window.setTimeout(function() {
completion(true);
}, 1000);
‘웹 페이지에서 JavaScript 실행’ 동작의 출력은 다음과 같은 유효한 JSON 데이터 유형이 될 수 있습니다.
문자열
숫자
불리언(참 또는 거짓)
배열(다른 모든 유효한 JSON 유형을 포함)
사전(다른 모든 유효한 JSON 유형을 포함)
Null
정의되지 않음
단축어 앱은 반환 값을 자동으로 인코딩 및 디코딩하여 JavaScript와 단축어 앱 간에 통신합니다. 이는 사용자가 컴플리션 핸들러를 호출하기 전에 JSON.stringify(result)
를 호출하지 않아도 됨을 의미합니다.
반환 값이 JSON이므로 어떤 반환 값은 제대로 동작하지 않을 수 있습니다. 예를 들어 함수 또는 노드에 JSON으로 인코딩된 유용한 표현이 없을 수 있습니다. 이러한 경우 필요한 JSON 호환 값을 포함하는 배열/사전을 생성할 것을 권장합니다.
참고: JavaScript의 객체는 사전이므로 기본 객체는 JSON으로 변환됩니다.
‘웹 페이지에서 JavaScript 실행’ 동작에서 아무 데이터도 반환하지 않으려는 경우, 함수 내에 변수가 없는 completion()
을 호출할 수 있습니다(undefined
가 유효한 출력이기 때문에). 이는 completion(undefined)
를 호출하는 것과 동일합니다.
JSON에 관한 추가 정보를 보려면, iPhone 또는 iPad에 설치된 단축어 앱의 JSON 사용 개요를 참조하십시오.
노드에 대한 추가 정보를 보려면 https://developer.mozilla.org/Node 사이트를 참조하십시오.
함수에 대한 추가 정보를 보려면 https://developer.mozilla.org/Functions 사이트를 참조하십시오.
‘웹 페이지에서 JavaScript 실행’ 동작 시간 제한
Safari의 모든 JavaScript 확장 프로그램처럼 ‘웹 페이지에서 JavaScript 실행’ 동작은 시간 제한이 적용되어 가능한 빠르게 수행되어야 합니다. 아래와 같이 동기 함수를 사용하는 JavaScript는 시간 안에 수행되지 못할 수 있습니다.
window.alert()
window.prompt()
window.confirm()
몇 초 간의 시간 제한. 예:
window.setTimeout(function() { completion(); }, 5000);
JavaScript가 시간 제한을 초과한 경우, 단축어를 실행하면 실행을 완료하지 못하고 JavaScript 시간 제한 오류 메시지가 표시됩니다.
구문 및 런타임 오류 처리하기
Safari에서 지원하는 모든 구문을 사용하여 웹 페이지에서 JavaScript 실행 동작에 JavaScript를 쓸 수 있습니다.
단축어 앱에서 ‘웹 페이지에서 JavaScript 실행’ 동작은 사용자가 Safari 확장 프로그램에서 단축어를 실행하기 전에 기본 구문 검사를 수행하여 오류를 찾습니다.
텍스트 필드에 스크립트를 입력하면 구문이 하이라이트되어 해당 JavaScript의 유효성 여부를 확인할 수 있습니다. 예를 들어 문자열 끝에 물음표를 넣는 것을 잊은 경우, 해당 문자열 이후의 모든 텍스트가 하이라이트됩니다.
스크립트의 구문은 유효하지만 런타임 오류가 있는 경우, ‘웹 페이지에서 JavaScript 실행’ 동작이 예외를 잡아 표시합니다. 예를 들어 스크립트가 존재하지 않는 변수 또는 함수를 참조하는 경우(예: shortcuts.completion()
), 런타임에 오류가 표시됩니다.