Webpack代理不会重定向到指定端口

时间:2020-06-21 18:49:06

标签: api webpack

我正在尝试配置Webpack登录名和注册表单,以将请求代理到运行在8080端口上的后端API。但是,它永远不会到达端口8080,并显示404或400错误。您知道可能是什么原因吗?我尝试了多个Stackoverflow答案,但问题仍然存在。 我的webpack.config.js

    devServer: {
            port: 3000,
            open: true,
            proxy: {
                '/users/**': {
                target: 'http://localhost:8080',
                secure: false,
                changeOrigin:true
}

scripts.js

import './styles.css'
import axios from 'axios';
const API_URL = '/users/'



let loginForm = document.getElementById('signin-form')

loginForm.addEventListener('submit', e => {
    e.preventDefault()
    let loginFormData = new FormData(loginForm)
    console.log(loginFormData)
    axios.post(`${API_URL}login/`, loginFormData)
        .then(response => {
            alert("You've been successfully authorized")
        })
        .catch(error => alert('wrong credentials, please try again'))
})

index.html

  <div class="login-form">
    <form action="/users/login/" method="post" id="signin-form">
      <input type="text" placeholder="Email or Username" class="input" name="username" id="username"><br />
      <input type="password" placeholder="Password" class="input"><br />
      <input type="submit" value= "Login" name="btn">
      <span><a href="#">I forgot my username or password.</a></span>
    </form>
   </div>

我得到POST http://localhost:3000/users/login/ 404 (Not Found)Failed to load resource: the server responded with a status of 400 (Bad Request),它们都在3000端口上

0 个答案:

没有答案