Cầu nối JavaScript iOS

Tôi đang làm việc trên một ứng dụng mà tôi sẽ sử dụng cả HTML5 trong UIWebView và khung iOS gốc cùng nhau. Tôi biết rằng tôi có thể triển khai giao tiếp giữa JavaScript và Objective-C. Có thư viện nào đơn giản hóa việc triển khai giao tiếp này không? Tôi biết rằng có một số thư viện để tạo ứng dụng iOS gốc bằng HTML5 và javascript (ví dụ: AppMobi, PhoneGap), nhưng tôi không chắc liệu có thư viện nào giúp tạo ứng dụng iOS gốc sử dụng nhiều JavaScript hay không. Tôi cần phải:

1. Thực thi các phương thức JS từ Objective-C
2. Thực thi các phương thức Objective-C từ JS
3. Nghe các sự kiện JS gốc từ Objective-C (ví dụ: sự kiện DOM sẵn sàng)

Có một vài thư viện, nhưng tôi đã không sử dụng bất kỳ thư viện nào trong số này trong các dự án lớn, vì vậy bạn có thể muốn thử chúng:

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

-

Tuy nhiên, tôi nghĩ đó là một cái gì đó đủ đơn giản để bạn có thể tự mình thử. Cá nhân tôi đã làm chính xác điều này khi tôi cần làm điều đó. Bạn cũng có thể tạo một thư viện đơn giản phù hợp với nhu cầu của mình.

1. Thực thi các phương thức JS từ Objective-C

Đây thực sự chỉ là một dòng mã.

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

Thông tin chi tiết về Tài liệu UIWebView chính thức .

2. Thực thi các phương thức Objective-C từ JS

Điều này không may là phức tạp hơn một chút, bởi vì không có cùng thuộc tính windowScriptObject (và lớp) tồn tại trên Mac OSX cho phép giao tiếp hoàn chỉnh giữa cả hai.

Tuy nhiên, bạn có thể dễ dàng gọi từ các URL tùy chỉnh của javascript, như:

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

Và chặn nó khỏi Objective-C bằng cách:

- (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
   } 
}

Điều này không phải là sạch như nó phải được (hoặc bằng cách sử dụng windowScriptObject) nhưng nó hoạt động.

3. Nghe các sự kiện JS gốc từ Objective-C (ví dụ: sự kiện DOM sẵn sàng)

Từ phần giải thích trên, bạn thấy rằng muốn làm được điều đó thì bạn phải tạo một đoạn mã JavaScript nào đó, gắn nó vào sự kiện mà bạn muốn theo dõi và gọi chính xác window.locationcuộc gọi mới được chặn.

Một lần nữa, không phải là sạch như nó phải được, nhưng nó hoạt động.

Phương pháp đề xuất để gọi mục tiêu c từ JS trong câu trả lời được chấp nhận không được khuyến nghị. Một ví dụ về vấn đề: nếu bạn thực hiện hai cuộc gọi liên tiếp ngay lập tức, một cuộc gọi bị bỏ qua (bạn không thể thay đổi vị trí quá nhanh).

Tôi đề xuất phương pháp thay thế sau:

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

Bạn gọi executehàm lặp đi lặp lại và vì mỗi lệnh gọi thực thi trong iframe của chính nó, chúng sẽ không bị bỏ qua khi được gọi nhanh.

Tín dụng cho anh chàng này .

Cập nhật: Điều này đã thay đổi trong iOS 8. Câu trả lời của tôi áp dụng cho các phiên bản trước.

Một giải pháp thay thế, có thể khiến bạn bị từ chối khỏi cửa hàng ứng dụng, là sử dụng WebScriptObject.

Các API này công khai trên OSX nhưng không công khai trên iOS.

Bạn cần xác định giao diện cho các lớp bên trong.

@interface WebScriptObject: NSObject
@end

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

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

Bạn cần xác định đối tượng của mình sẽ phục vụ như là WebScriptObject của bạn

@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

Bây giờ đặt một phiên bản cho UIWebView của bạn

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"];
        }
    }
}

Bây giờ bên trong javascript của bạn, bạn có thể gọi:

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

Trong iOS8, bạn có thể xem WKWebView thay vì UIWebView . Nó có lớp sau: WKScriptMessageHandler: Cung cấp một phương thức để nhận thông báo từ JavaScript đang chạy trong một trang web.

Điều này có thể thực hiện được với iOS7, hãy kiểm tra http://blog.bignerdranch.com/3784-javascriptcore-and-ios-7/

Đặt cược tốt nhất của bạn là cung cấp Appcelerators Titanium. Họ đã xây dựng một cầu nối javascript obj-C bằng cách sử dụng công cụ V8 JavascriptCore được sử dụng bởi webkit. Nó cũng là mã nguồn mở, vì vậy bạn sẽ có thể tải xuống và sửa đổi Obj-C theo ý muốn.

Hãy xem dự án KirinJS: Kirin JS cho phép sử dụng Javascript cho logic ứng dụng và giao diện người dùng gốc phù hợp với nền tảng mà nó chạy.

Tôi đã tạo một thư viện như WebViewJavascriptBridge, nhưng nó giống JQuery hơn, dễ cài đặt hơn và dễ sử dụng hơn. Không dựa vào jQuery (mặc dù theo tín dụng của nó, tôi đã biết WebViewJavascriptBridge tồn tại trước khi viết bài này, tôi có thể chỉ hơi kìm lại trước khi đi sâu vào). Cho tôi biết bạn nghĩ gì! jockeyjs

Nếu bạn đang sử dụng WKWebView trên iOS 8, hãy xem XWebView có thể tự động hiển thị giao diện gốc cho javascript.