[Vuejs]-Json server POST request not working by axios

by

0👍

In the Postman example object you provided

{  
   "mainTab": {  
      "m_actual":0,
      "m_refresh":2000,
      "m_actual":0,
      "m_refresh":4000
     } 
  }

The fields are embedded in an object accessible via the mainTab key.
However, in your actual code examples you are providing the object with the desired fields (like m_refresh) directly and not in an embedded manner.

So, my suggestion is to wrap the object containing the data to make the posting call look like this:

axios.post('http://35.195.249.40:3004/users', { mainTab: data },
  {
    headers:  { 
      'Accept': 'application/json',
      'Content-Type': 'application/json'
    }
  }
)

0👍

these provided axios.post provide this code in response 

    { data: '',
JS:   status: null,
JS:   statusText: '',
JS:   headers: {},
JS:   config:
JS:    { adapter: { [Function: xhrAdapter] [length]: 1, [name]: 'xhrAdapter', [prototype]: [Object] },
JS:      transformRequest: { '0': [Object] },
JS:      transformResponse: { '0': [Object] },
JS:      timeout: 0,
JS:      xsrfCookieName: 'XSRF-TOKEN',
JS:      xsrfHeaderName: 'X-XSRF-TOKEN',
JS:      maxContentLength: -1,
JS:      validateStatus: { [Function: validateStatus] [length]: 1, [name]: 'validateStatus', [prototype]: [Object] },
JS:      headers:
JS:       { Accept: 'application/json',
JS:         'Content-Type': 'application/json' },
JS:      method: 'post',
JS:      url: 'http://35.195.249.40:3004/users',
JS:      data: '{"data":{"mainTab":{"m_actualHP":0,"m_refreshHP":2000,"m_actualMP":666666,"m_refreshMP":4000}}}' },
JS:   request:
JS:    { UNSENT: 0,
JS:      OPENED: 1,
JS:      HEADERS_RECEIVED: 2,
JS:      LOADING: 3,
JS:      DONE: 4,
JS:      _responseType: '',
JS:      textTypes:
JS:       [ 'text/plain',
JS:         'application/xml',
JS:         'application/rss+xml',
JS:         'text/html',
JS:         'text/xml',
JS: ...
JS: 'CONSOLE LOG END | CONSOLE DIR STARTS'
JS: ==== object dump start ====
JS: data: ""
JS: status: "null"
JS: statusText: ""
JS: headers: {}
JS: config: {
JS:   "transformRequest": {},
JS:   "transformResponse": {},
JS:   "timeout": 0,
JS:   "xsrfCookieName": "XSRF-TOKEN",
JS:   "xsrfHeaderName": "X-XSRF-TOKEN",
JS:   "maxContentLength": -1,
JS:   "headers": {
JS:     "Accept": "application/json",
JS:     "Content-Type": "application/json"
JS:   },
JS:   "method": "post",
JS:   "url": "http://35.195.249.40:3004/users",
JS:   "data": "{\"data\":{\"mainTab\":{\"m_actualHP\":0,\"m_refreshHP\":2000,\"m_actualMP\":666666,\"m_refreshMP\":4000}}}"
JS: }
JS: request: {
JS:   "UNSENT": 0,
JS:   "OPENED": 1,
JS:   "HEADERS_RECEIVED": 2,
JS:   "LOADING": 3,
JS:   "DONE": 4,
JS:   "_responseType": "",
JS:   "textTypes": [
JS:     "text/plain",
JS:     "application/xml",
JS:     "application/rss+xml",
JS:     "text/html",
JS:     "text/xml"
JS:   ],
JS:   "_listeners": {},
JS:   "_readyState": 4,
JS:   "_options": {
JS:     "url": "http://35.195.249.40:3004/users",
JS:     "method": "POST",
JS:     "headers": {
JS:       "Accept": "application/json",
JS:       "Content-Type": "application/json"
JS:     },
JS:     "content": "{\"data\":...

I figured out axios would not work with http. It needs https.
Is there possibility to make it working without https?

other solution could be running json server with https.
Im using this server so what im doing im make npm start in ubuntu and server starts
https://github.com/halfzebra/json-server-example

there is written on github to use https://github.com/typicode/hotel this to provide https but it working on localhost. I need to run it on global IP over https

Leave a comment