reactjs - Axios发布请求正文未与Mux服务器一起解析

标签 reactjs go axios

我已经实现了一个API,该API对用户进行身份验证以使用Go对客户端使用react。身份验证路由的处理程序如下:

func (app *application) authenticate(w http.ResponseWriter, r *http.Request) {
    err := r.ParseForm()
    if err != nil {
        app.clientError(w, http.StatusBadRequest)
        return
    }

    username := r.PostForm.Get("username")
    password := r.PostForm.Get("password")

    fmt.Println(r.PostForm)

    u, err := app.user.Get(username, password)
    if err != nil {
        if errors.Is(err, models.ErrNoRecord) || errors.Is(err, bcrypt.ErrMismatchedHashAndPassword) {
            app.notFound(w)
        } else {
            app.serverError(w, err)
        }
        return
    }

    token := jwt.New(jwt.SigningMethodHS256)
    claims := token.Claims.(jwt.MapClaims)

    claims["username"] = u.Username
    claims["name"] = u.Name
    claims["exp"] = time.Now().Add(time.Minute * 30).Unix()

    ts, err := token.SignedString(app.secret)
    if err != nil {
        app.serverError(w, err)
        return
    }

    user := models.UserResponse{u.ID, u.Username, u.Name, "Admin", ts}
    js, err := json.Marshal(user)
    if err != nil {
        app.serverError(w, err)
        return
    }

    w.Header().Set("Content-Type", "application/json")
    w.Write(js)
}

我正在尝试使用Axios从react应用程序向API发送发布请求,如下所示:
const data = JSON.stringify({
    username: params.username,
    password: params.password,
});

api.post('/authenticate', data, {
    headers: {'Content-Type': 'application/json' }
}).then(response => {
    console.log(response);
    resolve({ ok: true, json: () => response.data });
}).catch(err => {
    console.log(err);
    reject('Username or password is incorrect');
})

但是请求返回404错误。 Go控制台显示发布数据为空 map [] 我尝试将Axios请求中的Content-Type header 更改为 multipart/form-data application/x-www-form-urlencoded ,无运气。使用CURL发出请求后,
curl -d "username=user&password=password" -X POST http://localhost:4000/authenticate

该请求返回正确的响应。 postman 工作也很好。仅从Axios发出请求时,可能无法在Go中解析请求正文的可能问题?

最佳答案

可行的解决方案是使用 qs 软件包对数据进行字符串化。

import qs from 'qs';

const data = {
    username: params.username,
    password: params.password,
};

api.post('/authenticate', qs.stringify(data)
).then(response => {
    console.log(response);
    resolve({ ok: true, json: () => response.data });
}).catch(err => {
    console.log(err);
    reject('Username or password is incorrect');
})

关于reactjs - Axios发布请求正文未与Mux服务器一起解析,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59483726/

相关文章:

javascript - React onSubmit 方法仅填充第二个事件

go - 函数类型不能有类型参数

go - 我应该为每个查询或其在 GraphQL 中的所有字段创建解析器吗?

reactjs - 如何从外部 React 组件获取 Auth0 token ?

reactjs - 如何将 axios 中的数组参数传递到 Spring Controller ?

laravel - 带有 Laravel 5.4 后端的 Vuejs 2,发布(未经授权)错误

javascript - react : Access ref passed between components via render props

javascript - 当我尝试在 React 中打印时,为什么 props 不显示

javascript - 为什么我的书没有排列在正确的书架上(React-Redux)?

go - 无法安装bleve,在任何一个中都找不到包 "github.com/blevesearch/zap/v11"