Jump to content

[TOPIC: topicViewTemplate]
[GLOBAL: userSmallPhoto]
Photo

Viewing Facebook Public page in app
Started by alg Sep 27 2016 05:31 AM

6 replies to this topic
facebook pages page plugin
[TOPIC CONTROLS]
[/TOPIC CONTROLS]
[modOptionsDropdown]
[/modOptionsDropdown]
[reputationFilter]
[TOPIC: post.html]
#1

alg

[GLOBAL: userInfoPane.html]
alg
  • Observer

  • 22 posts
  • Corona SDK

I'd like to be able to view a facebook page from within a Corona-based app.  Facebook has a Page Plugin.  If you go to this site, you can impose a URL and parameters.  As a result you get a javascript and an HTML reference.  I can create a local html file with the results and use a webPopup to show.  However, i end up with a hyperlink that you must click to see the page.  Can i avoid the hyperlink and show the page directly?  Is there a better way with Graph API?  [i generated the output below from the referenced facebook developer page]

 

https://developers.facebook.com/docs/plugins/page-plugin

 

---- JAVA SCRIPT ---

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.7&appId=1760582670857920";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

 

-- HTML CODE ---

<div class="fb-page" data-href="https://www.facebook.com/Board-of-Genii-1763535667233752" data-tabs="timeline" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><blockquote cite="https://www.facebook.com/Board-of-Genii-1763535667233752" class="fb-xfbml-parse-ignore"><a href="https://www.facebook.com/Board-of-Genii-1763535667233752">Board of Genii</a></blockquote></div>

 



[TOPIC: post.html]
#2

alg

[GLOBAL: userInfoPane.html]
alg
  • Observer

  • 22 posts
  • Corona SDK

bad question?



[TOPIC: post.html]
#3

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 24,535 posts
  • Corona Staff

I wouldn't say "bad" question, but it's a tough question. Most of the people around here are not used to Javascript and HTML code. After looking at the FB page, they are giving you drop-in code to an existing HTML page. I think it would be helpful to see your webView code, how you're creating it, what the full HTML you're providing it is for someone to give you an answer.

 

 

Rob



[TOPIC: post.html]
#4

alg

[GLOBAL: userInfoPane.html]
alg
  • Observer

  • 22 posts
  • Corona SDK

A novice myself.  Since facebook provides a direct method to get the HTML code, seems there should be an easy way to utilize it.  I create the temporary HTML file listed below in the documents directory of the device.  I then use this lua code to attempt to open the page.  The result is a web popup with only a hyperlink named "facebook".  It seems there would be a way to mimic clicking the hyperlink (reload or onLoad), but I don't see the trick.  To make this a more direct Corona question, is there a better way to get the Page result with the facebook plugin ( I was trying to avoid requesting facebook permissions within the app).
 
====== 
local bannerHeight = 48
local tmpHtmlPage= "fbTmpPage.html"
local options =
 {
     baseUrl = system.DocumentsDirectory, -- default: nil
     hasBackground = true,  -- default: true
     autoCancel = false,  -- default: true (Android)
     urlRequest = listener  -- default: nil
 }
 native.showWebPopup(0, bannerHeight, dim.screenWidth, dim.screenHeight-bannerHeight, tmpHtmlPage, options)
 
====== HTML FILE ===============
<html>
<head>
</head>
<body>
<div id="fb-root"></div>
<script>
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.7&appId=XXXXXXXXXXXXXX";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk');
</script>
<div class="fb-page"
  data-tabs="timeline"
  data-small-header="true" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="false">
  <blockquote
      class="fb-xfbml-parse-ignore">
    </blockquote>
  </div>
</body>
</html>


[TOPIC: post.html]
#5

alg

[GLOBAL: userInfoPane.html]
alg
  • Observer

  • 22 posts
  • Corona SDK

Turns out Facebook provides an iFrame version of the same code (no javascript) and it works directly.
 
======= HTML FILE =============


[TOPIC: post.html]
#6

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 24,535 posts
  • Corona Staff

I messed around with it yesterday and I was just getting the link too. The iFrame method worked much better.

 

Rob



[TOPIC: post.html]
#7

alg

[GLOBAL: userInfoPane.html]
alg
  • Observer

  • 22 posts
  • Corona SDK

Thanks for taking the time.  The effort is appreciated.




[topic_controls]
[/topic_controls]

Also tagged with one or more of these keywords: facebook, pages, page plugin