如何使用 AJAX 将 JS 用户输入传递给 Wordpress 子主题 functions.php 中的函数？答案

【问题标题】：How to pass JS user input to a function in Wordpress child theme functions.php using AJAX?如何使用 AJAX 将 JS 用户输入传递给 Wordpress 子主题 functions.php 中的函数？
【发布时间】：2020-01-17 16:52:36
【问题描述】：

我需要将 msearch.js 中的 var search_value 中的数据传递给子主题 functions.php 文件中名为 $woot 的 php 变量，以便它可以作为 wtfwoot() 的返回值，从而用于其他函数。我知道我很接近，但我错过了一些重要的事情。

我已经尝试过使用“echo”和 wp_die() 的其他建议，但包含这些的解决方案不起作用。我也在 AJAX 数组中尝试过 dataType: 'json' ，但我不确定我是否在 wtfwoot() 函数中正确解码。

//Wordpress Hooks（在靠近顶部的子主题functions.php文件中）：

add_action( 'wp_enqueue_scripts', 'mSearch' );

function mSearch() {
        wp_enqueue_script( 'msearchjs', get_stylesheet_directory_uri() . '/msearch.js', array( 'jquery' ),'',true );
        wp_localize_script('msearchjs', 'sAjax', array(
            'ajaxurl' => admin_url('admin-ajax.php')
        ));
}

add_action( 'wp_ajax_wtfwoot', 'wtfwoot' );
add_action( 'wp_ajax_nopriv_wtfwoot', 'wtfwoot' );

//HTML（Wordpress 前端页面）：

<form id="srch" method="post" enctype="multipart/form-data" action="msearch.js">

<input class="membersearch" placeholder="Search" id="membersearch" type="text" name="smemb">

<input class="searchsubmit" type="submit"  value="SUBMIT"></form>

//JS/AJAX文件名为msearch.js（与子主题functions.php在同一目录下）：

function msearchjs(e) {

    var nack = 'NO';
    var search_value = $('#membersearch').val();
    var url = sAjax.ajaxurl;

    if(search_value == '') {

        console.log(nack);

    } else {

        $.ajax ({
            type: 'POST',
            url: sAjax.ajaxurl,
            data: {
                'action': 'wtfwoot',
                'svalue': search_value
            },
            success: function(data) {
                console.log(data);
            },
            error: function() {
                console.log('ERROR');
            }

        });
}
e.preventDefault();

};

$(document).submit( '#srch', msearchjs);

//PHP 函数（在与钩子相同的子主题functions.php 文件中，但靠近底部）：

function wtfwoot() {

    if (isset($_POST)) {

        $woot = $_POST;

        var_dump($woot);

    } else {

        return 'Not working!';

    }
}

输入数据没有传递给 PHP 函数。 wtfwoot() 中的 var_dump 返回 array(0) { }。

Console.log(data) 显示：

数组（2）{ [“行动”]=> 字符串（7）“wtfwoot” [“价值”]=> 字符串（6）“达拉斯” } 0

管理员-AJAX.PHP：

<?php
/**
 * WordPress Ajax Process Execution
 *
 * @package WordPress
 * @subpackage Administration
 *
 * @link https://codex.wordpress.org/AJAX_in_Plugins
 */

/**
 * Executing Ajax process.
 *
 * @since 2.1.0
 */
    define( 'DOING_AJAX', true );
    if ( ! defined( 'WP_ADMIN' ) ) {
    define( 'WP_ADMIN', true );
}

/** Load WordPress Bootstrap */
require_once( dirname( dirname( __FILE__ ) ) . '/wp-load.php' );

/** Allow for cross-domain requests (from the front end). */
send_origin_headers();

// Require an action parameter
if ( empty( $_REQUEST['action'] ) ) {
    wp_die( '0', 400 );
}

/** Load WordPress Administration APIs */
require_once( ABSPATH . 'wp-admin/includes/admin.php' );

/** Load Ajax Handlers for WordPress Core */
require_once( ABSPATH . 'wp-admin/includes/ajax-actions.php' );

@header( 'Content-Type: text/html; charset=' . get_option( 'blog_charset' ) );
@header( 'X-Robots-Tag: noindex' );

send_nosniff_header();
nocache_headers();

/** This action is documented in wp-admin/admin.php */
do_action( 'admin_init' );

$core_actions_get = array(
'fetch-list',
'ajax-tag-search',
'wp-compression-test',
'imgedit-preview',
'oembed-cache',
'autocomplete-user',
'dashboard-widgets',
'logged-in',
);

$core_actions_post = array(
'oembed-cache',
'image-editor',
'delete-comment',
'delete-tag',
'delete-link',
'delete-meta',
'delete-post',
'trash-post',
'untrash-post',
'delete-page',
'dim-comment',
'add-link-category',
'add-tag',
'get-tagcloud',
'get-comments',
'replyto-comment',
'edit-comment',
'add-menu-item',
'add-meta',
'add-user',
'closed-postboxes',
'hidden-columns',
'update-welcome-panel',
'menu-get-metabox',
'wp-link-ajax',
'menu-locations-save',
'menu-quick-search',
'meta-box-order',
'get-permalink',
'sample-permalink',
'inline-save',
'inline-save-tax',
'find_posts',
'widgets-order',
'save-widget',
'delete-inactive-widgets',
'set-post-thumbnail',
'date_format',
'time_format',
'wp-remove-post-lock',
'dismiss-wp-pointer',
'upload-attachment',
'get-attachment',
'query-attachments',
'save-attachment',
'save-attachment-compat',
'send-link-to-editor',
'send-attachment-to-editor',
'save-attachment-order',
'heartbeat',
'get-revision-diffs',
'save-user-color-scheme',
'update-widget',
'query-themes',
'parse-embed',
'set-attachment-thumbnail',
'parse-media-shortcode',
'destroy-sessions',
'install-plugin',
'update-plugin',
'crop-image',
'generate-password',
'save-wporg-username',
'delete-plugin',
'search-plugins',
'search-install-plugins',
'activate-plugin',
'update-theme',
'delete-theme',
'install-theme',
'get-post-thumbnail-html',
'get-community-events',
'edit-theme-plugin-file',
'wp-privacy-export-personal-data',
'wp-privacy-erase-personal-data',
'health-check-site-status-result',
'health-check-dotorg-communication',
'health-check-is-in-debug-mode',
'health-check-background-updates',
'health-check-loopback-requests',
'health-check-get-sizes',
);

// Deprecated
$core_actions_post_deprecated = array( 'wp-fullscreen-save-post', 'press-this-save-post', 'press-this-add-category' );
$core_actions_post            = array_merge( $core_actions_post, 
$core_actions_post_deprecated );

// Register core Ajax calls.
if ( ! empty( $_GET['action'] ) && in_array( $_GET['action'], $core_actions_get ) ) {
    add_action( 'wp_ajax_' . $_GET['action'], 'wp_ajax_' . str_replace( '-', '_', $_GET['action'] ), 1 );
}

if ( ! empty( $_POST['action'] ) && in_array( $_POST['action'], 
$core_actions_post ) ) {
add_action( 'wp_ajax_' . $_POST['action'], 'wp_ajax_' . str_replace( '-', '_', $_POST['action'] ), 1 );
}

add_action( 'wp_ajax_nopriv_heartbeat', 'wp_ajax_nopriv_heartbeat', 1 );

$action = ( isset( $_REQUEST['action'] ) ) ? $_REQUEST['action'] : '';

if ( is_user_logged_in() ) {
    // If no action is registered, return a Bad Request response.
    if ( ! has_action( "wp_ajax_{$action}" ) ) {
        wp_die( '0', 400 );
    }

/**
 * Fires authenticated Ajax actions for logged-in users.
 *
 * The dynamic portion of the hook name, `$action`, refers
 * to the name of the Ajax action callback being fired.
 *
 * @since 2.1.0
 */
    do_action( "wp_ajax_{$action}" );
} else {
// If no action is registered, return a Bad Request response.
    if ( ! has_action( "wp_ajax_nopriv_{$action}" ) ) {
        wp_die( '0', 400 );
    }

    /**
     * Fires non-authenticated Ajax actions for logged-out users.
     *
     * The dynamic portion of the hook name, `$action`, refers
     * to the name of the Ajax action callback being fired.
     *
     * @since 2.8.0
     */
    do_action( "wp_ajax_nopriv_{$action}" );
}
// Default status
wp_die( '0' );

【问题讨论】：

sAjax.ajaxurl 来自哪里？您是否验证了 AJAX 请求是否正在发送和接收？
sAjax.ajaxurl 在钩子中定义......生成的路径转到 wp-admin/admin-ajax.php 并且它正确执行。我只需要 ajax 请求将表单数据传递给 php 函数。我不需要它来发回请求。数据没有传递给函数。
我不明白。您是说sAjax.ajaxurl 定义正确，但您怎么知道？ URL 确实是您可能遇到的唯一问题。
h ttp://thedomain.net/wp-admin/admin-ajax.php （没有空格）...是否可能因为我没有 SSL 而没有触发安装了吗？
哦，等等……你可能是对的……它击中了主域 admin-ajax.php，而不是插件域 admin-ajax.php。两只眼睛总比一只眼睛好。让我测试一下我的发现并回复。

标签： php jquery ajax wordpress

【解决方案1】：

看来您已经知道如何接收 POST 请求了。为了发回响应，这一切都取决于所需的格式。我推荐JSON。试试这个。

$.ajax({
  type: 'POST',
  dataType: 'json',
  url: sAjax.ajaxurl,
  data: {
    'action': 'wtfwoot',
    'svalue': search_value
  },
  success: function(data) {
    console.log(data);
  },
  error: function() {
    console.log('ERROR');
  }
});

// you may need to pass $_POST as an argument here
function wtfwoot() {
  if (isset($_POST['svalue'])) {
    // you need to validate & sanitize the $_POST values here
    $woot = $_POST;
    // process $_POST and return what you need
    return json_encode($woot);
  } else {
    return json_encode(['error' => "POST was empty!"]);
  }
}

【讨论】：

我知道你在做什么，但实际上我不需要将响应发送回浏览器。我需要能够将 $_POST['svalue']; 的值保存在服务器端（如您之前所说的 AJAX 函数之外），以便我可以将其传递给其他 php 短代码通过向每个函数添加诸如 $inputvalue = wtfwoot(); 之类的变量来实现函数。但是 wtfwoot(); 作为 ajax 函数不允许我在服务器端返回值。我开始认为 ajax 不是正确的路线，即使它被推荐。我已经为此工作了好几天。
@Shay - 如果您在 admin-ajax.php 的顶部执行 var_dump("response");，您会在 ajax 响应中看到它吗？
否...并且 ajax 抛出错误：'error: function() {console.log('ERROR');}' 我已将 admin-ajax.php 添加到我的原始帖子中。

【解决方案2】：

@EternalHour 我要关闭这个帖子。当我最初创建表单和函数时，我能够调用 $_POST['value'] 并将其返回到我的一个 php 函数中。但几周前突然停止工作。突然，它又开始工作了。你的帮助太棒了，它帮助我更好地理解了 ajax 和 json。我相信这个线程比其他喜欢它的线程提供了更多。展望未来，我将考虑使用 REST API 解决方案重写应用程序，这对我来说是一种全新的学习体验。

【讨论】：