Forward slashes in html

Ctrl . blog

How to handle relative URLs with multiple forward slashes

Apache, Nginx, and Microsoft IIS web servers will transparently combine multiple forward slashes into a single forward slash when matching URL s to [file] locations. The advantage with this behavior is that if a user requests “ /docs///page.html ” the server can match that to and send back “ /docs/page.html ” without extra configuration. Unfortunately, today’s web browsers don’t perform the same feat of magic in the same circumstances which creates some bad problems for anyone using relative URL s.

A document that the author expects to be served from “ /docs/page.html ” can also show up on the address “ /docs///page.html ” or some other variation with multiple slashes. A relative URL on this page may link to “ ../product/nuts.html ” with the author fully expecting this to be interpreted as “ /products/nuts.html ” where instead all browsers will interpret it as “ /docs//products/nuts.html ” and the link will be broken.

The problem here’s that the author’s expectations aren’t guaranteed: web servers take it on themselves to do non-standards compliant (as I understand RFC 3986) “smart” matching of locations where multiple forward slashes are interpreted internally a single forward slash.

Web browsers stick to standards and don’t do any such smart character deduplication. For example, URL s containing base64 encoded paths may explicitly require support for multiple forward slashes in a row, so browsers can’t just copy the web servers default behavior on this one.

This problem can be tackled by website administrators at two ends: By using canonicalizing redirects on the server and by adding a base element on each of the pages. Let’s look at both approaches in turn:

1. Redirect addresses with double-slashes to their single-slash equivalent

Please note that this will only redirect one occurrence of double-slashes. An address path like “/this//fine///example.html” will require three separate redirects to end up at “/this/fine/example.html” . This will slow down the page-loading considerably as it will require four round-trips back and forth between the server and browser before the browser finally starts loading the page. This scenario isn’t very likely and will only affect a small subset of users.

Quick clarification before proceeding: I’m not talking about protocol-neutral addresses here; URL s that starts with two slashes instead of specifying the protocol as either HTTP or HTTPS . This article only touches on the path section of a URL .

Configuration example for Nginx

This code example can be applied on a server or http block.

merge_slashes off; # replace merge_slashes' behavior with "redirect_slashes" location ~* "//"  rewrite ^(.*)//(.*)$ $1/$2; rewrite ^ $uri permanent; >

Nginx by default creates a relative mess when you want to redirect double-slashed addresses. Internal location matching is rewritten to merge multiple slashes into a single slash even before you can have a chance to match it and handle it differently. The “ merge_slashes ” option must be switched from on to off to allow manual overriding. The above example shows how to fully replace merge_slashes ’ behavior of transparently merging with redirecting each duplicated slash to a single slash. Don’t disable this option without restoring similar functionality as shown above.

Configuration example for Apache

RewriteEngine On RewriteCond % ^(.*)//(.*)$ RewriteRule . %1/%2 [N=20,R=301,L]

Redirecting incorrect variants of your page’s addresses to their preferred canonical link also helps ensure any further distribution of links to it will use the preferred address. If you can’t make changes to the server operation, or don’t want the advantages or overhead of using redirects; you can look into making changes to the page’s links instead:

2. Manually setting the base URL in each document

Far at the back of the HTML toolkit, we can find the base element. You hardly ever see this technique used out on the real web, but it’s widely supported and dead useful. In fact, it’s meant to solve this exact problem. The base element should be placed inside the head element before any elements containing links. Setting its href attribute will move the base URL path used to resolve relative URL s on the current page. For example, a page opened as “ /docs//page.html ” that loads its stylesheet from “ ../assets/trend.css ” will be understood by browsers as: “ /docs/assets/trend.css ”. This prevents the stylesheet from being loaded. Setting the base element to the canonical link, “ http://www.example.com/docs/page.html ” will cause the browsers to correctly interpret the address as and load “ /assets/trend.css ”.

 html>head> base href="http://www.example.com/docs/page.html"> head>html>

The page author has already chosen to use relative URL s, but that could be changed to use absolute URL s for all links. This avoids all problems with relative URL s but requires more substantial change to link architecture in the page and possible throughout the website.

One-step removed from using absolute URL s, every URL could be changed to start with a forward-slash and be relative from the root instead of the current page. In practice, this has the same drawbacks as switching to using absolute URL s. Some clients, especially dumb spiders, may have trouble resolving root-relative URL s in deeply-nested paths.

Sources

• RFC 3986: Uniform Resource Identifier (URI): Generic Syntax , 2005-01 , Network Working Group, Internet Engineering Task Force
• Module ngx_http_core_module , Nginx Documentation, Nginx

Источник

Forward slash

Alternatively known as a solidus, virgule, upward slash, or whack, the forward slash is the name of the «/» character on the computer keyboard. Forward slashes most commonly describe a network address, URL’s, and other addresses. For example, in the below Computer Hope URL, the forward slash is used three times.

Although «slash» is often describes the forward slash, it can also describe a backward slash. It’s better to say «forward slash» instead of «slash» when telling someone to enter a forward slash.

Early typewriters and computer keyboards only had a forward slash. The backward slash was not made popular until the introduction of MS-DOS.

Where is the forward slash key on the keyboard?

Below is an overview of a computer keyboard with the forward slash keys highlighted in blue. One key appears on the main keyboard. The other key is on top of the numeric keypad. Its primary use is to represent the mathematical division operator, as on a calculator.

How to create a forward slash

Creating the «/» symbol on a U.S. keyboard

On English keyboards, the forward slash is on the same key as the question mark key next to the right Shift key.

Doing the Alt code Alt +47 can also create a forward slash.

Creating the «/» symbol on a smartphone or tablet

To create a forward slash on a smartphone or tablet open the keyboard and go into the numbers (123) or symbols (sym) section and tap the / symbol.

What are the other uses of the forward slash?

A forward slash may also be used for any of the following reasons.

Math formula

In a math formula, a forward slash represents a division (divide). For example, in the below formula you can see that 10 2 is equal to 5.

Internet browsers

In Internet browsers like Chrome and Firefox. Pressing the forward slash opens a find to help find text on the page being viewed.

Separate the month, day, and year of a date

Forward slashes are used in many parts of the world to separate the month, day, and year of a date. For example, in the United States, 5/14/2019 is May 14, 2019.

Different parts of the world have different date formats. For example, instead of the above format of M/dd/yy, it may be formatted as yy/MM/dd or dd-MMM-yy.

Nonexecutable statement in computer programming

Another example of a forward slash is in the nonexecutable statement used with some programming languages. For example, in the following PHP code, the comment «hidden text» would not show when executed because it is surrounded by a forward slash and an asterisk.

Express emote in online game

In many online games, the forward slash is used to have their online character express an emote (emotion). For example, typing «/wave» would make their character wave to other players.

Closing tags in HTML and XML

With HTML, XML, and other markup languages, the forward slash is used with closing tags to let the browser or reader know when a tag ends. Below is an example of a bold HTML tag with a beginning and end tag surrounding «bold text» and making it bold.

Example of bold text.

Command line switch or another program option

In MS-DOS and the Windows command line, the forward slash is used to perform a command option or switch. For example, with the below dir command, the /p performs the directory listing one page at a time.

With chat, the forward slash starts a command. For example, in IRC, /msg is a message command that message’s another person chatting.

In online games, the forward slash starts an action. For example, in World of Warcraft, typing /dance into chat makes your character dance.

A forward slash in a spreadsheet program

In spreadsheet programs like Microsoft Excel, a forward slash is used in formulas for a division. For example, in the following formula, cell A1 is divided by cell B1.

When not used in a formula a forward slash with only numbers is treated as a date. For example, if you entered «2/1» in a cell, Excel treats the cell as the date «1-Feb» or «2/1/2019.»

Regular expression delimiter

With a regular expression, a forward slash is used as a delimiter or separator. For example, in the following Perl regular expression, all of the letter «a» characters are replaced with the letter «b» in the $example variable.

Execute a Linux program

Separate files and directories in a path

In a Linux or network file path, a forward slash is used to separate files and directories.

What is the other symbol on the forward slash key?

On U.S. keyboards, the forward slash key is shared with the question mark key, which may be shown next to or above the forward slash symbol. To create the question mark, hold down Shift while also pressing / keyboard key.

Related information

Источник

Forward and Backslashes in URLs

A Uniform Resource Locator (URL), colloquially termed a web address, is a reference to a web resource that specifies its location on a computer network and a mechanism for retrieving it. A URL is a specific type of Uniform Resource Identifier (URI).

The Syntax

As a URL is a specific type of URI, it conforms to the syntax of a generic URI, which is of the form:

scheme:[//[user[:password]@]host[:port]][/path][?query][#fragment] 

And there are some points regarding the use of slash:

• Two slashes ( // ): This is required by some schemes and not required by some others. In the case of URL, there is a host specified, thus the two slashes are required.
• A path, which contains data, usually organized in hierarchical form, that appears as a sequence of segments separated by slashes. The path must begin with a single slash ( / ) if an authority part ( [//[user[:password]@]host[:port]] ) was present, and may also if one was not, but must not begin with a double slash.

So we know that, by definition, forward slashes (/) should be used in URLs

• to separate protocol (scheme) part and host (authority) part;
• to separate path segments;
• to begin a path.

Experiments of Mixing Slashes

However, in reality, browsers are tolerant enough to accept URLs written with backslashes and even mixed slashes.

Here is a JSFiddle to test URLs written with various forms of slashes, and screenshots of the results on Firefox and Edge.

I’ve tested it on IE, Edge, Firefox, Chrome and Safari. And found that all those browsers accept URLs written with forward slashes ( / , the correct form), URLs written with backslashes ( \ , an incorrect form) and URLs written with mixed slashes in their path part ( / & \ , another incorrect form).

Besides, Firefox, Chrome and Safari even accept mixed slashes used after the protocol part (e.g. http:/\ , https:\/ ), while IE and Edge do not accept this use.

A side note here: \ is not speical in HTML and requires no escaping.

Conclusion

Now we know that, even if we write URLs in incorrect syntax, browsers will still recognize them.

However, it’s alwasys good to follow the standard. Learning how browsers work in reality is for help in coding and debugging rather than advocating doing things the wrong way.

Further Readings

Источник