How to call Objective-C from Javascript?

Question

I have a WebView, and I want to call a view in Objective-C from JavaScript. Does someone know how I can do this?

I have this code in my ViewController:

- (BOOL)webView:(UIWebView *)webView2 
 shouldStartLoadWithRequest:(NSURLRequest *)request 
 navigationType:(UIWebViewNavigationType)navigationType {

 NSString *requestString = [[request URL] absoluteString];
 NSArray *components = [requestString componentsSeparatedByString:@":"];

 if ([components count] > 1 && 
  [(NSString *)[components objectAtIndex:0] isEqualToString:@"myapp"]) {
  if([(NSString *)[components objectAtIndex:1] isEqualToString:@"myfunction"]) 
  {

   NSLog([components objectAtIndex:2]); [[Airship shared] displayStoreFront]; //<- This is the code to open the Store
   NSLog([components objectAtIndex:3]); // param2
   // Call your method in Objective-C method using the above...
  }
  return NO;
 }

 return YES; // Return YES to make sure regular navigation works as expected.
}

And in Javascript:

function store(event)
{
    document.location = "myapp:" + "myfunction:" + param1 + ":" + param2;
}

But nothing happens.

https://developer.apple.com/library/mac/#documentation/Cocoa/Conceptual/DisplayWebContent/Tasks/JavaScriptFromObjC.html Have you tried this URL ? — Kamleshwar, Sep 26 '12 at 10:03
possible duplicate of [How to invoke Objective C method from Javascript and send back data to Javascript in iOS?](http://stackoverflow.com/questions/9826792/how-to-invoke-objective-c-method-from-javascript-and-send-back-data-to-javascrip) — zekel, Dec 09 '13 at 14:46
a detailed example of Sixten Otto's response here: http://stackoverflow.com/questions/21927612/call-objective-c-method-from-javascript/25465329#25465329 — Fusion Radio Dev, Aug 23 '14 at 19:13

score 52 · Answer 1 · answered Nov 02 '09 at 18:05

52

The standard workaround for UIWebView is to set a UIWebViewDelegate, and implement the method webView:shouldStartLoadWithRequest:navigationType:. In your JavaScript code, navigate to some fake URL that encodes the information you want to pass to your app, like, say:

window.location = "fake://myApp/something_happened:param1:param2:param3";

In your delegate method, look for these fake URLs, extract the information you need, take whatever action is appropriate, and return NO to cancel the navigation. It's probably best if you defer any lengthy processing using some flavor of performSelector.

answered Nov 02 '09 at 18:05

Sixten Otto

14,816
3
48
60

The problem for this solution is that if "fake//..." fails to load, webview:shouldStartLoadWithRequest:navigationType: will not be called. Any way to fix it? – Chilly Zhong Feb 07 '12 at 12:46
1

What would cause it to fail before `webview:shouldStartLoadWithRequest:navigationType:` is called? (The whole point of this callback is that it happens *before* the system begins any network loading, etc.) – Sixten Otto Feb 09 '12 at 20:47
4

I recommend [serializing the data you're passing in the URL as JSON](http://stackoverflow.com/a/9827105/168594), it makes things much more flexible. – zekel Mar 23 '12 at 17:47
You can just call the native methods from js by cordova.exec(function(success){ alert('success'); console.log(success); }, function(fail){ console.log(fail); }, '','',[]); and add this line to config.xml – Darshan Mothreja Jan 20 '16 at 14:35
Nothing about the question presumes that the application is using Cordova, but if you are, and they provide a helper function for this, that's handy. – Sixten Otto Jan 20 '16 at 20:30

talkol · Answer 2 · 2012-11-29T10:18:34.007

The window.location method of calling objective c from JS isn't recommended. One example of problems: if you make two immediate consecutive calls one is ignored (since you can't change location too quickly) - try it yourself..

I recommend the following alternative approach:

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

You call the execute function repeatedly and since each call executes in its own iframe, they should not be ignored when called quickly.

Credits to this guy.

Why should we assign `null` to `iframe` at the last line? (It doesn't enforce garbage collection or give any other profit) — artyom.stv, Sep 13 '13 at 13:37

score 4 · Answer 3 · edited May 13 '13 at 12:28

4

Obliviux,

Your code seems to be perfect.

The reason for the problem is that you must have missed to map the delegate.

Either

Connect the delegate of the webView to the file owner in the .xib file

or

Use webView.delegate = self;

in your viewDidLoad.

Thanks

edited May 13 '13 at 12:28

DD_

7,230
11
38
59

answered Oct 22 '11 at 07:28

sm abbas

1,008
12
13

score 3 · Answer 4 · answered Sep 20 '10 at 03:16

3

Like people said here, you have to use the method webView:shouldStartLoadWithRequest:navigationType: from the UIWebviewDelegate.

This api http://code.google.com/p/jsbridge-to-cocoa/ does it for you. It is very lightweight. You can pass images, strings and arrays from javascript to objective-C.

answered Sep 20 '10 at 03:16

John

31
1

You may have to edit your answer, since its not possible to send images from javascript to objective c. The example that you have shown is just passing the id of the images from javascript to objective c by window.location way. Also, the images are in the local main bundle. – Easwaramoorthy Kanagaraj Mar 15 '13 at 16:07

Guillermo Barbero · Answer 5 · 2012-09-06T09:30:19.640

2

I had an issue with this approach: I wanted to send several messages to the iphone device, but it seemed that they were "overlaped" as they could not process all of them sequentially.

Example: when executing this code:

window.location = "app://action/foo";
window.location = "app://action/bar";

The action foo was never executed.

What I had to do was the following:

waitingForMessage = false;

function MsgProcessed(){
    waitingForMessage = false;
}

function SyncLaunchURL(url){
    if (waitingForMessage){
        setTimeout(function(){SyncLaunchURL(url)},100);
    }else{
        window.location = url
        waitingForMessage = true;   
    }
}

SyncLaunchURL("app://action/foo");
SyncLaunchURL("app://action/bar");

With this approach, the iphone has to call MsgProcessed() after processing the call. This way works for me, and maybe helps someone with the same problem!

edited Sep 06 '12 at 09:30

answered Sep 06 '12 at 09:20

Guillermo Barbero

21
2

it doesn't work if you just set window location asynchronously with `setTimeout`? – pqnet Sep 20 '12 at 10:20
You still have the problem that if the window.location has not been processed it drops that "location". – Guillermo Barbero Sep 26 '12 at 09:47
See my answer, it seems to solve this problem without polling or estimated delays.. The setTimeout solution isn't very elegant :) – talkol Nov 01 '12 at 11:55
1

Please don't do this. Listen to @talkol. – Bruno Bronosky Aug 25 '13 at 02:52

score 1 · Answer 6 · edited May 23 '17 at 11:59

1

Check this one - understanding XMLHttpRequest responses using this (or other javascript) functions?, it's using objective C to call ajax js function, and get the response after it's done, you know the trick is that webview will be triggered when you change the location in javascript, so you can check the location to know its your javascript call or the real request.

edited May 23 '17 at 11:59

Community

1
1

answered May 08 '12 at 13:00

Tom

4,612
4
32
43

Nosredna · Answer 7 · 2009-11-02T19:00:51.963

1

Assuming you're doing an app, you can look at how PhoneGap implements that (or even use it). It's a library that supports back-and-forth communication between JS and OBJ-C. There are other libraries and solutions, as well.

If you're talking about a web app (something the user gets to from Mobile Safari), you can't get to Objective-C from there.

edited Nov 02 '09 at 19:00

answered Nov 02 '09 at 17:52

Nosredna

83,000
15
95
122

score 0 · Answer 8 · answered Dec 19 '17 at 02:12

Although this is a very old question now, it keeps getting returned by Google and there is a good answer now: the WebScripting informal protocol. It allows you to expose an objective C object to Javascript.

http://developer.apple.com/library/safari/documentation/appleapplications/Conceptual/SafariJSProgTopics/Tasks/ObjCFromJavaScript.html#//apple_ref/doc/uid/30001215-BBCBFJCD

How to call Objective-C from Javascript?

8 Answers8

Linked

Related