외부의 웹페이지를 wkwebview 로 불러올 때, 앱에 설치된 커스텀 폰트로 표시되게 할 수 있나요?

WKWebView에서 외부 웹페이지를 로드할 때 앱에 설치된 커스텀 폰트를 사용하려면, 웹페이지에 추가된 CSS를 수정하여 커스텀 폰트를 적용할 수 있습니다. 이를 위해 다음 단계를 수행해야 합니다.

1. 앱에 커스텀 폰트 추가:
프로젝트에 커스텀 폰트 파일 (예: custom_font.ttf)을 추가하고, Info.plist에 해당 폰트를 등록해야 합니다. Info.plist에서 "Fonts provided by application" 항목을 추가하고, 배열에 폰트 파일 이름을 입력하세요.

2. 웹페이지에서 사용할 CSS 스타일 정의:
웹페이지의 스타일에 앱에 설치된 커스텀 폰트를 사용하려면, CSS를 정의해야 합니다. 예를 들어, 다음과 같이 커스텀 폰트를 정의할 수 있습니다.

@font-face {
  font-family: 'CustomFont';
  src: local('CustomFont');
}

body {
  font-family: 'CustomFont', sans-serif;
}

3. 웹페이지에 CSS 삽입:
WKWebView를 사용하여 외부 웹페이지를 로드한 후, 웹페이지에 CSS를 삽입해야 합니다. 이를 위해 WKUserScript를 사용하여 JavaScript 코드를 삽입할 수 있습니다.

import UIKit
import WebKit

class ViewController: UIViewController, WKNavigationDelegate {
    var webView: WKWebView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        let config = WKWebViewConfiguration()
        let source = """
        var style = document.createElement('style');
        style.type = 'text/css';
        style.innerHTML = `@font-face { font-family: 'CustomFont'; src: local('CustomFont'); } body { font-family: 'CustomFont', sans-serif; }`;
        document.head.appendChild(style);
        """
        let userScript = WKUserScript(source: source, injectionTime: .atDocumentEnd, forMainFrameOnly: true)
        config.userContentController.addUserScript(userScript)
        
        webView = WKWebView(frame: self.view.bounds, configuration: config)
        webView.navigationDelegate = self
        self.view.addSubview(webView)
        
        let url = URL(string: "https://example.com")
        let request = URLRequest(url: url!)
        webView.load(request)
    }
}

위 코드는 WKWebView에 커스텀 폰트를 적용하는 방법을 보여줍니다. WKUserScript를 사용하여 웹페이지에 CSS를 삽입하여 커스텀 폰트가 웹페이지에 적용되도록 합니다.

이렇게 하면 외부 웹페이지가 WKWebView로 로드될 때 앱에 설치된 커스텀 폰트로 표시됩니다.