I have been looking at this post: Hide links from Google via JavaScript. I would like to archive the same goal: masking the urls to prevent google from crawling but in my case, I have external URLs. I would like those URLs to be available for my clients when they click on it but not for google to crawl.
This is what I have so far:
<template>
<span href="https://www.w3schools.com/" @click="linkAction($event)">
Link to W3Schools
</span>
</template>
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';
@Component
export default class MainContent extends Vue {
linkAction(e:any): any {
window.location = this.rot13(e.target.getAttribute('href'));
}
rot13(s: any): any {
return (s || this)
.split('')
.map(function(_: any) {
if (!_.match(/[A-za-z]/)) {
return _;
}
const c = Math.floor(_.charCodeAt(0) / 97);
const k = (_.toLowerCase().charCodeAt(0) - 83) % 26 || 26;
return String.fromCharCode(k + (c === 0 ? 64 : 96));
})
.join('');
}
}
</script>
When I inspect it, I still see the hrefs and I suppose that google still crawls and indexes those. Would appreciate some help on how to achieve this.
