Imagine you are sending this payload to a browser:
html<html>
<body>
<h1>Hello, world!</h1>
</body>
</html>
You may be tempted to think that the browser will render the HTML as a web page. But actually, it depends⦠Lets make it clear.
Lets write a simple HTTP server in Go to send this payload to a browser. But everytime we send the payload, keep the payload the same, but change the content type.
gopackage main
import (
"net/http"
)
func main() {
http.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {
w.Header().Set("Content-Type", "text/html")
w.Write([]byte("<html><body><h1>Hello, world!</h1></body></html>"))
})
http.ListenAndServe(":8080", nil)
}
The payload will be kept the same. Just focus on this line:
gow.Header().Set("Content-Type", "text/html")
We set the content type to text/html
.
Now, lets run the server and open the browser to http://localhost:8080
.
You will see the HTML rendered as a web page. A bold header with the text βHello, world!β.
Preview:
Hello, world!
Now, lets change the content type to text/plain
.
gow.Header().Set("Content-Type", "text/plain")
This time, the browser will render the HTML as a plain text.
Preview:
<html><body><h1>Hello, world!</h1></body></html>
Now, lets change the content type to application/json
to see what will happen.
gow.Header().Set("Content-Type", "application/json")
The browser will complain about syntax error:
SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data <html><body><h1>Hello, World!</h1></body></html>
Now, lets change the content type to application/xml
.
As you may think, this HTML body is compatible with XML. But browser will still not render it as a web page.
The output is:
This XML file does not appear to have any style information associated with it. The document tree is shown below.
xml<html>
<body>
<h1>Hello, World!</h1>
</body>
</html>
And finally, letβs try application/javascript
.
gow.Header().Set("Content-Type", "application/javascript")
The browser will decide to render the JavaScript code as plain text. Because it is a source code, not an executable code.
Preview:
<html><body><h1>Hello, world!</h1></body></html>
Yes, and there, the final question: What if I donβt set the content type at all?
gow.Header().Set("Content-Type", "")
You may think that the browser will render the HTML as a web page. Yes, this time you are right. Browsers are smart enough to detect it is an HTML document.
Preview:
Hello, world!
Butβ¦
If we send a JSON payload, without setting the content type, the browser will render it as a plain text.
gopackage main
import (
"net/http"
)
func main() {
http.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {
w.Write([]byte(`{ "message": "Hello, World!" }`))
})
http.ListenAndServe(":8080", nil)
}
Conclusion
You know how HTML and XML are similar. In the past, we developers were sending an SGML compliant document to the browser. Itβs type was defining our area of expertise. Backend or frontend. So this is technically possible to say this: βThe only real difference between backend and frontend is the content typeβ.
Album of the day: