Search code examples
twittercordova

Embedded Twitter timeline in PhoneGap 3.1.0 application


I have an issue with integrating Twitter timeline with PhoneGap 3.1.0 application (iOS version)

1) I have generated a new PhoneGap 3.1.0 application

2) Have added iOS version

3) I have generated a timeline widget in Twitter

4) Have pasted the code from Twitter widget into the page:

index.html:

<a class="twitter-timeline" href="https://twitter.com/bill_hallam" data-widget-id="399136844954087424">Tweets by @bill_hallam</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>   

5) Have whitelisted twitter domains:

config.xml:

<access origin="https://twitter.com" subdomains="true" />
<access origin="http://twitter.com" subdomains="true" />
<access origin="http://platform.twitter.com" />
<access origin="https://platform.twitter.com" />
<access origin="https://cdn.syndication.twimg.com" />
<access origin="http://cdn.syndication.twimg.com" />

6) Started the iOS emulator from Xcode

Result: The page is blank. Safari Develop console shows that twitter <iframe> tag is embedded in the page. All js/css files retrieved successfully. None if them was blacklisted.

Does anyone have succesfull experience integrating Twitter timeline into PhoneGap 3.1 app?


Solution

  • I have finally figured out a way to do that. Unfortunately at the moment the only solution I have found is using an InAppBrowser plugin. But it works for both - iOS and Android versions.

    The detailed description is here

    I have created a small public page, that functions as a service.