Does a whitelisted onebox site strip iframe properties like allowfullscreen?


(Mike Taber) #1

I added vimeo.com to the list of “inline onebox domains whitelist” and when I try to embed a video in an iframe in Discourse, it’s stripping out the tags for:

  • webkitallowfullscreen mozallowfullscreen allowfullscreen

I’ve tested embedding a video in https://iframely.com and it seems to work fine. But when I use the same set of properties to indicate the video can be viewed full-screen in Discourse, the HTML doesn’t show those properties.

Is there something obvious that I’m missing?


(Jeff Atwood) #2

Why do you need to whitelist vimeo? It’s already supported by oneboxing.


(cpradio) #3

Also, that setting isn’t what you think it is… per the description of the setting “A list of domains that will be oneboxed in miniature form if linked without a title”, that is not what you want to happen to vimeo links.


(Mike Taber) #4

If I try to simply post the link, it doesn’t work because it’s a private video so needs to be set into an iframe. I used to use a custom plugin for it, but the last Discourse build broke the plugin.


(cpradio) #5

I think your best bet is to upgrade the plugin, got a link to its repo?


(Mike Taber) #6

Going back to the plugin isn’t an option because I believe the most recent update removed a function it relied on.

I don’t have the link hand but it’s the whitelist plugin that someone posted to allow embedding iframes.

-Mike

Please excuse misspellings and/or the brevity of this message. It was sent from my mobile phone.


(Felix Freiberger) #7

I’m sure the plugin can be updated. I don’t know how exactly whitelisting works now, but this may help:

That’s the table support whitelisting HTML tables, whitelisting iframe with the right src should work similarly.


(Joe Buhlig) #8

I ran into the same issue not long ago. I have a site with Vimeo videos behind a paywall on the Discourse site. The video courses are only for monthly subscribers.

You can set up the privacy settings on Vimeo like you mentioned but then they can’t be oneboxed appropriately.

You can whitelist the Vimeo iframe in the allowed iframes setting like so: https://player.vimeo.com/video/ And although this works, it strips the attributes given by Vimeo to allow users to view it fullscreen. I can attest to users throwing a fit without fullscreen capabilities.

In my case, I have a custom plugin for my site that allows me to customize it as I want. The piece I’ve added to that plugin that fixes this issue is this:

/plugins/my-custom-plugin/assets/javascripts/lib/discourse-markdown/whitelist-tags.js.es6

export function setup(helper) {
  helper.whiteList([ 'iframe[webkitallowfullscreen]' ]);
  helper.whiteList([ 'iframe[mozallowfullscreen]' ]);
  helper.whiteList([ 'iframe[allowfullscreen]' ]);
}

After I added this I had to go through and rebuild the html for each topic with the video on it. Then all was good. :wink:


(Mike Taber) #9

Thanks Joe.

Here’s a link to the custom plugin I’d been using. I had forked the original so I could customize the links.

Am I correct in believing that I need to:

  1. Create a Github repo with the above filename and using that file path
  2. Specify the export function above
  3. Add the .git URL to the app.yml file
  4. Rebuild Discourse

My main difficulty is that I know close to zero about the underlying tech stack so while I can sort of follow what I’m supposed to do, I don’t really have a solid understanding of how everything fits together or works. My usual stack is .NET and SQL Server with AngularJS recently mixed in.


(Joe Buhlig) #10

Try this plugin. I haven’t had a chance to test this one exactly but it’s a replica of a private plugin I’m using that’s specific to my site.


(Mike Taber) #11

Thanks @joebuhlig. I just got back from a conference, used that plugin and it worked like a charm. SUPER HELPFUL!

Very much appreciated.


(Anthony Vacanti) #12

Hey Joe, I noticed that recently using this plugin caused some issues with the way plugin labels were rendering. Did you experience this as well?


(Joe Buhlig) #13

Plugin labels? Do you mean localizations?


(Anthony Vacanti) #14

Perhaps, this is the behavior I began seeing with other plugins:

image


(Joe Buhlig) #15

Are you able to pinpoint this plugin as the issue? It seems odd to me that it would prevent the translations from being displayed.


(Anthony Vacanti) #16

Yes, I commented out the plug-in in my app.yml, rebuilt the app and issue went away. I then uncommented it and rebuilt again and issue came back.