无法通过xhr请求将post参数传递给yii2控制器

Question

根据我的项目，我正在对yii2控制器执行xhr请求

我认为请求的结构是这样的

var xhr = new XMLHttpRequest();

xhr.open('POST', '$urlToController', true);
xhr.setRequestHeader("Content-type","application/json");                
xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");

xhr.onreadystatechange = function () {
     if(xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {
           console.log(xhr.responseText);
     }
};

// Print on console first
console.log({ id: JSON.stringify($('#grid').yiiGridView('getSelectedRows')), _csrf : csrfToken}); 


xhr.send({ id: JSON.stringify($('#grid').yiiGridView('getSelectedRows')), _csrf : csrfToken}});

这是我的控制器：

public function actionTargetController() {

    if(Yii::$app->request->isAjax) {

        Yii::$app->response->format = Response::FORMAT_JSON;

        if (Yii::$app->request->isPost) {

            $post = Yii::$app->request->post();
            return $post; // Print $post 
        }
   }
}

当我尝试使用xhr.send()发送数据时，我在yii2控制器中什么也没有收到，并且得到的响应始终为'[]'（空数组）

我也尝试过使用FormData对象发送数据，但结果是相同的。

我在哪里做错了？ 预先感谢所有帮助

PS：

_csrf参数也未通过，因此我在beforeAction方法中禁用了csrf验证。

Answer 1

更改MIME类型并更改您发布的数据。

var xhr = new XMLHttpRequest();

xhr.open('POST', '$urlToController', true);
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded"); // <------ other mime type               
xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");

xhr.onreadystatechange = function () {
     if(xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {
           console.log(xhr.responseText);
     }
};

var params = $('#grid').yiiGridView('getSelectedRows')
    .map(function (value) { return "selectedRowIds[]=" + value;  }).join("&");

xhr.send("_csrf=" + csrfToken + (params ? "&" + params : ""));

现在，您可以通过以下操作获取发布的数据：

$post = Yii::$app->request->post('selectedRowIds');

您将得到一个整数数组。

您也可以为此使用jQuery，因为您已经在使用它。 容易得多：

var params = {selectedRowIds: $('#grid').yiiGridView('getSelectedRows'), _csrf : csrfToken};
$.post('$urlToController', params).done(function(data) {
    console.log(data);
})