Fragment identifier

bdu · 4 Jan 2019 at 09:17

Hello,

can anyone tell me what's going up when I load https://en.wikipedia.org/wiki/Ice_age and than I click there at first graphic and the browser loads https://en.wikipedia.org/wiki/Ice_age#/media/File:IceAgeEarth.jpg?

What is #/media/File:IceAgeEarth.jpg? I don't know such fragment identifier with slashes and I don't find any such id in source code of the page https://en.wikipedia.org/wiki/Ice_age. What's the technique? What's the standard.

Very thanks
bdu

GravyMonster · 4 Jan 2019 at 09:25

There is no standard. Anything after the # in the URL is the fragment, as you've correctly stated. You can place literally anything here (so long as it's been URL encoded).

It would appear that Wikipedia are using it to store a reference to the image to be displayed. Note that it's not the *actual* relative image path though, as that's "/wikipedia/commons/thumb/b/b4/IceAgeEarth.jpg/800px-IceAgeEarth.jpg"

bdu · 4 Jan 2019 at 10:42

Very thanks, Spunkey

Anything after the # in the URL is the fragment, as you've correctly stated. You can place literally anything here (so long as it's been URL encoded).

Yes, of course. But who does it process? Wikipedia (https://en.wikipedia.org/wiki/Fragment_identifier#Basics) writes:

When an agent (such as a Web browser) requests a web resource from a Web server, the agent sends the URI to the server, but does not send the fragment. Instead, the agent waits for the server to send the resource, and then the agent processes the resource according to the document type and fragment value.

Here we have the strange link again: https://en.wikipedia.org/wiki/Ice_age#/media/File:IceAgeEarth.jpg. When we click at it the browser asks the server for https://en.wikipedia.org/wiki/Ice_age, gets it and then (the browser!) processes the fragment #/media/File:IceAgeEarth.jpg. But what can the browser do with it? I guess it doesn't know anything about file system architecture of Wikipedia. How does it work? I'm still confused.

GravyMonster · 4 Jan 2019 at 11:35

The fragment will be read on the client (most likely in Javascript) and then it will execute whatever logic is needed for the given fragment value. This is all entirely proprietary. As such you can do literally anything you need.

In the case of Wikipedia, they are detecting the fragment and showing a modal window with the relevant image. This is why you can see the normal Wiki entry underneath the image for a split second; it's loading the modal.

Don't be fooled by the fact that the fragment looks like a file path. That's just a convention they are following. It could as well say 'EkkeEkkeEkkeEkkePtangZooBoing' and work just as well.

bdu · 4 Jan 2019 at 12:23

My God, I forgot that I enabled scripting for Wikipedia. Yes, you are right, it is processed by Javascript. When I switch it off, it doesn't work anymore. I was confused, because scrolling to a normal (?) fragment like in https://en.wikipedia.org/wiki/Ice_age#Major_ice_ages does work without Javascript.

Very Thanks again. Any "resolved" button here?