Replace links with some other link in a text

Question

I have below description, which I am trying to replace the links in href props with signed s3 links on the backend without DOM

So, I need to first loop over all the matching s3 links and replace it with signed one.

The problem is It replaces other parts as well. It doesn't know when to end the matching.

Here is what I am trying to do,

Collect all the links
Filter links which has s3 related keyword
replace them with signed s3 link

function replaceNonSignedS3WithSignedLink(text) {
  const urlRegex = /(https?:\/\/[^\s]+)/g;
  return text.replace(urlRegex, function(url) {
    return 'https://signed-s3-link.com';
  })
  // or alternatively
  // return text.replace(urlRegex, '<a href="$1">$1</a>')
}
const desc = `<h3>Introduction Session</h3><p>Monday, March 3, 2021 11:00AM - 01:00PM</p> 
    Click <a href='https://example.s3.amazonaws.com/assets/bio.pdf'>here</a>`;

const result = replaceNonSignedS3WithSignedLink(desc);

console.log(result)

The result I get is,

"<h3>Introduction Session</h3><p>Monday, March 3, 2021 11:00AM - 01:00PM</p> 
    Click <a href='https://signed-s3-link.com"

Regex processing of HTML is a [bad approach](https://stackoverflow.com/a/1732454/3136474). Couldn't you replace the links in the DOM by selecting `a` tags instead of replacing them using regex in the HTML code? — Dinei, Nov 29 '21 at 14:30

confusedWarrior · Answer 1 · 2021-11-29T14:43:50.670

0

I was wrong with the link matching regex, this seems to work for my case.

let i = 0;
function urlify(text) {
  var urlRegex = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;
  return text.replace(urlRegex, function(url) {
    if (url.includes('s3')) return 'https://signed-s3-link.com' + ++i; // I can process individual link here
    return url;
  })
}

var text = `<h3>Introduction Session</h3><p>Monday, March 3, 2021 11:00AM - 01:00PM</p> 
    Click <a href='https://example.s3.amazonaws.com/assets/bio.pdf'>here</a> <a href = 'https://hello.com'>Hi</a>`;
var html = urlify(text);

console.log(html)

edited Nov 29 '21 at 14:43

answered Nov 29 '21 at 14:33

confusedWarrior

938
2
14
30

I thought you only wanted to change links that contained s3? – mplungjan Nov 29 '21 at 14:36
That can be easily achieve with `if (url.includes('s3')){ // update the link}` – confusedWarrior Nov 29 '21 at 14:42
I know. Like I did in my answer. – mplungjan Nov 29 '21 at 14:43
@mplungjan The limitation is, which I forgot to mention, It is being processing on backend. So, there is no DOM to access. – confusedWarrior Nov 29 '21 at 14:45
So it is a straight dupe of https://stackoverflow.com/questions/37684/how-to-replace-plain-urls-with-links – mplungjan Nov 29 '21 at 14:46
@mplungjan It seems I can also use this package. https://github.com/jsdom/jsdom#readme – confusedWarrior Nov 29 '21 at 14:50

Replace links with some other link in a text

1 Answers1