The front-end provides user selection and input, and generally uses forms to collect data. The
back-end (server) collects the collected data from the front-end. After
processing, the
back-end (consisting of business code) is an intermediary between the front-end and the database. It connects to the database and judges the front-end Can the content of be entered into the database
Front-end: written in html, css, js languages
Back-end: written in python, java, php
database: written in sql language
Django framework: you can directly apply what has been written in the back-end to improve or redevelop the
front-end interaction: front-end The written language is encapsulated with a js object, and it needs to be parsed into an array through json to interpret it to the back-end language.
json (js object expression, mainly used for data interaction): it is a string in a special format, this string It can be recognized by any language, and can be converted into objects in any language. The
format of json and js objects is the same, except that the attribute names in the json string must be enclosed in double quotes. Others are consistent with js syntax.
Classification:
1. Object { }
2. Array []
json format array, add '' on the basis of the original [], and can't put functions and undefined
allowable values: string, array, boolean, null, object, array
1. Remove the quotation marks from the json string and turn it into an object in js (through JSON to play an intermediate role)
var o = JSON.parse (json object)
2. Convert js object to JSON
var o = JSON.stringify (js object)
JSON is the tool'class' of js, parse and stringify are functions of JSON class
Front-end and back-end interaction: The
first process:
front-end: form is collected, action="/" is a certain code submitted to the back-end, method="post (no parameters will be passed behind the browser URL, but get Will pass) "
Backend: class MainHandler class,
def get (access this python program, go to this page) (self) is the same as method="get", pass data to the browser
self.render() forward, send data Go to the designated browser location
def post (self) to get the data passed by the front end (here the front and back ends are in post format, so get is only used for forwarding)
self.get_argument (if there are more than one, add s) ("username")
self .get_argument("pwp")
If __name__ (r "/", MainHandler)
"/" represents the path of the current program
application.listen (8888), 8888 is the port number to identify the program (the program is assigned a port number of 0-65535)
First visit the program ():
1. Run the python file
2. Manually enter a string of addresses in the address bar of the browser: localhost: 8888 or 127.0.0.1: 8888 (the local ip here has the same function as locahost)
and then the program forwards the content Display on the page and
let the user input, post and collect the information to the backend
Another process:
Ajax (a front-end technology, web page development, belongs to asynchronous refresh)
Asynchronous: the call does not get the result immediately, but before the caller gives the result, it does some other things first, which is more efficient
Synchronous: When calling something, the caller must wait for the result before continuing to execute
$.Ajax ({(The incoming object is an object, enclosed in braces)
"type": "post" (The format of the request data, the front and back ends must use the same kind of post or get, otherwise no interaction is possible, generally the front and back ends All use post)
"url": "/" (back-end interface url, server path)
"data": {"i11 (key, used to store'value', name it)": i1, "i22": i2} ( The transmitted data)
})
Then the back end def post (self) gets the data passed by the front end
i1= self.get_argument("i11")
i2= self.get_argument("i22") (input the attribute name here without inputting the attribute value, The attribute names are not the same)
sum=i1+i2 (still a string type at this time) When the front end collects user data, the number will become a string instead of a value,
so it can be changed to sum=int (i1+i2) Calculated, or i1= int (self.get_argument("i11")) in advance
result_data={"result":sum} to encapsulate sum (data is the front-end package and sent to the back-end, result_data is the back-end package and sent back To the front end)
self.write (result_data) write data to the browser
Then the front-end also needs to set the receiver code
"success (function to execute the received content after receiving the back-end command successfully)": function (data (can be named arbitrarily)) {console.log (data.result (result_data belonging to the back-end)) }
Then it can be written as "success" to be displayed: function(data{ipts.eq(2)val (without passing parameters is to read data, passing in is to change) (data.result)}