Sit cloud alone drink cup dish wet, wear bamboo micro Yin path inclined.

URL URN or URI?

What are escape and unescape?

DecodeURI encodeURIComponent

URL URN or URI

URI defined

Uniform Resource Identifier (URI) : A unique Identifier of a Resource. The content of an HTTP request is commonly referred to as a “resource.” The concept of a resource is very broad. It can be a document, an image, or any other format you can think of. Each resource is identified by a URI.

The URL definition

Uniform Resource Locator (URL) : Also known as a Web address, a URL is a specific URI that identifies a Resource and specifies how to locate the Resource (network location). In layman’s terms, a URL is a string used to describe a resource on the Internet, mainly in various WWW client and server programs.

URN definition

URN (Universal Resource Name) : A URI that specifies a Resource by Name based on a namespace. URN allows one to point out a resource without having to indicate its location or how it was obtained. Resources do not need to be Internet-based.

Uris can be urls, UrNs, or things that have both Locators and Names features. URN acts like the person’s name and the URL acts like the person’s address. In other words: UrNs determine the name of something, urls provide a way to find it, and URIs represent a unique identification of the resource.

Urls and UrNs are both subsets of URIs.

  • ftp://ftp.is.co.za/rfc/rfc1808.txt (also a URL because of the protocol)
  • www.ietf.org/rfc/rfc2396… (also a URL because of the protocol)
  • ldap://[2001:db8::7]/c=GB? objectClass? one (also a URL because of the protocol)
  • mailto:[email protected] (also a URL because of the protocol)
  • news:comp.infosystems.www.servers.unix (also a URL because of the protocol)
  • tel:+1-816-555-1212
  • telnet://192.0.2.16:80/ (also a URL because of the protocol)
  • Urn: oasis: names: specification: docbook: a DTD, XML: 4.1.2

URL decoding

“Only letters and numbers [0-9a-za-z], some special symbols.” *'(),”[excluding double quotes], and reserved words that can be used unencoded in urls.”

If the URL contains Chinese characters, it must be encoded and used, but the trouble is that RFC1738 does not specify the exact method of encoding, leaving it up to the application (browser) to decide, resulting in a confusing field of ‘URL encoding ‘.

Next, let’s take a look at several methods of URL codec.

The escape and unescape

This feature has been removed from the Web standards, and while some browsers still support it, it may be discontinued at some point in the future, so try not to use it.

The old escape() can’t be used for URL encoding directly; its real purpose is to return the Unicode encoding value of a character. It encodes all characters except ASCII letters, numbers, and punctuation marks “@ * _ + -. /”. Symbols between u0000 and u00FF are converted to %xx, while the rest are converted to %uxxxx. The corresponding decoding function is unescape().

escape("Mr.wong.");   
escape("abc123");
escape("@ * _ + -. /"); 
escape("Http://www.bingshangroup.com?name= mr.wong & slogen = true"); 

// %u738B%u603B
// abc123
/ / @ * _ + -. /
// http%3A//www.bingshangroup.com%3Fname%3D%u738B%u603B%26slogen%3D%u5C5E%u5B9E
Copy the code

The encodeURI and decodeURI

It aims to encode the entire URL, so it does not encode other symbols that have a special meaning in the URL, except for common symbols. After encoding, it outputs the utF-8 form of the symbol and prefixes each byte with %.

Its corresponding decoding function is decodeURI().

EncodeURI replaces all characters, but not the following, even if they have a proper UTF-8 escape sequence:

type contains
Reserved characters ; , /? : @ & = + $
Non-escaped characters An alphanumeric- _.! ~ * '()
Digit symbol # 
encodeURI('http://www.bingshangroup.com?name= mr.wong & slogen = true');
encodeURI('http://www.bingshangroup.com?group=wangzong&mayi=web');

// http://www.bingshangroup.com?name=%E7%8E%8B%E6%80%BB&slogen=%E5%B1%9E%E5%AE%9E
// http://www.bingshangroup.com?group=wangzong&mayi=web
Copy the code

& =Are not encoded, however, they are special characters in GET and POST requests, resulting in an error in obtaining the request parameters

EncodeURIComponent and decodeURIComponent

It differs from encodeURI() in that it is used to encode parts of a URL individually, not the entire URL. Its corresponding decoding function is decodeURIComponent().

EncodeURIComponent escapes except alphanumeric ().! All characters except ~ * ‘- and _.

encodeURIComponent('http://www.bingshangroup.com?name= mr.wong & slogen = true');
encodeURIComponent('http://www.bingshangroup.com?group=wangzong&mayi=web');

// http%3A%2F%2Fwww.bingshangroup.com%3Fname%3D%E7%8E%8B%E6%80%BB%26slogen%3D%E5%B1%9E%E5%AE%9E
// http%3A%2F%2Fwww.bingshangroup.com%3Fgroup%3Dwangzong%26mayi%3Dweb
Copy the code

Talking to other

RFC 3986

For greater compliance with RFC 3986 (Reserved! ‘() and *), even if these characters do not formally define the purpose of the URI, it is safe to use the following:

function fixedEncodeURIComponent (str) {
  return encodeURIComponent(str).replace(/[!'()*]/g.function(c) {
    return The '%' + c.charCodeAt(0).toString(16);
  });
}
Copy the code

[and] are reserved for IPV6

function fixedEncodeURI (str) {
    return encodeURI(str).replace(/%5B/g.'[').replace(/%5D/g.'] ');
}
Copy the code

How to convert an object into a query string

var objectToQueryString = (obj) = > Object.keys(obj).map((key) = > `The ${encodeURIComponent(key)}=The ${encodeURIComponent(obj[key])}`).join('&');
objectToQueryString({nameMr.wong,slogen: true})Copy the code

Or you can play it this way (think about how it works)

class FormData {
    constructor(key, value) {
        this.key = key;
        this.value = value;
    }
    
    toString() {
        return encodeURIComponent(this.key) + '=' + encodeURIComponent(this.value); }}let items = [
    new FormData('mr.wong'.The 'true'),
    new FormData('mayi'.'yahei')];console.log(items.join('&'));
Copy the code