如果你在网站的上传文件夹中使用一个自定义目录来存储图片的话效果会更好。创建这个目录，然后使用chmod 775
将表单放入页面模板中，添加一个类为“upload-response”的空div，在容器div结束之前插入一个脚本标记，该标记将admin-ajax.php路径回显到一个js变量：

<script>
    var ajaxurl = '<?php echo admin_url( 'admin-ajax.php' ); ?>';
</script>

我使用jQuery来处理其余部分（upload.js文件的内容）：

(function ($) {
$('body').on('click', '.upload-form .btn-upload', function(e){
    e.preventDefault();

    var imagedata = canvas.toDataURL('image/png');

    var fd = new FormData();
    //var files_data = imagedata;
    fd.append('image', imagedata);

    // our AJAX identifier
    fd.append('action', 'my_upload_files');  

    // Remove this code if you do not want to associate your uploads to the current page.
    //fd.append('post_id', <?php echo $post->ID; ?>); 

    $.ajax({
        type: 'POST',
        url: ajaxurl,
        data: fd,
        contentType: false,
        processData: false,
        success: function(response){
            $('.upload-response').html(response); // Append Server Response
        }
    });
});
})(jQuery);

在插件文件中，添加：

add_action('wp_enqueue_scripts','ajax_upload_script');
function ajax_upload_script() {
    wp_enqueue_script('ajax-upload', plugins_url( '/js/upload.js' ), array('jquery'), '', true);
}

add_action('wp_ajax_my_upload_files', 'my_upload_files');
add_action('wp_ajax_nopriv_my_upload_files', 'my_upload_files'); // Allow front-end submission 

function my_upload_files(){
//file handling here
}

或者，如果您不想制作插件，请将操作添加到子主题functions.php中，并将plugins_url( '/js/upload.js' )更改为get_stylesheet_directory_uri().'/js/upload.js'

一种方法是使用PHP Code for posts这样的插件。这比将PHP硬编码到模板或WP页面要好。优点是你可以很容易地更新和更改代码，当需要更新WP时，你不需要重新应用你的硬编码PHP。

如果你想在wordpress中实现 AJAX ，那么你需要使用wp_ajax hook. https://codex.wordpress.org/Plugin_API/Action_Reference/wp_ajax_(action)在function.php中添加以下代码（主题文件夹）
javascript在function.php上添加wp_footer钩子

jQuery.post(
    ajaxurl, 
    {
        'action': 'add_foobar',
        'data':   'foobarid'
    }, 
    function(response){
        alert('The server responded: ' + response);
    }
);

在wp_ AJAX 钩子下面添加function.php

add_action( 'wp_ajax_add_foobar', 'prefix_ajax_add_foobar' );

function prefix_ajax_add_foobar() {
    // Handle request then generate response using WP_Ajax_Response

    // Don't forget to stop execution afterward.
    wp_die();
}

这些代码将不会更新，当你更新WordPress的。但如果可能的话，比添加这些代码在function.php上的子主题，所以在情况下，如果你想更新主题比不更新这些代码。