[BUG] Unable to handle unlisted video from Vimeo using embed or video plugins

[filipholec]

Has this bug been raised before?

• [X] I have checked "open" AND "closed" issues and this is not a duplicate

Description

It's not easy to render video from Vimeo provider when using video or embed plugins.

Structure of vimeo video link:

• public video: https://vimeo.com/{videoId} (e.g. https://vimeo.com/26689853)
• public video embed: https://player.vimeo.com/video/{videoId} (e.g. https://player.vimeo.com/video/26689853)
• unlisted video: https://vimeo.com/{videoId}/{hashId} (e.g. https://vimeo.com/1004459764/db62233a97)
• unlisted video embed: https://player.vimeo.com/video/{videoId}?h={hashId} (e.g. https://player.vimeo.com/video/1004459764?h=db62233a97)

Unlisted videos without hashId part would show access denied on a video.

Video plugin

Public videos (without hash part) can be easily inserted using video plugin, however, there is issue with unlisted videos. There is no processing of hashId part, so the video will result in access denied.

Moreover, for processing of Vimeo videos, there is used deprecated Simple API which might not work with unlisted videos. Instead of 'https://vimeo.com/api/v2/video' endpoint, it is recommended to use oEmbed API.

Embed plugin

For this part, I'll demonstrate using the following links / elements:

• public embed link: https://player.vimeo.com/video/26689853
• public embed iframe:

<iframe src="https://player.vimeo.com/video/26689853?badge=0&amp;autopause=0&amp;player_id=0&amp;app_id=58479" frameborder="0" allow="autoplay; fullscreen; picture-in-picture; clipboard-write" style="position:absolute;top:0;left:0;width:100%;height:100%;" title="The Cranberries - Zombie"></iframe>

• private embed link: https://player.vimeo.com/video/1004459764?h=db62233a97&
• private embed iframe:

<iframe src="https://player.vimeo.com/video/1004459764?h=db62233a97&amp;badge=0&amp;autopause=0&amp;player_id=0&amp;app_id=58479" frameborder="0" allow="autoplay; fullscreen; picture-in-picture; clipboard-write" style="position:absolute;top:0;left:0;width:100%;height:100%;" title="test_video"></iframe>

Both public and private videos cannot be embedded using classic iframe (there is type error with URL parsing in console):

With embed links, the issue is with custom processing of vimeo videos - it creates request to API that is not valid and returns an error:

However, there is a hacky way how to bypass processing of Vimeo videos - replace vimeo.com with VIMEO.com in the link and it works just fine. Example using the link https://player.VIMEO.com/video/1004459764?h=db62233a97:

For the time being, we'll be using this hack, but it would be great if this would be approached in the upcoming releases :slightly_smiling_face:

In the embed plugin, the obsolete Simple API that is deprecated from Vimeo's side is used and developers should use their oEmbed API:

• https://developer.vimeo.com/api/oembed/videos

Also, my question is - embed with link works without using any custom processing, so why do you have custom Vimeo processing in Embed plugin to handle vimeo videos?

Steps to Reproduce

All relevant information is in the description.

Environment

• version: Yoopta plugins v. 4.7.0

Screenshots

No response

Do you want to work on this issue?

No

If "yes" to above, please explain how you would technically implement this

No response

EDIT: Updated format of links

[Darginec05]

@filipholec you deserve credits for such detailed description 🎉 👯 Thanks for reporting issue, I'll take a look