1// axios POST request
2const options = {
3 url: 'http://localhost:3000/api/home',
4 method: 'POST',
5 headers: {
6 'Accept': 'application/json',
7 'Content-Type': 'application/json;charset=UTF-8'
8 },
9 data: {
10 name: 'David',
11 age: 45
12 }
13};
14
15axios(options)
16 .then(response => {
17 console.log(response.status);
18 });
1const axios = require('axios');
2
3// Make a request for a user with a given ID
4axios.get('/user?ID=12345')
5 .then(function (response) {
6 // handle success
7 console.log(response);
8 })
9 .catch(function (error) {
10 // handle error
11 console.log(error);
12 })
13 .then(function () {
14 // always executed
15 });
16
17// Optionally the request above could also be done as
18axios.get('/user', {
19 params: {
20 ID: 12345
21 }
22 })
23 .then(function (response) {
24 console.log(response);
25 })
26 .catch(function (error) {
27 console.log(error);
28 })
29 .then(function () {
30 // always executed
31 });
32
33// Want to use async/await? Add the `async` keyword to your outer function/method.
34async function getUser() {
35 try {
36 const response = await axios.get('/user?ID=12345');
37 console.log(response);
38 } catch (error) {
39 console.error(error);
40 }
41}
1const axios = require('axios');
2
3// Make a request for a user with a given ID
4axios.get('/user?ID=12345')
5 .then(function (response) {
6 // handle success
7 console.log(response);
8 })
9 .catch(function (error) {
10 // handle error
11 console.log(error);
12 })
13 .then(function () {
14 // always executed
15 });
16
1const axios = require('axios');
2
3const res = await axios.get('https://httpbin.org/get', { params: { answer: 42 } });
4
5res.constructor.name; // 'Object', means `res` is a POJO
6
7// `res.data` contains the parsed response body
8res.data; // { args: { answer: 42 }, ... }
9res.data instanceof Object; // true
1//EXAMPLE INPUTS
2const url='/'
3const data={
4 name1:value1,
5 name2:value2
6}
7
8//ACTUAL USAGE
9const parsedData = new URLSearchParams();
10Object.getOwnPropertyNames(data).map((property) =>
11 parsedData.append(property, data[property])
12);
13 axios
14 .post(url, parsedData)
15 .then((res) => {
16 //handle result
17 })
18 .catch((err) => {
19 //handle error
20 });
1<script>
2 export default {
3 data(){
4 return {
5 urlBase: 'http://localhost:8000/api/v1/marca',
6 nomeMarca: '',
7 arquivoImagem: []
8 }
9 },
10 methods: {
11 carregarImagem(e){
12 this.arquivoImagem = e.target.files // object array
13 },
14 guardar(){
15 // Warning : e.target.files is an array of objects
16 console.log(this.nomeMarca , this.arquivoImagem[0])
17
18 /* axios.post( <url>,
19 <request_content>,
20 <request_config>
21 )
22 */
23
24 /*
25 When we are talking about http requests for the backend
26 of our application that involve sending files,
27 we need to set the body of our request to
28 being of the form-data type.
29 */
30
31 // program a form via javascript just like the POSTMAN form
32
33 let formData = new FormData()
34 formData.append('nome', this.nomeMarca)
35 formData.append('imagem', this.arquivoImagem[0])
36
37 let config = {
38 headers: {
39 'Content-Type': 'multipart/form-data',
40 'Accept': 'application/json'
41 }
42 }
43
44 axios.post(this.urlBase, formData, config)
45 .then(response => {
46 console.log(response)
47 })
48 .catch(errors => {
49 console.log(errors)
50 })
51 }
52 }
53 }
54</script>
55