forked from medialize/URI.js
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathabout-uris.html
113 lines (95 loc) · 6.71 KB
/
about-uris.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<meta charset="utf-8" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>URI.js - About URIs</title>
<meta name="description" content="URI.js is a Javascript library for working with URLs." />
<script src="jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="prettify/prettify.js" type="text/javascript"></script>
<script src="screen.js" type="text/javascript"></script>
<link href="screen.css" rel="stylesheet" type="text/css" />
<link href="prettify/prettify.sunburst.css" rel="stylesheet" type="text/css" />
<script src="src/URI.min.js" type="text/javascript"></script>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-8922143-3']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body>
<a id="github-forkme" href="https://github.com/medialize/URI.js"><img src="http://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub" /></a>
<div id="container">
<h1><a href="https://github.com/medialize/URI.js">URI.js</a></h1>
<ul class="menu">
<li><a href="/URI.js/">Intro</a></li>
<li class="active"><a href="about-uris.html">Understanding URIs</a></li>
<li><a href="docs.html">API-Documentation</a></li>
<li><a href="jquery-uri-plugin.html">jQuery Plugin</a></li>
<li><a href="http://rodneyrehm.de/en/">Author</a></li>
</ul>
<h2>Understanding URIs</h2>
<p>
Uniform Resource Identifiers (URI) can be one of two things, a Uniform Resource Locator (URL) or a Uniform Resource Name (URN).
You likely deal with URLs most of the time. See RFC 3986 for a proper definition of the terms <a href="http://tools.ietf.org/html/rfc3986#section-1.1.3">URI, URL and URN</a>
</p>
<p>
URLs are used to address the individual resources of your website.
URNs are usually used for hooking into other applications, as <code>mailto:</code>, <code>magnet:</code> or <code>spotify:</code> suggest.
While RFC 3986 defines the structure of an URL in depth, URNs are not. The structure (and meaning) of URNs are up to their distinct specifications.
</p>
<h2>Components of an URI</h2>
<p><a href="http://tools.ietf.org/html/rfc3986#section-3">RFC 3986 Section 3</a> visualizes the structure of <abbr title="Uniform Resource Indicator">URI</abbr>s as follows:</p>
<pre class="ascii-art">
URL: foo://example.com:8042/over/there?name=ferret#nose
<span class="line"> \_/ \______________/\_________/ \_________/ \__/
| | | | |
</span><span class="label"> scheme authority path query fragment
</span><span class="line"> | _____________________|__
/ \ / \
</span>URN: urn:example:animal:ferret:nose</pre>
<h3>Components of an <abbr title="Uniform Resource Locator">URL</abbr> in URI.js</h3>
<pre class="ascii-art">
<a href="docs.html#accessors-authority">authority</a>
<span class="line"> __________|_________
/ \
</span> <a href="docs.html#accessors-userinfo">userinfo</a> <a href="docs.html#accessors-host">host</a>
<span class="line"> __|___ ___|___
/ \ / \
</span> <a href="docs.html#accessors-username">username</a> <a href="docs.html#accessors-password">password</a> <a href="docs.html#accessors-hostname">hostname</a> <a href="docs.html#accessors-port">port</a> <a href="docs.html#accessors-pathname">path</a> <a href="docs.html#accessors-search">query</a> <a href="docs.html#accessors-hash">fragment</a>
<span class="line"> __|___ __|__ ______|______ | __________|_________ ____|____ |
/ \ / \ / \ / \ / \ / \ / \
</span> foo://username:[email protected]:123/hello/world/there.html?name=ferret#foo
<span class="line"> \_/ \ / \ \ / \__________/ \ \__/
| | \ | | \ |
</span> <a href="docs.html#accessors-protocol">scheme</a> <a href="docs.html#accessors-subdomain">subdomain</a> <span class="line">\</span> <a href="docs.html#accessors-tld">tld</a> <a href="docs.html#accessors-directory">directory</a> <span class="line">\</span> <a href="docs.html#accessors-suffix">suffix</a>
<span class="line"> \____/ \___/
| |
</span> <a href="docs.html#accessors-domain">domain</a> <a href="docs.html#accessors-filename">filename</a>
</pre>
<p>
In Javascript the <em>query</em> is often referred to as the <em>search</em>.
URI.js provides both accessors with the subtle difference of <a href="docs.html#accessors-search">.search()</a> beginning with the <code>?</code>-character
and <a href="docs.html#accessors-search">.query()</a> not.
</p>
<p>
In Javascript the <em>fragment</em> is often referred to as the <em>hash</em>.
URI.js provides both accessors with the subtle difference of <a href="docs.html#accessors-hash">.hash()</a> beginning with the <code>#</code>-character
and <a href="docs.html#accessors-hash">.fragment()</a> not.
</p>
<h3>Components of an <abbr title="Uniform Resource Name">URN</abbr> in URI.js</h3>
<pre class="ascii-art">
urn:example:animal:ferret:nose?name=ferret#foo
<span class="line"> \ / \________________________/ \_________/ \ /
| | | |
</span> <a href="docs.html#accessors-protocol">scheme</a> <a href="docs.html#accessors-pathname">path</a> <a href="docs.html#accessors-search">query</a> <a href="docs.html#accessors-hash">fragment</a>
</pre>
<p>While <a href="http://tools.ietf.org/html/rfc3986">RFC 3986</a> does not define URNs having a query or fragment component, URI.js enables these accessors for convenience.</p>
</div>
</body>
</html>