회사에서 진행하고 있는 웹툰 어플리케이션 구현 중 한 가지 요청을 받았다.

그건 바로 “iOS에서 캡처를 방지하였으면 좋겠다.”

그 전까지는 iOS에서는 캡처를 금지하는 것은 불가능하고, 캡처를 감지할 수만 있다고 생각하고 있었지만 클라이언트 분이 레퍼런스를 전달해주셔서 확인해볼 수 있었다.

내가 전달받은 레퍼런스는 아래 내용이었다.

💡 카카오웹툰, 넷플릭스 앱과 같이 흰 배경으로 캡처가 되었으면 좋겠습니다.

레퍼런스가 있다 = 방법이 있다

물론 Android와 같이 캡처를 아예 금지하는 것이 아닌, 다른 이미지가 저장되도록 하는 것이지만 어쨌든 방법이 있는거니 바로 레퍼런스를 확인해봤다.

넷플릭스

넷플릭스 앱의 경우 위와 같이 검은색 화면이 캡처된다.

카카오웹툰

카카오웹툰의 경우 이미지를 하얀색으로 만들고, 저작권 법적 고지 안내를 표시한다.

특이한 점은 두 앱 모두 일부 영역만 가려지고, 모든 UI가 가려지지는 않는다는 점이었다.

레퍼런스를 토대로 서칭하기

위 레퍼런스 앱들을 확인하고 어떤 방법으로 구현할 수 있을지 서칭해봤는데, 바로 찾을 수 있는 내용은 아래 2가지의 내용이었다.

1. “iOS는 기본적으로 캡처 방지가 불가하다.”

2. “위 레퍼런스와 같이 화면 일부 영역을 캡처 시 안보이게 만드는 상용 라이브러리가 있다.”

위 2가지 정보를 취합해서 나오는 결론은 아래 결론이었다.

iOS는 기본적으로 캡처 방지가 불가하지만, 일부 영역을 캡처 시 안보이게 할 수 있는 상용 라이브러리가 있다.

방법이 없는데 어떻게 만듦? 🤔

왠지 잘 찾아보면 방법을 찾아낼 수 있을 것 같아서 여러 가설을 세워봤다.

가설 세우기

첫번째 가설, 캡처를 감지해서 새로운 View를 띄운다.

결론: 실패 😥

가장 먼저 떠올린 단순한 방법이다. 여기서 되면 너무 좋았을탠데..

iOS는 NotificationCenter를 통해 캡처 이벤트를 감지할 수 있다.

하지만 문제는 이미지가 저장된 후 해당 이벤트가 실행된다는 것..

두번째 가설, 앱이 백그라운드로 갔을 때 새로운 View를 띄운다.

결론: 실패 😥

캡처가 될 때는 일정 시간 화면이 멈추고, 백그라운드 상태로 갈거라 생각해서 시도해봤다.

결과는 실패..

두번째 가설까지 시도 후 멘탈이 나가버린 상태에서 다시 한 번 stackoverflow를 뒤져보다가 아래 글을 찾았다.

Prevent screen capture in an iOS app

그 중 내 눈길을 끄는 첫 번째 답변

비밀번호를 입력하는 UITextField는 캡처 시 캡처 이미지에 포함되지 않도록 처리가 된다.

해당 방법을 사용해서 UITextField를 UIView에 추가해서 캡처 시 화면을 가려버리는 방법이다.

이게 진짜 된다고? 🤔

그래도 시도해봐서 나쁠 것은 없으니 바로 해당 코드를 활용해 스플래시 화면이 캡처되지 않도록 적용해보았다.

???????

성공!! 🥳

위 이미지를 보면 디바이스에는 Splash Screen이 표시되고 있고, 아래 캡처된 이미지가 보이는 미리보기 화면에는 Splash Screen이 가려지고 메인 화면이 보이고 있다.

실제 적용해보니, 해당 View가 흰색으로 가려지거나 하는 것은 아니고 캡처 이미지에 포함되지 않는 방식인 것 같다.

해당 방식을 활용하여 흰색 배경의 View를 만들어두고, 그 위에 위 답변을 토대로 구현한 SecureImageView를 얹어 캡처 시 흰색 화면이 캡처되도록 처리하였다.

결론

중요한 건 꺾이지 않는 마음 😊

사실 그보다 더 중요한건 원하는 요소를 바로 찾아낼 수 있는 서칭 능력이 아닐까..

바로 찾았으면 시간이 많이 세이브 되었을탠데 그 부분에 대한 아쉬움은 좀 남는다.

앱에 적용하실 분들을 위해서 Github Gist 에 ImageView 구현을 업로드해두었으니, 제가 낭비한 시간만큼 다른 분들은 시간을 세이브하시길..

React Native로 개발된 앱에 적용한 파일이어서 일부 수정은 필요하니, 사용 전 참고바람.

원래는 바로 사용 가능하게끔 라이브러리로 구현해서 공개하려 했으나 현업이 바쁜 관계로 조만간 준비해서 돌아올 예정..