For details about sending and receiving json data at the front and back ends, and about receiving json data

For details about sending and receiving json data at the front and back ends, and about receiving json data

Preface

Recently, I used the flask framework in the background to receive and use native JavaScript and jQuery ajax sending at the front end. I only wrote down what I got during my development project, I will share it with you for your reference and study. Let's talk about it later. Let's take a look at the detailed introduction:

1. Receive json data in flask

1. Use the request. form. get () method of flask

Python background code

From flask import Flaskfrom flask import jsonifyfrom flask import requestimport json... # login @ app. route ("/flask/login", methods = ['post']) def login (): data _ = request. form. get ('data') data = json. loads (data) username = data ['username'] password = data ['Password'] rem = False if data ['remember']: rem = True return jsonify ({"login": Login. login (username, password, rem)}) # returns a Boolean value.

2. Use the request. get_data () method of flask

Python background code

From flask import Flaskfrom flask import jsonifyfrom flask import requestimport json... # login @ app. route ("/flask/login", methods = ['post']) def login (): data = request. get_data () data = json. loads (data) username = data ['username'] password = data ['Password'] rem = False if data ['remember']: rem = True return jsonify ({"login": Login. login (username, password, rem)}) # returns a Boolean value.

3. Use the request. get_json () method of flask

Python background code

From flask import Flaskfrom flask import jsonifyfrom flask import request... # login @ app. route ("/flask/login", methods = ['post']) def login (): data = request. get_json () username = data ['username'] password = data ['Password'] rem = False if data ['remember']: rem = True return jsonify ({"login": Login. login (username, password, rem)}) # returns a Boolean value.

Ii. Sending json data at the front end

1. Native XMLHttp Transmission

Function login () {var username = document. getElementById ("username "). value; var password = document. getElementById ("password "). value; var remember = document. getElementById ("remember "). checked; var xmlhttp; if (window. XMLHttpRequest) {// IE7 +, Firefox, Chrome, Opera, and Safari run the code xmlhttp = new XMLHttpRequest ();} else {// IE6, the IE5 Browser executes the code xmlhttp = new ActiveXObject ("Microsoft. XMLHTTP ");} xmlhttp. onreadystatechange = function () {if (xmlhttp. readyState === 4 & xmlhttp. status = 200 ){...}}; xmlhttp. open ("POST", "/flask/login", true); xmlhttp. setRequestHeader ("Content-type", "application/json"); // these two parts are very important. I think most of them use xmlhttp on the Internet. send ("username =" + username + "& password =" + "). In this way, the system still needs to parse the request and directly send some var data = {" username "in the following format ": username "password": password "remember": remember}; var data_json = JSON. stringify (data); xmlhttp. send (data_json );}

Appendix: json data parsing

Var text = xmlhttp. responseText; // convert a json string to a js object using the eval () method, and parse it to obtain the content var result = eval ("(" + text + ")"); if (result) {} else {alert ("enter the correct user name and password ");}

2. ajax Transmission

 $(document).ready(function () { var data = { "username": "adamin", "password": "123456789", "remember": true } $.ajax({  url: "/flask/login",  type: "POST",  data: data,  success: function () {     } }) })

Summary

The above is all the content of this article. I hope the content of this article will help you in your study or work. If you have any questions, please leave a message to us. Thank you for your support.