React.js get Youtube link from a sentence or paragraph and convert it to a link

Question

I've been browsing the net for solutions but the one's I got is always only with when the user only inputs the link and not in a sentence/paragraph.

I want to convert the link of a youtube video (which is currently a string) to a link. for example:

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

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>

I've found one but the problem to that is when the user pasted 2 links.

I'm making a simple chat application for learning purposes. I'm also using the Next.js.

I want a way, plugin or a package to do this but I prefer the "way" cause' I will eventually use the link to generate an iframe and use the link there to embed the video.

EDIT: I want to it to return the original value but with the youtube link/s wrapped in an <a> tag.

Did you look at https://stackoverflow.com/questions/19377262/regex-for-youtube-url? You need to use the `/gm` flag for multiline — Dominic, Aug 20 '18 at 08:39
Sorry. I meant I want it to return the way it is but wrapping to youtube link to an `` tag. `match()` function only returns those that matches the regex but what I want is to return to the the original value but with the youtube link wrapped in an `` tag. — Marcus, Aug 20 '18 at 09:35

score 1 · Answer 1 · answered Aug 20 '18 at 09:07

1

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

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

Matches: https://www.youtube.com/watch?v=<YT_ID_HERE>

This is a great regex writing tool

answered Aug 20 '18 at 09:07

Francis Leigh

1,870
10
25

React.js get Youtube link from a sentence or paragraph and convert it to a link

1 Answers1