Symfony 4 FOSuserbundle - 通过 React-Redux Axios 提交表单

Question

我正在使用 Symfony 4 构建一个 PWA back-end 并且还使用 FOSUserbundle 来管理用户。

当使用 redux-form 和 Axios 提交注册表时，它没有 post 按要求输入信息。

这是我在 Firefox 开发工具的网络选项卡上看到的 posted;

   {"fos_user_registration_form[email]":"email@gmail.com",
    "fos_user_registration_form[plainPassword[first]":"password",
    "fos_user_registration_form[plainPassword[second]":"password",
    "fos_user_registration_form[username]":"username"}

这是 $_POST 转储在控制器中显示的内容：

array(1) { ["{"fos_user_registration_form"]=> array(1) { ["email"]=> string(0) "" } }

正确的 $_POST 输出应该是（当 post 使用常规 Symfony/FOSUserbundle 形式时）：

array(1) { ["fos_user_registration_form"]=> array(3) { ["email"]=> string(22) "email@gmail.com" ["username"]=> string(8) "username" ["plainPassword"]=> string(8) "Array(2)" } }

在处理下面 post 的 Redux 操作中，我使用了与我在 'regular' Symfony/FOSUserbundle [=37= 上观察到的相同的 HTTP Headers ] 请求：

export function actionSubmitRegister(values){
const url = "/register/";
return {
    type: SUBMIT_REGISTER,
    payload: axios.post(url,{
            "fos_user_registration_form[email]": values.fos_user_registration_form['email'],                    
            "fos_user_registration_form[plainPassword][first]": values.fos_user_registration_form['plainPassword']['first'],
            "fos_user_registration_form[plainPassword][second]": values.fos_user_registration_form['plainPassword']['second'],
            "fos_user_registration_form[username]": values.fos_user_registration_form['username']},
            {
                headers: {
                    'Accept':'text/html,application/xhtml+xml',
                    'Content-Type':'application/x-www-form-urlencoded'}
        })
}
}

所以，我确实遇到了格式问题，但我似乎无法正确排列它。

谢谢

Answer 1

Axios 似乎无法处理 'Content-Type':'application/x-www-form-urlencoded' 尽管接受了 header 参数。

按照 documentation, one needs to use URLSearchParameters 来完成。还需要一个 polyfill 来解决不支持它的常见问题 (IE)。

因此，Redux 操作的代码应如下所示（不使用 polyfill）：

export function actionSubmitRegister(values){
const url = "/register/";

let data = new URLSearchParams();
data.append("fos_user_registration_form[email]", values.fos_user_registration_form['email']);
data.append("fos_user_registration_form[plainPassword][first]", values.fos_user_registration_form['plainPassword']['first']);
data.append("fos_user_registration_form[plainPassword][second]", values.fos_user_registration_form['plainPassword']['second']);
data.append("fos_user_registration_form[username]",values.fos_user_registration_form['username']);
return {
    type: SUBMIT_REGISTER,
    payload: axios.post(url, data)
}
}

Symfony 4 FOSuserbundle - 通过 React-Redux Axios 提交表单

Symfony 4 FOSuserbundle - submit form via React-Redux Axios

php

reactjs

symfony

fosuserbundle

axios