WebView ceding rel=external links to Activity Manager

Question

I have a WebView wherein I would like anchor tags with rel=external to open in the Android browser but all other links to stay in the WebView.

So the content will load within the WebView if the user taps a link whose markup looks like this:

<a href="http://example.com/">Whatever</a>

But the content will load in the Android browser if the user taps a link whose markup looks like this:

<a href="http://example.com/" rel="external">Whatever</a>

Here's my relevant code (with one bit of pseudocode identified with a comment) in the WebViewClient code:

@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
    if (! rel=external) {   //  <-- That condition...how do I do that?
        view.loadUrl(url);
        return false;
    } else {
        Intent intent = new Intent(Intent.ACTION_VIEW);
        intent.setData(Uri.parse(url));
        startActivity(intent);
        return true;
    }

Would the best way to determine whether there is a rel=external attribute/value be to somehow use addJavascriptInterface() and have JavaScript inform Java whether or not there is a rel attribute and what the value is?

Or is there a better way?

(I am looking for a solution that does not involve checking the domain of the URL because there are an arbitrary number of domains that need to be treated as internal and that I cannot know in advance or determine easily on-the-fly.)

Answer 1

I think a variation of your original suggestion is probably best if you don't want to modify the existing URL.

Use addJavaScriptInterface to add a class to handle your external URL loading. An inner class might look like this:

public class JavaScriptInterface {
    public void viewExternalUrl(String url) {
        Intent intent = new Intent(Intent.ACTION_VIEW);
        intent.setData(Uri.parse(url));
        startActivity(intent);
        return true;
    }
}

And of course adding it:

webView.addJavascriptInterface(new JavaScriptInterface(), "Android");

Inject JavaScript to add click handlers to call your JavaScript interface after the page is loaded (using JQuery for simplicity's sake) through loadUrl. You can detect the page load finishing by creating a custom WebViewClient and overriding onPageFinished.

webView.setWebViewClient(new WebViewClient() {
    private static final String sJs = "javascript:" +
        Uri.encode("$('a[@rel$='external']').click(function(){ Android.viewExternalUrl($(this).attr('href')); });");

    @Override
    public void onPageFinished(WebView view, String url) {
        webView.loadUrl(sJs);
    }
}

I haven't tested any of this code, but it should work, assuming you have JQuery loaded in the page. If not, you can probably come up with some JavaScript to manipulate the DOM without it or you can use loadUrl to manually load JQuery first before the loading the JavaScript.

Note that this approach completely abandons any use of shouldOverrideUrlLoading

Answer 2

My suggestion is to use a different way of designating external URLs... one that embeds that info in the URL and hence is compatible with the shouldOverrideUrlLoading function. Specifically, create custom scheme URLs and pass the real page as a parameter:

myappname://external?url=encoded_real_page_url

Then in the shouldOverrideUrlLoading function check if it's a custom scheme URL, extract the url param, decode it and then redirect.

Answer 3

If you have control over the server side content, then definitely go with the suggestion Theo made. Since you indicate the pages should also load in standard browers, don't use a custom scheme, but make rel=external part of the actual url you're linking/redirecting to.

By doing that, you can easily parse the url parameter in shouldOverrideUrlLoading(WebView view, String url) and check for above key/value pair. I would suggest you parse it into a Uri and use getQueryParameter(key) to check for the value matching rel. If it's external, fire off an Intent.

It would look something like this:

@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
    Uri uri = Uri.parse(url);
    String relValue = uri.getQueryParameter("rel");    
    if (relValue != null && !relValue.equals("external")) {
        view.loadUrl(url);
        return false;
    }
    Intent intent = new Intent(Intent.ACTION_VIEW);
    intent.setData(uri);
    startActivity(intent);
    return true;
}

On a side note: no need to declare an 'else' since you already return from the method in the 'if'.

If users can go to any site using your WebView and if you're paranoid about other sites applying the same key/value pair for their purposes, you could easily add another check to determine whether the url is on 'your' domain.