The vue framework recommends using axios to send ajax requests, and it is inevitable to use axios when using vue. Sending asynchronous requests generally uses the GIT and POST methods, and the GIT method request parameters will be spliced on the url, while the POST method will not appear on the url due to security issues. POST requests also have caveats, and there are different data encoding formats for the POST method. Without further ado, let's serve the dishes directly.
Four encoding methods for post submitted data
1.application/x-www-form-urlencoded
This should be the most common post encoding method, and the general form submission is submitted in this way by default. Most server languages have good support for this approach. In PHP, you can use $_POST["key"] to get the value of the key. In node , we can use the querystring middleware to separate the parameters. Most server-side languages have good support for this approach.
import axios from "axios";
import qs from 'Qs';
let data = {"name":"value"}
data = qs.stringify(data)
axios.post(url,data).then(res => {
console.log(res);
})2.application/json
Axios submits by default using this format. If this encoding method is used, the serialized json string will be passed to the background. Now more and more people use it as a request header to tell the server that the message body is a serialized JSON string. Due to the popularity of the JSON specification, all major browsers except low-version IE all natively support JSON.stringify, and the server-side language also has functions for processing JSON, so you will not encounter any trouble when using JSON.
import axios from "axios";
let data = {"name":"value"}
axios.post(url,data).then(res => {
console.log(res);
})3.multipart/form-data
This is also a relatively common post data format. When we use a form to upload files, we must make the enctype attribute of the form form or the contentType parameter of ajax equal to multipart/form-data. This method is generally used to upload files, and major server languages also have good support for it.
import axios from 'axios'
let data = new FormData();
data.append('name1','value1');
data.append('name2','value2');
axios.post(url,data)
.then(res=>{
console.log(res);
})4.text/xml
The text/xml encoding method is rarely used by ordinary people, and we are ordinary people, so we generally don't care too much about it. (I haven't used it myself, so I smile)
I learned on the Internet that the parameter should probably be passed in the format of an xml file. Such a request is also called an XML-RPC request. Try not to use this encoding method, personally feel that this method is outdated.
The data encoding format of the POST request should be discussed with the backend to determine the content-type to avoid unnecessary trouble.
If there is any error in the description, please correct me!