title: How to call axios/api call in Nativescript application
body: <p>I'm trying to build a small application on <code>Nativescript-vue</code> where I'm having backend <code>laravel</code> framework for api calls which needs to be called to get relevant data. For example if user wants to login he needs to validate its credentials through api <code>oauth/token</code> so I'm trying to call this through <code>axios</code> here is my code:</p>
  
  <p>My <code>settings.js</code> file contains.</p>
  
  <pre><code>export const authHeader = {
      'Accept': 'application/json',
      'Content-Type': 'application/json'
  }
  </code></pre>
  
  <p>this is being imported inside my axios calls:</p>
  
  <pre><code>const postData = {
      grant_type: 'password',
      username: user.email,
      password: user.password,
      client_id: clientId,
      client_secret: clientSecret,
      scope: '',
      provider: provider
  }
  const authUser = {}
  axios.post(authUrl, postData, {headers: authHeader}).then(response =&gt; {
      console.log('Inside oauth/token url')
      if(response.status === 200)
      {
          console.log('response received')
      }
  })
  .catch((err) =&gt; {
      if(err.response.status === 401){
         reject('Validation error')
      }
      else
         reject('Something went wrong')
  })
  </code></pre>
  
  <p>when I try to build with command <code>tns debug android --bundle</code> I get <code>chrome-devtools</code> which shows me:</p>
  
  <p><a href="https://i.stack.imgur.com/fAw0U.png" rel="noreferrer"><img src="https://i.stack.imgur.com/fAw0U.png" alt="api being called"></a></p>
  
  <p>Digging more deep into it I can see headers are being passed but those are only provisional:</p>
  
  <p><a href="https://i.stack.imgur.com/4fzDE.png" rel="noreferrer"><img src="https://i.stack.imgur.com/4fzDE.png" alt="headers"></a></p>
  
  <p>As you can see I've <code>console.log</code> inside my application which show me:</p>
  
  <p><a href="https://i.stack.imgur.com/K3GOu.png" rel="noreferrer"><img src="https://i.stack.imgur.com/K3GOu.png" alt="console.log"></a></p>
  
  <p>Even while compiling I get following errors:</p>
  
  <p><a href="https://i.stack.imgur.com/QSJOx.png" rel="noreferrer"><img src="https://i.stack.imgur.com/QSJOx.png" alt="compiling error"></a></p>
  
  <p>Guide me how can I achieve this. Thanks.</p>
  
  <p><strong>Edit:</strong></p>
  
  <p>Similarly I used <code>nativescript's</code> own <code>http</code> <a href="https://docs.nativescript.org/ns-framework-modules/http" rel="noreferrer">documentation</a> something like this:</p>
  
  <pre><code>const httpModule = require("http");
  
  httpModule.request({
      url: "http://iguru.local/oauth/token",
      method: "POST",
      headers: { "Content-Type": "application/json" },
      content: JSON.stringify({
          grant_type: 'password',
          username: this.user.email,
          password: this.user.password,
          client_id: 'check',
          client_secret: 'check',
          scope: '',
          provider: 'check'
      })
  }).then((response) =&gt; {
      // Argument (response) is HttpResponse
      console.log('Action called')
      if(response.status === 200)
      {
          console.log('Response recieved')
      }
  }, (e) =&gt; {
      console.log('Something went wrong')
  });
  </code></pre>
  
  <p>I'm getting the same result, moreover I tried api from server end ex <a href="http://confidenceeducare.com/oauth/token" rel="noreferrer">http://confidenceeducare.com/oauth/token</a> it happens to be same. Normal <code>Vue</code> application calls the api perfectly fine. I guess there is some problem with the <code>nativescript</code> application. Do I need to import something more? I'm stuck with it.</p>
  
  <p>If anybody is thinking my api end point is broken, I tried using the urls mentioned in example i.e. <code>https://httpbin.org/post</code>:</p>
  
  <p><a href="https://i.stack.imgur.com/nERzX.png" rel="noreferrer"><img src="https://i.stack.imgur.com/nERzX.png" alt="http"></a></p>
  
  <p>and:</p>
  
  <p><a href="https://i.stack.imgur.com/0MUio.png" rel="noreferrer"><img src="https://i.stack.imgur.com/0MUio.png" alt="enter image description here"></a></p>
  
  <p>When I checked my api in <code>postman</code> it is working over there, I'm getting at least a response with status code:</p>
  
  <p><a href="https://i.stack.imgur.com/IPJhf.png" rel="noreferrer"><img src="https://i.stack.imgur.com/IPJhf.png" alt="postman response"></a></p>
  
  <p><strong>Edit 2:</strong>
  For reference github repository <a href="https://github.com/nitish1986/sample_mobile_app" rel="noreferrer">https://github.com/nitish1986/sample_mobile_app</a></p>