如何将截图Blob数据插入WordPress数据库？

嘿，我看了你的代码，问题出在直接用POST传Blob数据的方式不对——jQuery默认会把Blob转成字符串"[object Blob]"，后端根本拿不到真实的二进制内容，自然插不进数据库。咱们一步步改：

第一步：修正前端JavaScript代码 #

你需要用FormData来包装Blob，同时告诉jQuery不要自动处理数据，让浏览器按文件上传的格式发送：

html2canvas(document.getElementById('image-container')).then(function (canvas) {
    canvas.toBlob(function (blob) {
        // 创建FormData对象，用来包装要发送的数据
        const formData = new FormData();
        formData.append('action', 'addblobtodb'); // WP AJAX的action参数
        formData.append('image', blob, 'screenshot.png'); // 把Blob加入FormData，第三个参数是文件名（可选但推荐）

        jQuery.ajax({
            url: '/wp-admin/admin-ajax.php',
            type: 'POST',
            data: formData,
            processData: false, // 禁止jQuery把FormData转成urlencoded格式
            contentType: false, // 让浏览器自动设置正确的Content-Type（multipart/form-data）
            success: function(id) {
                console.log("Succesfully inserted into DB: " + id);
            },
            error: function(xhr, status, error) {
                console.error("插入数据库出错啦：", error);
            }
        });
    });
});

第二步：修正后端PHP代码 #

现在数据是按文件上传的格式发过来的，你得从$_FILES里获取临时文件，读取内容后再插入数据库，还要加上WP AJAX的钩子（你可能漏了这个！）：

function add_poster_to_db() {
    global $wpdb;

    // 先检查有没有合法的文件上传
    if (!isset($_FILES['image']) || $_FILES['image']['error'] !== UPLOAD_ERR_OK) {
        wp_send_json_error('没有上传有效的图片');
        die();
    }

    // 读取临时文件里的二进制内容
    $image_data = file_get_contents($_FILES['image']['tmp_name']);

    // 插入数据库，注意指定字段类型为二进制（%b）
    $insert_success = $wpdb->insert('test_images', 
        array('image_data' => $image_data),
        array('%b') // %b表示二进制数据，确保正确存储
    );

    if ($insert_success) {
        $db_id = $wpdb->insert_id;
        wp_send_json($db_id);
    } else {
        wp_send_json_error('插入数据库失败');
    }

    die();
}
// 注册WP AJAX钩子，登录用户可用
add_action('wp_ajax_addblobtodb', 'add_poster_to_db');
// 如果需要让未登录用户也能使用，加上下面这行
// add_action('wp_ajax_nopriv_addblobtodb', 'add_poster_to_db');

额外注意事项 #

• 确保你的test_images表的image_data字段类型是LONGBLOB，普通BLOB容量太小，存不下截图；
• 测试的时候打开浏览器控制台，看AJAX的请求和响应，方便排查问题；
• 记得给你的AJAX函数加权限验证（比如检查用户是否登录、是否有操作权限），避免安全风险。

备注：内容来源于stack exchange，提问作者Jan D.M.