iOS access to Safari Reader feature through UIWebView

Question

I am using iOS 4.3 & was wondering if there is any way that I can access the Safari's "Reader" feature through which webpages are removed of ads & other riff raff & the content takes the center stage.

If one opens any article in Safari (on say Wikipedia website), then a "Reader" button appears on the URL bar. Clicking on it presents a new window presenting the content beautifully.

How can I leverage this this functionality in iOS through UIWebView ?

PS: I know there is something called Readability Project. But I have no idea how to use this through UIWebView. Also for some websites Safari's Reader takes a call not to enable "Reader" feature, maybe it has no sufficient confidence?

Answer 1

Important: THIS ANSWER NO LONGER WORKS!

Readability shut down on September 30, 2016.

Here is something they recommend as a replacement: https://mercury.postlight.com/web-parser/

Keeping the answer as a historical reference

--- Original answer ---

You can use Readability mobilizer for this. You will get a cleaned up version of any article, in the Readability styling:

http://www.readability.com/m?url=http://{URLOFTHEARTICLE}

Just prepare the URL and load it in your UIWebView. Here is how it looks in action:

http://www.readability.com/m?url=http%3A%2F%2Fwww.cnn.com%2F2013%2F01%2F11%2Fshowbiz%2Ftv%2Fgolden-globes-tv-vineyard%2Findex.html%3Fhpt%3Dhp_abar

Answer 2

Apple is making a pretty big deal about the inclusion of "Reader" in iOS 5. I'm assuming by the noise it's not available in 4.3

re: How to use through UIWebView

• I can't find any mention of it in the Web Content Guide.
• There's nothing about it in the UIWebView class reference.
• And there's nothing in QA1630.

Answer 3

Dont parse HTML natively on iOS, I have done it before and its a messy business. Either create your own web service to do all the nasty work or look into using readability (readability.com) they provide an API. There is also an open source ruby, python and php readability port that you can find here

https://github.com/iterationlabs/ruby-readability

https://github.com/gfxmonk/python-readability

http://code.fivefilters.org/p/php-readability/source/tree/master/

For you ruby enthusiasts, readability is also available as a gem, just google it.

Answer 4

Actually reader button do a bit of analysis where it parse the HTML Page and then it sees a clear body tag to parse. If that plugin is able to extract the exact body it will enable the reader button (My understanding from the readability source code). Now to implement the same for webview you just need to embed java script in your code (this java script is already available in the readability source code) and then you can achieve the same effect.

But I suspect the future plan from apple for the same. Because they can not just let anyone else do this content extraction with the huge business opportunity associated with iCloud with the combination of readability.

If you want you can simple extract the HTML from UIWebView and then extract the body and use it for your purpose. It's not a very rocket science to extract.

For analysis point of view, just have randomly some 10 HTML pages with Reader button enabled, you will see the core cotent belongs to body only and rest of the add, header, footer are separated.

I believe this is the time to re-invent the web content we use, and this is the perfect example of doing the same.

Answer 5

You can even do this by injecting javascript.

#define readJS @"(function(){window.baseUrl='https://www.readability.com';window.readabilityToken='';var s=document.createElement('script');s.setAttribute('type','text/javascript');s.setAttribute('charset','UTF-8');s.setAttribute('src',baseUrl+'/bookmarklet/read.js');document.documentElement.appendChild(s);})()"

And then when your webpage finishes loading

- (void)webViewDidFinishLoad:(UIWebView *)webview
{
    [webview stringByEvaluatingJavaScriptFromString:readJS];

Answer 6

You can do it in iOS9. first import SafariServices:

#import <SafariServices/SafariServices.h>

Afterwards we are instantiating SFSafariViewController and adding it as a subview. We have two options doing so:

• Creating with only base URL
• Creating with bas URL as well as entering 'Reading Mode' in case it is available

NSString *sURL = @"http://google.com";

NSURL *URL = [NSURL URLWithString:sURL];

SFSafariViewController *safari = [[SFSafariViewController alloc] initWithURL:URL]; // 1.

SFSafariViewController *safari = [[SFSafariViewController alloc] initWithURL:URL entersReaderIfAvailable:YES]; // 2.

[self presentViewController:safari animated:YES completion:nil];