Exploring the Web: Chapter One
Tags: devjournal, todayilearned, webdev
Published: 2022-01-15 03:00:20

Below is just a normal hyperlink:

```html
<a href="https://dev.to/naruaika/switching-to-windows-subsystem-for-linux-2493">
    Read Naru's First Blog Post
</a>
```

As we all knew, it contains:

- a reference which is _https://dev.to/naruaika/switching-to-windows-subsystem-for-linux-2493_; and
- a content that is _Read Naru's First Blog Post_.

Nothing special.

## \#1

The code will appear as we would expected as end-users:

<a href="https://dev.to/naruaika/switching-to-windows-subsystem-for-linux-2493">Read Naru's First Blog Post</a>

In most cases, it is the only way to properly provide hyperlinks. So, people will not be confused by this sort of thing:

<a href="https://dev.to/naruaika/switching-to-windows-subsystem-for-linux-2493">https://dev.to/naruaika/switching-to-windows-subsystem-for-linux-2493</a>

Most people would not realise where the hyperlink is actually pointing. We would expect that it will lead us to the first blog post of mine published on DEV, as the content usually indicates the destination page.

What if we change it to:

```html
<a href="https://dev.to/naruaika/i-was-betrayed-by-computer-science-students-244j">
    Read Naru's First Blog Post
</a>
```

It will still looks the same:

<a href="https://dev.to/naruaika/i-was-betrayed-by-computer-science-students-244j">Read Naru's First Blog Post</a>

Right?

The browser has abstracted everything for us but the content. Thus no one will notice it. Even an IT guy will not always inspect the link's destination. All we do is assume that the hyperlink is trustworthy.

Some of today's email applications will alert us when clicking on a link that it is written as:

```html
<a href="https://dev.to/naruaika/i-was-betrayed-by-computer-science-students-244j">
    https://dev.to/naruaika/switching-to-windows-subsystem-for-linux-2493
</a>
```

But what do they know about this?

```html
<a href="https://dev.to/naruaika/i-was-betrayed-by-computer-science-students-244j">
    Read Naru's First Blog Post
</a>
```

**As developers**, should we consider this?

```html
Read Naru's First Blog Post:
<a href="https://dev.to/naruaika/switching-to-windows-subsystem-for-linux-2493">
    https://dev.to/naruaika/switching-to-windows-subsystem-for-linux-2493
</a>
```

Or even this?

```html
Read Naru's first blog post at https://dev.to/naruaika/switching-to-windows-subsystem-for-linux-2493
```

On the other hand, we **as users** do not click on any hyperlinks without inspecting, as we may end up accessing the wrong page.

If it is a login page to Facebook, but it is actually facebok.com and not facebook.com, that would be a big problem. That is why Facebook bought—I am not sure, please do not try to access it—facebok.com to prevent people from logging into fake login page that would inevitably expose their credentials to crime.

If it is an unsubscribe hyperlink from an unknown mail, which we might assume we have subscribed to the newsletter but do not remember that we have not actually done, is it really safe to click on it? Despite having no login form there.

## \#2

We all knew that we can help people to send an email by providing:

```html
<a href="mailto:idmuslimdev@gmail.com">
    Send email to Naru
</a>
```

It will look as usual:

<a href="mailto:idmuslimdev@gmail.com">Send email to Naru</a>

Or this:

```html
<a href="mailto:idmuslimdev@gmail.com?subject=Friend Request&body=Let's be friend!">
    Send email to Naru
</a>
```

Surprisingly, there was a time when some email clients do support:

```html
<a href="mailto:idmuslimdev@gmail.com?subject=Friend Request&body=Let's be friend!&attach=~\.ssh\id_rsa">
    Send me an email
</a>
```

What on earth will it do with our SSH private keys!

## \#3

An anchor can also be used for navigation,

```html
<a href="#35">go to the next section</a>
```

e.g. <a href="#35">go to the next section</a>.

## \#3.5

Or even better:

```html
<a href="javascript:history.back()">
    Go to the previous page
</a>
```

But what if:

```html
<a href="javascript:alert('You have been hacked! Contact us at blablabla to save your computer.');">
    Go to the comment section
</a>
```

See? As for clueless people, it is enough to bully them. Disabling JavaScript barely solves the problem.

## \#4

Suppose someone was looking for a job. He had just found a good-looking website listing several job vacancies. Arguing that the job details would not fit on just one page, he was forced to download a PDF document.

```html
<a href="blablabla/job-details.pdf" download>
    Download the job details
</a>
```

The document is opened and the details were there. Nothing suspicious; he had no idea that he had been compromised as soon as he opened it. As we knew that PDFs, JPEGs, and any type of file can be infected by a virus.

## \#5

I googled the Samsung 980 SSD. Hopefully, it would be the best bet to replace my old turtle HDD. Then all of a sudden, the product had appeared everywhere in plenty of applications and web pages as advertisements.

In the early hours of my research, I was not particularly hooked on just one product or two. Instead, I was looking for a product that gives me the best value. But I happened to be interested in the 980 SSD.

There is no way Google knew right away, when I started typing "best budget ssd", that the 980 SSD will be an option. Well, there was Google Trends for sure, but Google has probably known me for a long time that I am not a typical who wants to be part of a trend. 

So, I think that there were some specific reasons and I assume they have done it by the number of clicks. Let us replicate the incident.

I am using Mozilla Firefox on my notebook, but let us grab Google Chrome this time. Inspecting on the first hyperlink listed on the search result page, we will read:

```html
<a
    href="https://www.pcmag.com/picks/the-best-cheap-ssds"
    data-ved="2ahUKEwiZ7eqB17L1AhVUUGwGHWxOCv8QFnoECAgQAQ"
    ping="/url?sa=t&amp;source=web&amp;rct=j&amp;url=https://www.pcmag.com/picks/the-best-cheap-ssds&amp;ved=2ahUKEwj7uYfkx7H1AhUSjeYKHRW4ALAQFnoECAIQAQ">
    ...
</a>
```

What could we guess from the `ping` attribute here? It would send a sort of PING to https://www.google.com/url. More accurately, according to the [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a), it will sent a POST request with a body containing only literally "PING" as text.

If we look closely to the string query parameters, we might think ourselves reading some interesting data. But I have checked on Google Chrome and Microsoft Edge, logged in to my Google account or not, using incognito or not, using my brother laptop or mine, using the home Wi-Fi or mobile network, they are exactly the same. So, I could say not a thing.

But if we dive into the request details, we will find out that it also sent a bunch of information in the header including my cookies. I assume the header contains my identity in any form. Among them, there are cookies named 1P_JAR, DV, and NID. Wait ... NID!? What is it exactly? I believe _ID_ from _NID_ refers to identity. So, it could be a _national ID_, _namespace ID_, or the like.

We may have a plan to do _open link in a new tab_ instead, have not we? But I have seen that the _pings_ were still being sent. Maybe, the best way to avoid this is by doing _copy link address_, open a new tab, and then paste it by hand.

Meanwhile, it is a little different on Firefox, as Firefox does not support the `ping` attribute by default, although we can enable it via `about:config`. I believe, Google uses the [Beacon API](https://developer.mozilla.org/en-US/docs/Web/API/Beacon_API) to achieve the same goal. But I have heard that they would put this sort

https://www.google.com/url?sa=t&source=web&rct=j&url=https://www.pcmag.com/picks/the-best-cheap-ssds&ved=2ahUKEwj7uYfkx7H1AhUSjeYKHRW4ALAQFnoECAIQAQ

as a value for the `href` attribute. It is supposed to redirect to the actual page once it is done logging us.

## Discussion

We have seen how a single click on hyperlinks can drive people to insecurity. As tech lovers, how do we save people?

## References

- https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a
- https://www.zdnet.com/article/some-email-clients-are-vulnerable-to-attacks-via-mailto-links/
- https://www.youtube.com/watch?v=3AIswRtblYY