WordPress插件开发：前端AJAX提交文章表单返回0问题求助

我来帮你一步步排查并解决这个问题，AJAX返回0是WordPress AJAX处理里的常见问题，咱们逐个击破：

1. 替换serialize()为FormData处理文件上传 #

你当前用serialize()序列化表单，但这个方法不会包含文件上传数据，而你的表单里有特色图片上传，这会导致文件无法传递，进而让请求处理异常。修改AJAX脚本如下：

jQuery(document).ready(function ($) {
    $('#pp-form-submit').submit(function(e) {
        e.preventDefault(); // 用更规范的方式阻止默认提交
        
        // 创建FormData对象，自动包含所有表单数据（包括文件）
        var formData = new FormData(this);
        
        jQuery.ajax({
            type: "POST",
            url: ajax_object.ajax_url, // 后面会说怎么动态获取这个地址
            data: formData,
            contentType: false, // 必须设置，让浏览器自动处理文件上传的Content-Type
            processData: false, // 必须设置，禁止jQuery自动处理FormData格式
            success: function (response) {
                console.log("提交成功：", response);
                // 这里可以添加表单重置或成功提示
                $('#pp-form-submit')[0].reset();
            },
            error: function(xhr, status, error) {
                console.error("提交出错：", error);
            }
        });
    });
});

2. 移除处理函数中对pp_submit的判断 #

你的pp_html_process()开头判断了isset($_POST['pp_submit'])，但AJAX提交时，这个按钮字段不会被自动加入FormData（点击submit触发AJAX，但按钮本身的value不会被包含）。直接去掉这个判断，我们已经通过action参数指定了要调用的处理函数：

public function pp_html_process() {
    // 移除if ( isset( $_POST['pp_submit'] ) ) {这行判断
        if ( ! isset( $_POST['pp_publisher_name'] ) || ! wp_verify_nonce( $_POST['pp_publisher_name'], 'pp_publisher_save' ) ) {
            wp_send_json_error( esc_attr__( 'Sorry, this action is not allowed.', 'post-publisher' ) );
            exit;
        } else {
            global $current_user;
            $user_id = $current_user->ID;
            $post_title = sanitize_text_field( $_POST['pp_title'] );
            $post_content = sanitize_textarea_field( $_POST['pp_content'] );
            
            // 新增：检查必填字段
            if( empty($post_title) || empty($post_content) ){
                wp_send_json_error( esc_attr__( 'Title and content are required.', 'post-publisher' ) );
                exit;
            }
            
            $new_post = array(
                'post_title' => $post_title,
                'post_content' => $post_content,
                'post_type' => 'post',
                'post_status' => 'draft',
                'post_name' => sanitize_title($post_title), // 用WordPress自带函数处理别名更安全
                'post_author' => $user_id, // 明确指定文章作者
            );
            $post_id = wp_insert_post( $new_post, true );
            
            // 新增：处理文章插入失败的情况
            if( is_wp_error($post_id) ){
                wp_send_json_error( $post_id->get_error_message() );
                exit;
            }
            
            if ( ! function_exists( 'wp_generate_attachment_metadata' ) ) {
                require_once( ABSPATH . "wp-admin" . '/includes/image.php' );
                require_once( ABSPATH . "wp-admin" . '/includes/file.php' );
                require_once( ABSPATH . "wp-admin" . '/includes/media.php' );
            }
            
            // 优化：检查文件是否正常上传
            if( isset($_FILES['pp_featured_image']) && $_FILES['pp_featured_image']['error'] == UPLOAD_ERR_OK ){
                $featured_image = media_handle_upload( 'pp_featured_image', $post_id );
                if ( ! is_wp_error($featured_image) && $featured_image > 0 ) {
                    update_post_meta( $post_id, '_thumbnail_id', $featured_image );
                } else {
                    wp_send_json_error( esc_attr__( 'Failed to upload featured image.', 'post-publisher' ) );
                    exit;
                }
            }
            
            // 返回成功响应，替代默认的0
            wp_send_json_success( array(
                'message' => esc_attr__( 'Post saved as draft successfully!', 'post-publisher' ),
                'post_id' => $post_id
            ) );
        }
    // 移除对应的闭合括号}
}

3. 用本地化脚本传递admin-ajax.php路径 #

不要硬编码AJAX的URL，WordPress提供wp_localize_script来动态传递路径，适配不同环境：

// 在插件类中新增脚本注册函数
public function enqueue_scripts() {
    if( !is_admin() ){
        wp_enqueue_script( 
            'pp-public-jq', 
            plugin_dir_url( __FILE__ ) . 'public/assets/js/pp-public-jq.js', 
            array('jquery'), 
            '1.0', 
            true 
        );
        
        // 传递AJAX URL到前端JS
        wp_localize_script( 'pp-public-jq', 'ajax_object', array(
            'ajax_url' => admin_url( 'admin-ajax.php' )
        ) );
    }
}

// 修改构造函数，添加脚本钩子并移除多余的init调用
public function __construct() {
    if ( ! is_admin() ) {
        add_shortcode( 'pp_html_template', array( $this, 'pp_html_template' ) );
        add_action( 'wp_enqueue_scripts', array( $this, 'enqueue_scripts' ) ); // 新增这行
    }
    add_action( 'wp_ajax_pp_html_process', array( $this, 'pp_html_process' ) );
    add_action( 'wp_ajax_nopriv_pp_html_process', array( $this, 'pp_html_process' ) );
    // 移除这行：add_action( 'init', array( $this, 'pp_html_process' ) ); 它会导致处理函数在每次页面加载时都被调用
}

为什么之前返回0？ #

WordPress AJAX机制中，如果处理函数没有输出任何内容或未正确终止，就会默认返回0。我们的修改解决了这些问题：

• 用wp_send_json_success()和wp_send_json_error()输出标准JSON响应，这些函数会自动终止脚本，避免返回默认值。
• 修复了文件上传的数据传递问题，确保表单数据完整。
• 移除了不必要的判断条件，让处理函数能正确执行。

按这些步骤修改后，你的AJAX表单应该就能正常工作，控制台会收到清晰的成功/错误信息，而不是0了。

内容的提问来源于stack exchange，提问作者Marko