title: I am getting the error Vue warn]: Error in v-on handler (Promise/async): "Error: Request failed with status code 404"
body: <p>I am new to vue and have been trying to follow a tutorial for adding Axios, but I end up getting the error and I cannot find a way to fix it.
  I am running it on localhost:3000 but I tried to go back to 8080 and it is still showing me the problem, it would be amazing if you guys could give me some tips.</p>
  <p>Here is the error</p>
  <pre><code>xhr.js?b50d:210 POST http://localhost:3000/register 404 (Not Found)
  dispatchXhrRequest @ xhr.js?b50d:210
  xhrAdapter @ xhr.js?b50d:15
  dispatchRequest @ dispatchRequest.js?5270:58
  request @ Axios.js?0a06:112
  Axios.&lt;computed&gt; @ Axios.js?0a06:147
  wrap @ bind.js?1d2b:9
  _callee$ @ Register.vue?0103:55
  tryCatch @ runtime.js?96cf:63
  invoke @ runtime.js?96cf:294
  eval @ runtime.js?96cf:119
  asyncGeneratorStep @ asyncToGenerator.js?1da1:3
  _next @ asyncToGenerator.js?1da1:25
  eval @ asyncToGenerator.js?1da1:32
  eval @ asyncToGenerator.js?1da1:21
  handleSubmit @ Register.vue?0103:55
  submit @ Register.vue?01bd:11
  invokeWithErrorHandling @ vue.runtime.esm.js?2b0e:1863
  invoker @ vue.runtime.esm.js?2b0e:2188
  original._wrapper @ vue.runtime.esm.js?2b0e:6961
  vue.runtime.esm.js?2b0e:619 [Vue warn]: Error in v-on handler (Promise/async): &quot;Error: Request failed with status code 404&quot;
  
  found in
  
  ---&gt; &lt;Register&gt; at src/components/Register.vue
         &lt;App&gt; at src/App.vue
           &lt;Root&gt;
  warn @ vue.runtime.esm.js?2b0e:619
  logError @ vue.runtime.esm.js?2b0e:1893
  globalHandleError @ vue.runtime.esm.js?2b0e:1888
  handleError @ vue.runtime.esm.js?2b0e:1848
  eval @ vue.runtime.esm.js?2b0e:1865
  Promise.catch (async)
  invokeWithErrorHandling @ vue.runtime.esm.js?2b0e:1865
  invoker @ vue.runtime.esm.js?2b0e:2188
  original._wrapper @ vue.runtime.esm.js?2b0e:6961
  vue.runtime.esm.js?2b0e:1897 Error: Request failed with status code 404
      at createError (createError.js?2d83:16:1)
      at settle (settle.js?467f:17:1)
      at XMLHttpRequest.onloadend (xhr.js?b50d:66:1)
  logError @ vue.runtime.esm.js?2b0e:1897
  globalHandleError @ vue.runtime.esm.js?2b0e:1888
  handleError @ vue.runtime.esm.js?2b0e:1848
  eval @ vue.runtime.esm.js?2b0e:1865
  Promise.catch (async)
  invokeWithErrorHandling @ vue.runtime.esm.js?2b0e:1865
  invoker @ vue.runtime.esm.js?2b0e:2188
  original._wrapper @ vue.runtime.esm.js?2b0e:6961
  </code></pre>
  <p>for register in inspect
  when right something it doesn't work</p>
  <pre><code>Request URL: http://localhost:3000/register
  Request Method: POST
  Status Code: 404 Not Found
  Remote Address: 127.0.0.1:3000
  Referrer Policy: strict-origin-when-cross-origin
  </code></pre>
  <p>But in general, this shows it's okay</p>
  <pre><code>Request URL: http://localhost:3000/register
  Request Method: GET
  Status Code: 304 OK
  Remote Address: 127.0.0.1:3000
  Referrer Policy: strict-origin-when-cross-origin
  </code></pre>
  <pre><code>&lt;template&gt;
      &lt;form @submit.prevent=&quot;handleSubmit&quot;&gt;
          &lt;h3&gt; Sign up &lt;/h3&gt;
  
      &lt;div class = &quot;form-group&quot;&gt;
          &lt;label&gt;First Name&lt;/label&gt;
          &lt;input type =&quot;text&quot; class =&quot;form-control&quot; v-model =&quot;first_name&quot; palceholder=&quot;First Name&quot; /&gt;
      &lt;/div&gt;
      &lt;div class=&quot;form-group&quot;&gt;
          &lt;label&gt;Last Name&lt;/label&gt;
          &lt;input type=&quot;text&quot; class =&quot;form-control&quot; v-model =&quot;last_name&quot; placeholder= &quot;Last Name&quot;/&gt;
      &lt;/div&gt;
  
      &lt;div class = &quot;form-group&quot;&gt;
          &lt;label&gt;Email&lt;/label&gt;
          &lt;input type=&quot;text&quot; class =&quot;form-control&quot; v-model =&quot;email&quot; placeholder= &quot;Email&quot;/&gt;
      &lt;/div&gt;
      &lt;div class= &quot;form-group&quot;&gt;
          &lt;label&gt;Password&lt;/label&gt;
          &lt;input type=&quot;text&quot; class =&quot;form-control&quot; v-model =&quot;password&quot; placeholder= &quot;Password&quot;/&gt;
      &lt;/div&gt;
  
       &lt;div class= &quot;form-group&quot;&gt;
          &lt;label&gt;Confirm Password&lt;/label&gt;
          &lt;input type=&quot;text&quot; class =&quot;form-control&quot; v-model=&quot;confirm_password&quot; placeholder= &quot; Confirm Password&quot;/&gt;
      &lt;/div&gt;
  
      &lt;button class= &quot;btn btn-primary btn-block&quot;&gt;Sign Up&lt;/button&gt;
      &lt;/form&gt;
      
  &lt;/template&gt;
  
  &lt;script&gt;
  
  import axios from 'axios'
  
  export default {
      
      name: 'Register',
  
      data() {
  
          return {
  
              first_name: '',
              last_name: '',
              email: '',
              password: '',
              confirm_password: ''
              
          }
      },
      methods:  {
  
          async handleSubmit() {
  
              const response = await axios.post('register', {
  
                  first_name: this.first_name,
                  last_name: this.last_name,
                  email: this.email,
                  password: this.password,
                  confirm_password: this.confirm_password
  
  
              });
  
              console.log(response);
          }
      }
  }
  &lt;/script&gt;
  </code></pre>
  <pre><code>import axios from 'axios'
  
  export default () =&gt; {
      return axios.create({
        baseURL: 'http://localhost:3000/'
      })
    }
  </code></pre>
  <pre><code>import Vue from 'vue'
  import App from './App.vue'
  import router from './router'
  import './axios'
  
  Vue.config.productionTip = false
  
  new Vue({
    router,
    render: h =&gt; h(App),
  }).$mount('#app')
  </code></pre>
  <p>Sorry this isn't formatted right I have been trying to figure it out for days and cannot seem to work it out</p>