Bridge JavaScript iOS

Sto lavorando a un'app in cui userò sia HTML5 in UIWebView che il framework iOS nativo insieme. So di poter implementare la comunicazione tra JavaScript e Objective-C. Esistono biblioteche che semplificano l'implementazione di questa comunicazione? So che ci sono diverse librerie per creare app iOS native in HTML5 e javascript (ad esempio AppMobi, PhoneGap), ma non sono sicuro che esista una libreria per creare app iOS native con un utilizzo intenso di JavaScript. Ho bisogno di:

1. Esegui metodi JS da Objective-C
2. Esegui metodi Objective-C da JS
3. Ascolta eventi JS nativi da Objective-C (ad esempio evento pronto per DOM)

Ci sono alcune librerie, ma non ho usato nessuna di queste in grandi progetti, quindi potresti volerle provare:

• WebViewJavascriptBridge: https://github.com/marcuswestin/WebViewJavascriptBridge
• GAJavaScript: https://github.com/newyankeecodeshop/GAJavaScript

-

Tuttavia, penso che sia qualcosa di abbastanza semplice che potresti provarlo tu stesso. Personalmente ho fatto esattamente questo quando avevo bisogno di farlo. Potresti anche creare una semplice libreria adatta alle tue esigenze.

1. Eseguire i metodi JS da Objective-C

Questa è davvero solo una riga di codice.

NSString *returnvalue = [webView stringByEvaluatingJavaScriptFromString:@"your javascript code string here"];

Maggiori dettagli sulla documentazione ufficiale di UIWebView .

2. Eseguire i metodi Objective-C da JS

Questo è purtroppo leggermente più complesso, perché non esiste la stessa proprietà (e classe) windowScriptObject che esiste su Mac OSX che consente la comunicazione completa tra i due.

Tuttavia, puoi facilmente chiamare da URL personalizzati javascript, come:

window.location = yourscheme://callfunction/parameter1/parameter2?parameter3=value

E intercettalo da Objective-C con questo:

- (BOOL)webView:(UIWebView*)webView shouldStartLoadWithRequest:(NSURLRequest*)request navigationType:(UIWebViewNavigationType)navigationType {
   NSURL *URL = [request URL]; 
   if ([[URL scheme] isEqualToString:@"yourscheme"]) {
       // parse the rest of the URL object and execute functions
   } 
}

Non è così pulito come dovrebbe essere (o usando windowScriptObject) ma funziona.

3. Ascolta eventi JS nativi da Objective-C (ad esempio evento pronto per DOM)

Dalla spiegazione sopra, vedi che se vuoi farlo, devi creare del codice JavaScript, allegarlo all'evento che vuoi monitorare e chiamare la window.locationchiamata corretta per essere poi intercettato.

Di nuovo, non è pulito come dovrebbe essere, ma funziona.

Il metodo suggerito per chiamare l'obiettivo c da JS nella risposta accettata non è raccomandato. Un esempio di problemi: se effettui due chiamate consecutive immediate, una viene ignorata (non puoi cambiare posizione troppo velocemente).

Raccomando il seguente approccio alternativo:

function execute(url) 
{
  var iframe = document.createElement("IFRAME");
  iframe.setAttribute("src", url);
  document.documentElement.appendChild(iframe);
  iframe.parentNode.removeChild(iframe);
  iframe = null;
}

Chiami la executefunzione ripetutamente e poiché ogni chiamata viene eseguita nel proprio iframe, non dovrebbero essere ignorate se chiamate rapidamente.

Crediti a questo ragazzo .

Aggiornamento: questo è cambiato in iOS 8. La mia risposta si applica alle versioni precedenti.

Un'alternativa, che potrebbe farti rifiutare dall'App Store, è usare WebScriptObject.

Queste API sono pubbliche su OSX ma non su iOS.

È necessario definire le interfacce per le classi interne.

@interface WebScriptObject: NSObject
@end

@interface WebView
- (WebScriptObject *)windowScriptObject;
@end

@interface UIWebDocumentView: UIView
- (WebView *)webView;
@end

Devi definire il tuo oggetto che servirà come WebScriptObject

@interface WebScriptBridge: NSObject
- (void)someEvent: (uint64_t)foo :(NSString *)bar;
- (void)testfoo;
+ (BOOL)isKeyExcludedFromWebScript:(const char *)name;
+ (BOOL)isSelectorExcludedFromWebScript:(SEL)aSelector;
+ (WebScriptBridge*)getWebScriptBridge;
@end

static WebScriptBridge *gWebScriptBridge = nil;

@implementation WebScriptBridge
- (void)someEvent: (uint64_t)foo :(NSString *)bar
{
    NSLog(bar);
}

-(void)testfoo {
    NSLog(@"testfoo!");
}

+ (BOOL)isKeyExcludedFromWebScript:(const char *)name;
{
    return NO;
}

+ (BOOL)isSelectorExcludedFromWebScript:(SEL)aSelector;
{
    return NO;
}

+ (NSString *)webScriptNameForSelector:(SEL)sel
{
    // Naming rules can be found at: https://developer.apple.com/library/mac/documentation/Cocoa/Reference/WebKit/Protocols/WebScripting_Protocol/Reference/Reference.html
    if (sel == @selector(testfoo)) return @"testfoo";
    if (sel == @selector(someEvent::)) return @"someEvent";

    return nil;
}
+ (WebScriptBridge*)getWebScriptBridge {
    if (gWebScriptBridge == nil)
        gWebScriptBridge = [WebScriptBridge new];

    return gWebScriptBridge;
}
@end

Ora imposta un'istanza su UIWebView

if ([uiWebView.subviews count] > 0) {
    UIView *scrollView = uiWebView.subviews[0];

    for (UIView *childView in scrollView.subviews) {
        if ([childView isKindOfClass:[UIWebDocumentView class]]) {
            UIWebDocumentView *documentView = (UIWebDocumentView *)childView;
            WebScriptObject *wso = documentView.webView.windowScriptObject;

            [wso setValue:[WebScriptBridge getWebScriptBridge] forKey:@"yourBridge"];
        }
    }
}

Ora all'interno del tuo javascript puoi chiamare:

yourBridge.someEvent(100, "hello");
yourBridge.testfoo();

In iOS8 puoi guardare WKWebView invece di UIWebView . Ha la seguente classe: WKScriptMessageHandler: fornisce un metodo per ricevere messaggi da JavaScript in esecuzione in una pagina web.

Questo è possibile con iOS7, controlla http://blog.bignerdranch.com/3784-javascriptcore-and-ios-7/

La soluzione migliore è l'offerta di Appcelerators Titanium. Hanno già costruito un ponte javascript Obj-C utilizzando il motore V8 JavascriptCore utilizzato da webkit. È anche open source, quindi potrai scaricarlo e armeggiare con Obj-C come preferisci.

Dai uno sguardo al progetto KirinJS: Kirin JS che permette di utilizzare Javascript per la logica dell'applicazione e UI nativa adeguata alla piattaforma su cui gira.

Ho creato una libreria come WebViewJavascriptBridge, ma è più simile a JQuery, è più facile da configurare ed è più facile da usare. Non si basa su jQuery (anche se a suo merito, se avessi saputo che WebViewJavascriptBridge esisteva prima di scrivere questo, potrei essermi trattenuto leggermente prima di immergermi). Fatemi sapere cosa ne pensate! jockeyjs

Se stai usando WKWebView su iOS 8, dai un'occhiata a XWebView che può esporre automaticamente l'interfaccia nativa a javascript.