16.02.2025

Comunicação Entre JavaScript e Objective-C em Aplicações iOS

Visão Geral

A interação entre JavaScript e iOS é facilitada pelo WKWebView, que permite estabelecer uma conexão entre JavaScript e Swift/Objective-C. Um papel importante nesse processo é desempenhado pelo WKScriptMessageHandler, que assegura a troca de mensagens.

Código de Configuração em Swift:

import WebKit

class ViewController: UIViewController, WKScriptMessageHandler {
    var webView: WKWebView!

    override func viewDidLoad() {
        super.viewDidLoad()

        let config = WKWebViewConfiguration()
        config.userContentController.add(self, name: "callbackHandler")

        webView = WKWebView(frame: .zero, configuration: config)
        webView.load(URLRequest(url: URL(string: "sua_URL")!))
        view = webView
    }

    func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
        if message.name == "callbackHandler" {
            // Processar mensagem do JavaScript
        }
    }
}

Chamada em JavaScript:

function triggerNative() {
    window.webkit.messageHandlers.callbackHandler.postMessage('Mensagem para o Nativo');
}

Aqui, uma interação eficiente é garantida pelo uso do método add() no lado Swift e postMessage() no JavaScript para a troca de dados.

Executando Cenários Complexos

Usando Bibliotecas de Ponte

Em projetos que utilizam intensamente JavaScript, é eficaz usar bibliotecas como WebViewJavascriptBridge ou GAJavaScript para estabelecer uma comunicação bidirecional robusta.

Chamadas Assíncronas: Ajuda Essencial

Chamadas assíncronas, especialmente em UIWebView, são tratadas utilizando uma técnica de iframe.

Compatibilidade com Sua Versão do iOS

Não se esqueça da compatibilidade com sua versão do iOS. WKWebView está disponível a partir do iOS 8.

Rastreamento de Eventos JavaScript

Crie esquemas de URL personalizados para rastrear chamadas e redirecioná-las para o código nativo.

Interagindo com JavaScriptCore

Para iOS 7 e superior, prefira usar o framework JavaScriptCore para acesso direto à funcionalidade do JavaScript.

Segurança em Primeiro Lugar

Evite utilizar APIs privadas e adira às diretrizes do Web Scripting Protocol para prevenir que seu aplicativo seja removido da App Store.

Problemas ao Usar Ponte JavaScript

Comunicando com Objetos Personalizados

Permita que o JavaScript interaja com seu código através de objetos personalizados usando webView.setValue:forKey:.

Projeto Bilíngue? É Simples!

Crie uma interface amigável para a interação entre Swift/Objective-C e JavaScript.

Gerenciamento de Memória

Lembre-se de monitorar o uso de memória; caso contrário, a troca de mensagens e objetos entre os ambientes pode causar sobrecarga.

Abordagem de Desenvolvimento de Aplicações Híbridas

Desenvolva uma aplicação híbrida que combine HTML5 e frameworks nativos do iOS.

Visualização

Vamos imaginar o mundo do JavaScript como 🌐 (Terra da Web) e o ambiente nativo do iOS como 📱 (Ilha do iOS).

"Construir" uma ponte (ponte de comunicação 🌉):
- Departamento de construção: código JavaScript
- Objetivo final: funções nativas do iOS

Processo de construção da ponte: 🌐 (código JS) 🚧 -> (Ponte) 🚀 <- 🚧 (Objective-C/Swift)

Resultado: 🌐 (JS) ↔️ 🌉 ↔️ 📱 (funções iOS) - interação perfeita

Conclusão

Executando JavaScript em Tempo Real

Use evaluateJavaScript(_:completionHandler:) para interação dinâmica com JS.

Passando Dados para o JavaScript

Use postMessage, convertendo objetos em strings com JSON para facilitar a transmissão.

Tratamento de Erros

Assegure um sistema confiável de tratamento de erros em seu código JavaScript.

Recursos Úteis

1. Documentação do WKWebView da Apple — tudo que você precisa saber sobre WKWebView.
2. GitHub - marcuswestin/WebViewJavascriptBridge — para um entendimento mais profundo sobre a troca de mensagens.
3. WKWebView no NSHipster — uma análise detalhada do WKWebView.
4. Construindo uma Ponte em JavaScript — uma abordagem simplificada para a construção de pontes.
5. Dúvidas sobre WKWebView — um hub para discussões de programação.
6. Transição para WKWebView — como garantir uma integração suave do WKWebView em sua aplicação.

Video

Navigation