web-dev-qa-db-ja.com

空の POST サーバー上のデータ AJAX を使用してリクエスト Angular $ http

AngularJSを使用してAJAXフォームを作成し、それをWordpressを実行しているサーバー上で処理します。

サーバーサイドハンドラは簡単です：

function rnr_contact_callback() {
    $name = $_POST['firstName'] . ' ' . $_POST['lastName'];

    wp_mail(
        '[email protected]',
        'Contact form submitted',
        $name . '(' . $_POST['email'] . ') sent a message: ' . $_POST['comment']
    );

    exit;
}

クライアント側コントローラ

angular.module('app').controller('ContactForm', function($scope, $http) {
    $scope.sendContactForm = function() {
        $http({ 
            method: 'POST', 
            url: '/wp-admin/admin-ajax.php', 
            params: {
                action: 'contact',
                firstName: $scope.userFirstName,
                lastName: $scope.userLastName,
                email: $scope.userEmail,
                comment: $scope.userComment
            }
        }).success(function(data, status, headers, config) {
            $scope.contactFormSent = true;
        }).error(function(data, status, headers, config) {

        });
    };
});

私は$scopeの一貫性をテストしました、そしてそれは大丈夫です。さらに、POST要求が処理されます。電子メールを受け取ります。問題は、電子メールの本文が() sent a message:のように見えることです。私は、サーバー上で$_POST['...']のどれも設定されていないという結論を出しました。どうして？私は何を間違えますか？

plugin-developmentajax
4
Fleischpflanzerl

わかった。 AJAX要求を処理するすべての関数内で、$_REQUESTの代わりに$_POSTを使用してください。

4
Fleischpflanzerl

アクションを解析します。

function angular_ajax_params_to_post() {
    $is_ajax = ( defined( 'DOING_AJAX' ) && DOING_AJAX );
    if($is_ajax){
        $params = json_decode(file_get_contents('php://input'), true);

        foreach ($params as $param_key => $param_val) {
            $_POST[ $param_key ] = $param_val;
        }
    }
}
add_action( 'plugins_loaded', 'angular_ajax_params_to_post' );

この関数は、角度付きポスト文字列を$ _POST配列に解析します。

3
FlatDev

同じ問題がありました。 Angular $ httpはデフォルトでJSONとしてデータを送信するため、$ _REQUESTは空です。 Yuはデータをformdataとして送信する必要があります。

var app = angular.module('foo', []);

app.config(function ($httpProvider) {
    // send all requests payload as query string
    $httpProvider.defaults.transformRequest = function(data){
        if (data === undefined) {
            return data;
        }
        return jQuery.param(data);
    };

    // set all post requests content type
    $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';
});
2
rmmjohann

PHPでは$ _POSTの代わりに$ _REQUESTを使用する必要があります。

function rnr_contact_callback() {
    $name = $_REQUEST['firstName'] . ' ' . $_REQUEST['lastName'];

    wp_mail(
        '[email protected]',
        'Contact form submitted',
        $name . '(' . $_REQUEST['email'] . ') sent a message: ' . $_POST['comment']
    );

    exit;
}
0
Magico