Embed instagram into Android WebView

android webview embed instagram instagram-api
Wonton picture Wonton · Apr 2, 2015 · Viewed 7.1k times · Source

I have an Android app with a WebView where I show content that includes embedded twits and embedded instagram photos.

In both cases I copy the blockquote as indicated in the documentation, and I show it this way:

    String html = "<!DOCTYPE HTML><html><head><style>a {color:#333333;}</style></head><body>"+content.substring(0, blockquoteEnd)+"<script async src=\"//platform.twitter.com/widgets.js\" charset=\"utf-8\"></script></body></html>";
    WebView tText = new WebView(getActivity());
    tText.loadDataWithBaseURL("", html, "text/html", "UTF-8", "");
    WebSettings webSettings = tText.getSettings();
    webSettings.setJavaScriptEnabled(true);
    textWrapper.addView(tText);

My Tweets where shown only in plain text but I fixed this with this line:

tText.loadDataWithBaseURL("https://twitter.com", html, "text/html", "UTF-8", "");

I've tried to do the same with Instagram photos doing this:

tText.loadDataWithBaseURL("https://instagram.com", html, "text/html", "UTF-8", "");

but it's not working, all instagram photos only show the description in plain text.

I can not find any documentation (official or not) on how to embed Instagram in Android WebViews. Anyone has any idea of how to fix this?

Answer

Mor picture Mor · Apr 5, 2015

Did you try using this link? https://instagram.com/developer/embedding/

I'm not sure what your "html" param is when you're trying to embed Instagram, but assuming you have the link for the item you want to embed, you can send a request to http://api.instagram.com/oembed with the item's URL and get the relevant information (see the bottom part in the link, "Embedding for developers"); once you get a response, you should be able to retrieve the "html" part from the JSON object and pass that to loadDataWithBaseURL as the second parameter.

Also, I was trying to embed Instagram and Facebook videos on my Android app and was unable to, as I was calling loadDataWithBaseURL with null as the first param, instead of the Instagram/FB URL. Earlier today I saw your questions and noticed that your first param was different than mine, so I changed it, and then everything was OK. So thanks for that :-)

Related questions

Android Calling JavaScript functions in WebView

I am trying to call some javascript functions sitting in an html page running inside an android webview. Pretty simple what the code tries to do below - from the android app, call a javascript function with a test message, …

Read More
Android Webview - Webpage should fit the device screen

I have tried the following to fit the webpage based on the device screen size. mWebview.setInitialScale(30); and then set the metadata viewport <meta name="viewport" content="width=320, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <meta name="viewport" content="width=…

Read More
File Upload in WebView

I have been struggling to upload files from WebView since last few days and there is no progress. I googled and implemented all suggested solutions but none works, like: solutions suggested here, and so on. Problem: I have a HTML …

Read More