React.js从句子或段落中获取Youtube链接并将其转换为链接

时间:2018-08-20 08:35:08

标签: javascript regex reactjs next.js

我一直在浏览网络以寻找解决方案,但是只有当用户仅输入链接而不是在句子/段落中输入信息时,我的问题才会出现。

我想将youtube视频的链接(当前为字符串)转换为链接。例如:

Watch this it's good! https://www.youtube.com/watch?v=<YT_ID_HERE>

Watch this it's good! <a href="https://www.youtube.com/watch?v=<YT_ID_HERE>">https://www.youtube.com/watch?v=<YT_ID_HERE></a>

我找到了一个,但是问题是当用户粘贴2个链接时。

我正在出于学习目的制作一个简单的聊天应用程序。我也在使用Next.js。

我想要一种方法,插件或软件包来执行此操作,但我更喜欢“方式”,因为我最终将使用该链接生成iframe,然后使用该链接嵌入视频。

编辑:我希望它返回原始值,但YouTube链接包含在<a>标签中。

1 个答案:

答案 0 :(得分:1)

/https:\/\/www.[\/]*[A-z0-9.\/?=<>]*[\s]/gm

对于:watch this https://www.youtube.com/watch?v=<YT_ID_HERE> hello world

匹配项:https://www.youtube.com/watch?v=<YT_ID_HERE>

This is a great regex writing tool