How the Web Works (1): Primary reading for novice web developers

If you're just beginning to learn web development, you might think you know how the Web works-at least basically.

But when you try to explain how a simple website works, the mind is blank. What does an IP address mean? How does the client-server side work?

In fact, in today's powerful development framework, it's easy for some novices to overlook the basics of the web.

I know, I used to be like this, there's nothing to be ashamed to admit. The web is complex, and only when you start a career as a backend engineer will you realize the importance of these foundations. (If you want to write a Web program that works correctly.) ）

So, I write the basic knowledge that everyone should master in four parts of the guide article, whether you are a web development as a career, or just a learning interest, you can see:

The first part: how the Web Works
Part II: Structure of the Web program
Part III: HTTP and Rest
Part fourth: Sample code for client-to-server interaction

How the Web Works is defined by the Web Component

Understanding the Web is difficult because it contains a lot of terminology. Unfortunately, some of the terminology determines whether you can understand the next article. If you want to know the secrets of the World Wide Web, here are some important terms you must understand:

Client : A program that runs on a computer to connect to the Internet, such as a Google browser or Firefox browser. Its primary role is to accept user input and to request another computer called a Web server as user input. Although we usually use a browser to access the Web page, you can treat your entire computer as a "client" in the client-server model. Each client computer has a uniquely identified address--IP address so that other computers can identify it based on the IP address.

Server : The Internet-connected machine, which also has an IP address. One server waits for requests from other machines (such as clients) and responds to them. Unlike a computer (such as a client) where you have an IP address, the server installs and runs special server software that tells the server how to respond to requests from your browser. The primary function of a Web server is to store, process, and deliver Web pages to clients. There are many types of servers, such as Web servers, database servers, file servers, application servers, and so on. (In this article, we're talking about a Web server.) ）

IP Address : An Internet Protocol address, which is a digital identifier for a device (computer, server, printer, router, etc.) in a TCP/IP network. Every computer in the Internet has an IP address that is used to identify communication with other computers. An IP address is a string of four sets of numbers, separated by dots (such as 224.155.65.2). This is also known as the "logical address." In order to locate the device in the network, the logical IP address is converted to a physical address through the TCP/IP protocol software, and the physical address is fired in your hardware.

ISP: Network service provider. An ISP is a middleman between the client and the server. For a typical family, the ISP is usually the "cable company". When your browser accepts a request to go to www.github.com, it does not know where to look for www.github.com, so this is the work of the ISP, which uses DNS to find the IP address of the site you are trying to access.

DNS: Domain Name System. DNS is a distributed database that is used to track the IP address records that correspond to computer domain names on the Internet. At the moment, you don't have to worry about how the "distributed Database" works, as long as you know that the presence of DNS allows the user to enter www.github.com with an IP address instead.

domain name : Used to identify one or more IP addresses. Users use domain names (such as www.github.com) to browse a website on the Internet. But you typed the domain name in the browser, DNS looks for its corresponding IP address.

TCP/IP: Transmission Control Protocol/Internet connectivity protocols. TCP/IP is the most widely used communication protocol. The "protocol" is the standard for what a set of rules do, and TCP/IP is a standard protocol for transferring data between networks.

Port Number : is a 16-bit integer number used to identify the specific port on the server, which is usually associated with an IP address. It forwards network requests to the server as a way to identify specific processes on the server.

host : A computer connected to a network-it can make a client, a server, or any type of device. Each host has a unique IP address. Take www.google.com This website, the host can be a Web server, used to provide Web services to the site. Hosts and servers are often confusing, but note that they are two different things. Servers are one of the hosts-they are a specified machine. On the other hand, a host may involve the entire organization, which provides a managed service to maintain multiple Web servers. In this sense, you can run a service on a single host.

HTTP: Hypertext Transfer Protocol. This protocol is used by browsers and Web servers for communication between the Internet.

URL: Uniform Resource Locator. URLs are used to identify a specific web resource. Take Https://github.com/someone as a simple example, this URL specifies the protocol used ("https"), the hostname (github.com), and the file name (someone's profile page). A user can take this URL and get this Web resource via HTTP from a host on a domain name of GitHub.

The journey from code to Web

Now that we have a certain understanding of the main noun in this journey, let's look at the GitHub search to see how we get to the corresponding page by entering a URL in the address bar:

1. Enter the URL in your browser

2. The browser resolves the information contained in this URL. This URL contains the protocol used ("https"), the hostname (github.com), and the resource ("/"). In this example, there is nothing behind ". com" that points to a particular resource, so the browser knows to retrieve only the home page.

3. The browser communicates with the ISP to find the IP address of the Web server with the host name www.github.com by DNS. The DNS service will first contact the root name server, which will look for https://www.github.com and get the IP address of the ". com" top-level domain name server, and then return this IP address to your DNS service. The DNS service does an IP address for the ". com" extension query https://www.github.com.
Source: https://technet.microsoft.com/en-us/library/bb962069.aspx

4. Once the ISP accepts the IP address of the target server, it will send the IP address to your browser.

5. Your browser will take this IP address and the port number in the URL (the HTTP protocol default port number is 80,https the default port number is 443), open a TCP socket connection. At this point, your browser and server establish a connection.

6. Your browser sends an HTTP request to the Web server to get the Www.github.com home page.

7. The Web server receives the request and finds the HTML page. If the page exists, the Web server prepares a response and sends it back to your browser. If the server cannot find the page you requested, it will send a 404 error message, 404 means "page not found"

8. Your browser scans the HTML page it receives from start to finish and looks for other related resources, slices, CSS files, JavaScript script files, and so on.

9, the other resources involved in the Web page, the server will repeat the above steps to initiate an HTTP request for each corresponding resource.

10, once the browser loaded all the resources involved in HTML, the page will eventually load in the browser form, and close the connection to the server.

Across the abyss of the Internet

One notable thing is how the information you request is transmitted when you initiate a request. When you initiate a request, this information is split into a number of small pieces, which we call the package, each containing the TCP header, which contains the port number of the source host and destination host, and the IP header contains the IP address of the source host and destination host. This packet is then transmitted over Ethernet, WiFi, and cellular networks and allows for transmission on any path, as well as as many jumps as possible when reaching the final destination. (In fact, we do not care how the package arrives at the destination, we are concerned that these packages can be safely transferred to the destination host), once these packets arrive at the destination host, they will be combined again as a whole to transmit.

So how do all these packages know how they should get to the destination host without losing any packages?

The answer is TCP/IP.

TCP/IP is composed of two parts, its function is as the basic "control system" of the Internet. IP represents the Internet protocol, and its main task is to send and find paths to other computers through each packet's IP header (e.g. IP address). The second part is the Transmission Control Protocol (TCP), its task is to split the information or to split the file into small packets, through the TCP head packet to the destination computer corresponding application, if the packet is lost, re-send, once they have reached the other end, it is assembled in the correct order.

Draw the final graphic

Wait, the task is not finished yet. Now that your browser has got all the information (HTML, CSS, JavaScript, pictures, and so on) on the homepage of the website, it will take several steps to present the resources in a human-readable web page.

Your browser has a rendering engine that is responsible for displaying the content. The rendering engine accepts the contents of all resources in small chunks, and then tells the browser how to parse the resources through an HTML parsing algorithm.

Once the parsing is complete, it generates a tree of DOM elements that represent the Document Object model, which is a convention for how to render all object locations in an HTML document. objects in each document, or nodes, can be manipulated using scripting languages such as JavaScript.

After the DOM tree is built, the stylesheet is parsed to see how each node is styled. Using the above information, the browser traverses the DOM node from top to bottom and calculates the CSS style, position, coordinates, and so on for each node.

Once the browser has made the DOM nodes and their styles, it is finally ready to draw the page based on your screen. The final page is the same page you saw on the Web.

The web is complex, but you've learned a part of it that's hard to understand. The above is a generalization of the web, lost it? We're all lost, but you've read this and you've learned a part of it that's hard to understand. I've obviously skipped some details here and shown you the full picture in an interesting way, but if your ideas keep up with the basic order outlined above, the details will be a piece of cake.

In the next section, we will deal with the structure of the basic Web application.

Original link: http://www.cnblogs.com/Lau7/p/7867883.html

(go) How the Web Works (1): Primary reading for novice web developers