VueJS 2 Cli converts POST to GET requests using Dev Server

Problem

I started a new VueJS project using the Vue CLI. I use fetch to login to the POST system for the remote DEV server. When I call this method in my local environment, it treats this call as GET, then POST, then OPTIONS, and then GET.

This is what the web panel from Chrome shows after executing the POST request.

enter image description here

When it hits the api server, it executes the processes as a GET request, which returns 405, since it is a POST, not a GET.

Question

Why is there a switch between the two 301s, and then the call is converted to a GET request.


Tools

I am using VueJS 2 CLI, Webpack and Babel

Note. I replaced the real api url and the server with a fake

JavaScript retrieval method

authenticate (username, password) {
  const url = '/api/login/authenticate/'
  return fetch(url, {
    method: 'POST',
    body: JSON.stringify({ username, password }),
    headers: new Headers({
      'Content-Type': 'application/json'
    })
  }).then(res => res.json());
}

Webpack API Proxy Settings

proxyTable: {
   "/api": "http://www.myDevServer.net"
}

+4
1

, - API Webpack, . changeOrigin, .

- API Webpack

proxyTable: {
   "/api": {
      target: "http://www.myDevServer.net",
      changeOrigin: true
   }
}

, -, . - , 301. , POST. , , OPTIONS. , GET . GET POST, , , 405

0
source

Source: https://habr.com/ru/post/1694017/


All Articles