Youtube "short" videos type embedding/oneboxing not working

Hi!

Youtube video embedding works on my forums, but not short videos (those with /shorts/ in the URL) like this one:

The onebox request returns a 404 error.

Regular youtube video embedding works.
I don’t encounter this issue on try.discourse or meta.
I suppose it comes from a site setting not properly configured.

Any clue?


Youtube oneboxing is something custom we created. Someone needs to submit a #pr-welcome for shorts compatibility. Moving to #feature

In the meantime you can always add the manual iframe URL to the allowed iframes site setting:

It’s a tall one tho :rofl:

2 Likes

Maybe it’s because of the location of the server, like it was/is here Youtube embeddings have stopped working for servers in Europe

1 Like

Thanks for the clarification!

Could you just tell me what URL should I add in allowed iframes in order to have the video shown as you did? It would perfectly do the job for now, even if it’s tall indeed.


As for the video height, it’s possible to make it less tall by setting a max-height with CSS on the iframe. The issue is that the iframe has no attribute of any kind that specify that it’s a short (vertical) vidéo. :confused:

<iframe width="672" height="1194" src="https://www.youtube.com/embed/SWeTMdyv50Q" frameborder="0" allowfullscreen="">

https://www.youtube.com/embed/

Thank you Falco.

I guess I’m going close, but I’m still a bit confused.

So, I’ve added this URL in the allowed iframes.

But then, what should I do in order to make the video appear?

If I write in my post https://www.youtube.com/shorts/SWeTMdyv50Q, it won’t work.
If I write <iframe>https://www.youtube.com/shorts/SWeTMdyv50Q</iframe>, it won’t work.
If I write https://www.youtube.com/embed/SWeTMdyv50Q, it will work, but will display the short video with standard youtube video width/height ratio (which is OK for me, though I’d prefer having another ratio and not having to manually write “embed” in the URL):

Right click a shorts video and select “Copy embed code”. That is what I meant by “manual embed code”, sorry I wasn’t clear.

2 Likes

Also, replacing /shorts/ by watch?v=, the default URL of a Youtube video, works.

So, in youtube, on https://www.youtube.com/shorts/SWeTMdyv50Q, doing right click → Copy video URL will work since it returns https://youtu.be/SWeTMdyv50Q which is correctly displayed on Discourse (with the regular wide ratio though).

2 Likes

I’m not a developer but I’m guessing something like that might make the #pr-welcome easier for someone who is?

2 Likes

I’ve done it though I might have messed up a bit my pull request because for some reason, I’m still not used to GitHub… I really need to read the manual (and, a friend tells me, to create branches from my Discourse fork…). :upside_down_face:

Just for information, I just edited the file lib\onebox\engine\youtube_onebox.rb to add

# https://www.youtube.com/shorts/wi2jAtpBl0Y
if uri.path["/shorts/"]
  id ||= uri.path[/\/shorts\/([\w\-]+)/, 1]
end
1 Like

Would it be easier just change shorts to embed?

I’m not sure what you mean.

People usually copy-paste their Youtube link from their address bar.

Now Youtube has new /shorts/ URL, people will copy-paste these /shorts/ links and they’re not supported yet by the Youtube oneboxing.

/embed/ links are, but they require the user to actually look in Youtube for the embed URL, which pretty much nobody does :thinking:

1 Like

I’m just wondering if it would easier job to just change that url? Because youtube.com/shorts/something is totally same than youtube.com/embed/something, and with /embed/ oneboxing/embedding works just fine here.

https://youtube.com/shorts/aQFdwUeZxkA doesn’t work:

But https://youtube.com/embed/aQFdwUeZxkA works:

I’m still not following you. Who would change the URL? The poster? But the poster doesn’t want to manually re-write part of an URL (they won’t even know why the video doesn’t embed), they just want to copy-paste, and boom, it works.


Edit: or do you mean that Discourse’s Oneboxing code would replace /shorts/ by /embed/?

Yes, maybe! I’m not exactly a code wizard :smile:

Yes. And I can’t code a bit but I could imagine simply replacing can’t be that hard :wink:

2 Likes

These both have the same end result, right? That a shorts video then gets nicely embedded with playback functionally?

Well… I’m not sure I understand. :sweat_smile:

  1. https://www.youtube.com/embed/SWeTMdyv50Q

  2. https://www.youtube.com/shorts/SWeTMdyv50Q

  3. http://youtu.be/SWeTMdyv50Q leads to https://www.youtube.com/watch?v=SWeTMdyv50Q

These three different link formatting lead to different displays on Youtube.

Whatever the URL format is, the code only cares about the video ID:

The code currently doesn’t support /shorts/ and there are multiple ways to make it work.

My suggestion, as a coding neophyte, is to duplicate this part:

and replace embed with shorts. I tried it on my dev install and it works perfectly.

If there’s a more elegant way to do so, I’d be happy to know it :slight_smile:

2 Likes

Great work @Canapin :clap:

Is it something you want to submit a pull request for?

Yes, I’m just struggling with the ruby test file. It doesn’t work and I don’t know why. I’ve never used/created unit testing before so…

The file that should be modified is discourse/youtube_onebox_spec.rb at 493d437e79f88ab9829a36fa000cc6107085e424 · discourse/discourse · GitHub

I’ve tried adding this at the bottom of the file:

  it "can parse youtube shorts results" do
    preview = expect(Onebox.preview('https://www.youtube.com/watch?v=wi2jAtpBl0Y').placeholder_html)
    preview.to match(/reacts/)
    preview.to match(/hqdefault/)
  end

And also added this at the beginning of the file, in before do:

stub_request(:get, "https://www.youtube.com/shorts/wi2jAtpBl0Y").to_return(status: 200, body: onebox_response("youtube-shorts"))`

I executed the tests with bin/rspec spec/lib/onebox/engine/youtube_onebox_spec.rb
But the test I added fails.

I don’t have the error message right now and I’ll be busy for the next few hours though.

Works now:

https://www.youtube.com/shorts/kt7jiaGVsto

1 Like