Problem embedding Facebook video.

  • 1
  • Question
  • Updated 4 years ago
  • Doesn't Need an Answer
I am trying to embed a Facebook video player and it works fine on the web version of the site but through phonegap build I can not get it to display the video. Any solution to display embedded facebook videos?
Photo of Eric Chase

Eric Chase

  • 7 Posts
  • 0 Reply Likes

Posted 5 years ago

  • 1
Photo of Brent Colflesh

Brent Colflesh

  • 41 Posts
  • 4 Reply Likes
Facebook is actually offline at the moment - perhaps that's the issue?
Photo of Brent Colflesh

Brent Colflesh

  • 41 Posts
  • 4 Reply Likes
Also, you need to use the new whitelist plugin:

From Top Mistakes by Developers new to Cordova/Phonegap you have hit:

#6 Not setting the "phonegap version" for your compiler
#7 Not setting "version" for you plugins
#10 Not adding the new "white-list" and "white-list plugin" parameters in config.xml.

From the Phonegap Build Forum, Petra Adds:

> I would add: without announcement, PGB changed the default PGB-version from 3.7.0 to cli-5.2.0. This causes all those who have not set 'phonegap-version' in config.xml to be confronted with the sudden need of splashscreen and whitelist plugins and additional whitelisting specifications in config and html.

> Also, several plugins seem not to build correctly with cli-5.2.0, causing log file error messages about "Class ***.java".

For #6 & #7

> With the CLI version, if you do not assign a version for your platform OR in ''Phonegap Build'' if you do not set the phonegap-version in config.xml, YOU WILL GET THE LATEST VERSION. If you are lucky, your program just works as expected. If you are not lucky, you'll get a set of cascasding error.

> Luckily for all of us, Holly Schinsky has written a nice blog post to explain it all:

Cordova/PhoneGap Version Confusion*
http://devgirl.org/2014/11/07/cordova...

For #10

> This relatively * NEW * requirement means – to access ANY website or resources on the web, you MUST use the whitelist and the whitelist plugin. This requirement goes into affect if you are using cordova-android@4.0.0 or better; including cli-5.1.1. If however, your version is before 4.0.0, let use say 3.5.0 or 3.7.0, then you will *not* have to add the *white-list* requirement.

> To be clear, the "whitelist" has been around for a bit, but the plugin and requirement is very new. As you would expect, when the "whitelist" was added, the defacto open-access feature was deprecated. Or said another way, the defacto open-access feature was planned and scheduled to be eliminated. This change marks a step in removal of the open-access feature.

> In addition, the Content Security Policy (CSP) has caught numerous developers - because it was soooo poorly publicized. This CSP needs to go in every single HTML page you used, just like you have to wait for 'deviceready'. The documentation is buried in the bottom of many of the latest documentation pages.

Related Links
> Phonegap Build Forum: Notes for upgrading to cli-5.1.1 on PGB and now required Whitelist

Cordova Whitelist Guide
Phonegap Whitelist Guide
Phonegap Build Whitelist Guide
Photo of Petra V.

Petra V., Champion

  • 7794 Posts
  • 1391 Reply Likes
From Top Mistakes by Developers new to Cordova/Phonegap you have hit: ...
How on Earth do you know that Eric made exactly these errors?
Photo of Eric Chase

Eric Chase

  • 7 Posts
  • 0 Reply Likes
Thanks for the replies.

I may have an issue as I am using a third party app builder, Alpha Anywhere, and it creates the support files from a wizard that selects permissions and plugins and, whitelist is not an option. I did a test and Youtube does embed but I know that the process is very different for the two with YT in an Iframe and FB doing a scripted call.

Suggestions? I can add code to my page and header.
Photo of Brent Colflesh

Brent Colflesh

  • 41 Posts
  • 4 Reply Likes
Do you have the new meta in your page?

meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline'"
Photo of Eric Chase

Eric Chase

  • 7 Posts
  • 0 Reply Likes
Yes Brent, after reading your post I did add that to the header. No love.
Photo of Brent Colflesh

Brent Colflesh

  • 41 Posts
  • 4 Reply Likes
Maybe changing the right *-src parameter to match what your iFrame is doing - check possible values here:

https://www.owasp.org/index.php/Conte...
Photo of Eric Chase

Eric Chase

  • 7 Posts
  • 0 Reply Likes
I did read the link Brent but it seems that the script source and content is limited to the originating domain. I need to allow facebook script to load. I wish they loaded in an iframe without script like Youtube.

Any idea and what setting would allow the facebook render script and/or the content from facebook.com. Allowing either may work.
Photo of Brent Colflesh

Brent Colflesh

  • 41 Posts
  • 4 Reply Likes
Not offhand, hopefully someone else here has done it and can chime in.
Photo of Eric Chase

Eric Chase

  • 7 Posts
  • 0 Reply Likes
Thanks for try Brent. Hopefully someone else does have an idea.
Photo of Amir

Amir

  • 8261 Posts
  • 263 Reply Likes
whitelist is not an option
Too bad. Whitelist is the only option to allow external scripts loaded to an app.
(Edited)
Photo of Eric Chase

Eric Chase

  • 7 Posts
  • 0 Reply Likes
I have found that I do have access to the config.xml file. What do you believe the proper whitelist code would be to allow the facebook vids to be called?
Photo of Brent Colflesh

Brent Colflesh

  • 41 Posts
  • 4 Reply Likes
What do you have it set to now? I think the most "open" is:

access origin="*"
Photo of Eric Chase

Eric Chase

  • 7 Posts
  • 0 Reply Likes
It is already set by default by build program as:

access origin="*" /
Photo of עודד קרן

עודד קרן

  • 2 Posts
  • 0 Reply Likes
I have the same issue, did you solve it?