I tried analyzing what in essence is a website . I thought of deconstructing or reverse engineering a website . The following are the sequence of events, I speculate or theorize the following sequence of events to be taking place during interaction with a website .
1.Every website is basically a set of computer programs,which get executed when the system where they are stored are contacted .
2.Depending on the processing of the type of request sent by the sender , some xml files , files containing the code to be executed,in response to different events and some script purported for dynamic alteration of the xml files are sent. Out of these xml files .
Out of these xml files , one contains the information about the initial appearance of the page and the furnishing of different controls or event generators on the screen .
4.So when some activity is done in the locality of one event generator , like a mouse click , an event is generated .
The code snippet to respond to the event is executed . If the code contains contacting the server and sending some request then the server is again pinged .
When the server is pinged again , depending on the request sent it again executes some code and in response transfers some more code files ,xml files and scripts to dynamically change the appearance of the page .
Is my understanding about the flow of a website correct ?
A web server is basically just a program sitting on a computer that listens on some TCP port (usually 80 for HTTP, 443 for HTTPS).
Clients (such as browsers) can connect and send a request (in HTTP format) to the server.
The server then sends an HTTP response back.
That's it. That's the basic flow: Connect, request, response.
The response contains a "type" field that tells the client what to do with the data. E.g. it could send an image (which is usually displayed on screen), an audio file (which is played), or a "normal" web page in HTML format.
HTML contains structured information about page content and layout, and may contain references to other resources such as images, style sheets, and scripts. A browser automatically fetches these resources (another HTTP request/response) and processes them.
Scripts can be used to customize the behavior on the client side. These are typically written in JavaScript and make use of an API exposed by the browser for interacting with the current page. They can e.g. register "click" handlers to define what happens when the user clicks on some page element.
XML may or may not be used internally by the web server. It doesn't really matter as far as clients are concerned.
If you want to learn more about this, I suggest researching HTTP, HTML, CSS, and JavaScript. MDN has some good articles, for example.
Related
So I have made a back-end in NodeJS but I ran into one problem, how is it possible to link my back-end to my front end html/css page and use my NodeJS functions as scripts?
In case this wasn't clear to you, your nodejs back-end runs on your server. The server's job (in a webapp) is to deliver data to the browser. It delivers HTML pages. It delivers resources referenced in those HTML pages such as scripts, images, fonts, style sheets, etc.. It can answer programmatic requests for data also.
The scripts in those web pages run inside the browser which is nearly always (except for some developer testing scenarios) running on a completely different computer on a completely different local network (only connected via some network - usually the internet).
As such, a script in the browser cannot directly reference variables that exist in the server or call functions that exist on the server. They are completely different computers.
The kinds of things you can do in order to work-around this architectural limitation are as follows:
The server can dynamically modify the web page it is sending the browser and it can insert data into that web page. That data can be in the form of already rendered HTML or it can be variables inside of script tags that your web page Javascript can then use.
The javascript in the web page can make network requests to your server asking it for data. These are often called AJAX calls. In this scenario, some Javascript in your page sends a request to the server to retrieve some data or cause some action on the server. The server receives that request, carries out the desired operation and then returns a result back to the client Javascript running in the browser. That client Javascript receives the result and can then act on it, inserting data into the page, making the browser go to a new web page, prompting the user, etc...
There are some other ways that the web page javascript can communicate with the server such as webSocket connections, but we'll put those aside for now as they are just more ways for remote communication to happen - the structure of the communication doesn't really change.
how is it possible to link my back-end to my front end html/css page and use my NodeJS functions as scripts?
You can't directly use your nodejs functions as scripts in the front-end. You can make Ajax calls to the server and ask the server to execute it's own server code on your behalf to carry out some operation or retrieve some data.
If appropriate, you can also insert scripts into the web page and run Javascript directly in the browser, but whether you can do that for your particular situation depends entirely upon what the scripts are doing. If the scripts are accessing some resource that is only available from the server (like a database or a server storage system), then you won't be able to run those types of scripts in the browser. You will have to use ajax calls to ask the server to run them for you and then retrieve the results.
I am trying to understand computer languages on a client-side and server-side level a little bit better. From what I understand, client-side code (HTML, CSS and Javascript) are all built into the browwer and can be understood without an internet connection.
However, let's say I build a simple blog application in Python or Ruby. Would my server have the ONLY knowledge of how to break down the Python and Ruby code before sending it back to the client? If so, how does the server compile/interpret the code before sending it back to the client/browser for it to understand?
Please help me understand this.
This is a very general and broad response:
A web server (server) and and a browser (client) like Firefox will communicate by sending text to each other. The method this 'text' is sent is described by a set of rules, or a protocol called Hyper Text Transfer Protocol (HTTP).
HTTP responses contain a 'body' field. This body contains text. The server may send any text to the client it wants. How the client renders said text is up to the client. The text could take the form of HTML, CSS, JAVASCRIPT, Chinese, numbers.....
So if the text the server sends to the client is in HTML format, the client will render it so. The same is true for CSS and Javascript.
But how does the server know what to send to the client?
Simply put, the person who built the website and owns the server put the code onto the server and said 'respond to clients with this stuff when you receive a request.'
Wait, so what's the deal with Python/Ruby/Java etc and those languages being used to write servers?
Servers are programs that take 'requests' and handle the logic that decides how to respond, and what to respond with. The actual content of what the response contains however, has nothing to do with the language that is used to handle the response.
Our Browser Understands only javascript. It converts markup language HTML elements to DOM elements. And our CSS is also like javascript objects
I have a fundamental question and I am searching for that for a long but I still don't know the exact response for that.
I am working with browsers and web applications. I am wondering how and based on what a web browser decide to send a particular request to the web server.
For example when you enter http://www.google.com inside the address bar of your web browser. the Browser will send a bunch of request to the web server for rendering the web page properly.
Now, my question is that how the web browser decide which request it needs to send to the web server.
does it related to some tags like 'link' or 'script' inside the body of the responses.
does the browser parse the javascript functions to see if it should send a request based on those functions?
Lets take an example to explain this one.
Consider you want to search for something and you hit http://www.google.com on your browser. These are the events that unfold to fetch you the page that will let you type in your query.
First, the networking stack on your machine will try to figure out which actual internet address matches www.google.com. This is called a DNS lookup. Once it receives a response for this lookup in form of an IP address, it can make a connection to the actual server that is serving google.com.
The machine makes a socket connection and uses the HTTP protocol to communicate with the server. It queries for the resource at / (which is the root) of the address you are trying to reach. This is called a GET request. The request is normally described like so: GET /
Google will respond with an HTML page. normally "index.html", which gets downloaded by the browser.
Once the HTML is downloaded, all linked resources, such as images to render the HTML as well as javascript referenced by the HTML page gets downloaded.
The downloaded HTML page is parsed and an in-memory tree is created called the "DOM Tree". This tree contains the elements of the HTML page in a hierarchy. Once the DOM is created, you can see the page being rendered on the browser.
During this parsing, the browser discovers more resources to be downloaded, such as images, stylesheets, javascript files. The HTML page references these resources via different tags such as <img> for images, <script> for javascript.
All detected resources are downloaded. Browsers download many of these resources in parallel, but apply them (javascript and stylesheets) sequentially in the order they where found on the page.
Stylesheets are parsed, and the styles are applied to the DOM of the HTML page. Sometimes, if stylesheets take longer to download, you can see the "raw" HTML page being rendered before the styles are applied. This happens sometimes over a slow connection.
Once the HTML page and related javascript files have been downloaded, the browser calls the "onload" callback function of javascript. Most Javascript heavy applications are started at this time.
Once onload is called, Javascript takes over and can attach handlers for different elements on the web page. Once the handlers have all been installed, interacting with the webpage could call one or more javascript functions that are listening for these events.
Javascript can also manipulate the DOM (the elements on the page), which results in UI updates (what the user sees) and therefore can be used to build a complete app on a single page.
Here is some more reading on the process: http://friendlybit.com/css/rendering-a-web-page-step-by-step/
The best way to examine this interaction is to use Developer tools on Chrome/FireFox or IE and view the network activity when you visit a web page.
I'm a project manager not a developer, and we stood up a really basic site in windows azure, We've now been asked to track usage of the site, and I'm curious what a request is. The site is accessed through a mobile device and performs a basic calculation. So I believe that there is only one request per visit, changing numbers you enter in various fields to what if the calculation doesn't seem to refresh the page. Is that a fair assumption or are there some basic checks I can do to understand if I need to aggregate requests to really track or interpret usage of the site.
Whenever your web browser fetches a file (a page, a picture, etc) from
a web server, it does so using HTTP - that's "Hypertext Transfer
Protocol". HTTP is a request/response protocol, which means your
computer sends a request for some file (e.g. "Get me the file
'home.html'"), and the web server sends back a response ("Here's the
file", followed by the file itself).
That request which your computer sends to the web server contains all
sorts of (potentially) interesting information. We'll now examine the
HTTP request your computer just sent to this web server, see what it
contains, and find out what it tells me about you.
http://djce.org.uk/dumprequest
tip: add google analytics to your site. It will give to you the number of views and unique users.
I get this question a lot =/
But I only know how to answer it at a very high level.
From the minute a user enters a URL and hits enter, what happens on the client and server side, and how do requests/responses work? How does the server interact with CGI/interpreters?
It would be helpful too if you could direct me to a URL that has this information in detail, or if you can answer it.
When I describe this to people I always feel like theyre looking for specifics and I'm not giving enough detail.
Thanks!
Client initiates communication (Usually a HTTP GET request)
Server receives REQUEST-HEADER and parses the URL contained within.
Server does a lookup to see if any URL matches locally in a harddrive-folder. If the webserver handles virtual servers like a Microsoft IIS, then it will determin which folder to search after retrieving the "www.domain.com" part from the REQUEST header.
If web-document (HTML file) is found, then Server sends this back as RESPONSE + a HTTP status code (eg. 200 saying: found, this request went well, where as 404 is "didnt find that file")
Client (browser) receives RESPONSE and can now display it as it wants. If it contains a render engine, then it will search for patterns (HTML tags or whatever language) and then display it as such.
This is also called "stateless" as the server closes communication with client after the client has received everything from the reponse-stream.
Therefore the server cannot know if the client is still connected nor if its comming back later. Many servers does provide a session object using cookies or similar to track if its the same client that sends the next REQUEST and if so, allowing more "intelligent" server responses - such as seeking, transactions and logins.
How does the internet work?
HTTP Made Really Easy
The Canonical Document: RFC 2616
The client sends request headers to the server (finds the IP via DNS).
The server software (e.g. Apache) calls CGI if it needs to and prepares the response.
It sends headers back as well as the content.