Manipulação de uploads de arquivos front-end, considerando a segurança e a facilidade de uso

Estou procurando adaptar um plugin semelhante a um fórum existente, que não tem facilidade para anexar mídia.

O plug-in funciona como um Tipo de postagem personalizado, portanto, seria "simples" como anexar uma imagem a uma postagem.

Estou preocupado apenas em anexar imagens em vez de qualquer tipo de arquivo, mas o plugin usa wp_editore, como tal, a solução deve, de alguma forma, integrar-se a isso. Não estou muito preocupado em criar um botão tinyMCE, desde que a solução seja capaz de inserir uma miniatura da imagem na área de texto tinyMCE.

Observe que estou me referindo ao front-end do meu site, e não à área de administração.

Em uma situação absolutamente ideal, eu gostaria que esse cenário ocorresse:

• O usuário clica em "Fazer uma pergunta"
• Use insere os detalhes da postagem
• O usuário clica em um botão na interface tinyMCE que, semelhante ao StackExchange, solicita que o usuário envie um arquivo.
• O sistema insere a miniatura de tamanho correto na área de texto tinyMCE, processando o arquivo nesse tamanho de miniatura
• Clicar nesta imagem deve oferecer a mesma funcionalidade que um anexo de imagem em uma Postagem
• O usuário pode clicar novamente para inserir uma nova imagem
• O usuário também pode excluir a imagem da área de texto tinyMCE conforme necessário

No entanto, estou feliz que o botão tinyMCE seja periférico - se uma caixa de "upload de arquivo" for significativamente mais fácil, tudo bem.

Encontrei este link, mas estou sempre apreensivo sobre a leitura de artigos do WordPress nas redes, pois nunca tenho muita certeza de como eles são seguros, nem sou especialista em segurança php por qualquer extensão da imaginação.

Desde já, obrigado,

Eu acho que a maneira mais fácil, já que você já está usando a wp_editorfunção, basta incluir os botões de mídia na instância WP_Editor - dessa forma, você terá as funções nativas, incluindo o botão "Inserir na postagem", incorporado de graça.

Como você faz isso obviamente depende do plugin com o qual você está tentando trabalhar. No entanto, isso deve ajudá-lo a começar. Inclua um código como este em um modelo de página para exibir o editor, e você receberá um editor em sua página. Incluir isso em um formulário e processar os resultados é outra etapa não detalhada aqui.

// Define the global variable $post_id - this is used by the media uploader
// to attach uploads to a specific post (so that the uploader can see uploads
// attached to this post and not others)
global $post_id;
$post_id = $post->ID; // should be the ID of the new post created

// Now filter the list of tabs available in the media editor.
// Remove everything but the "From Computer" option.

add_filter( 'media_upload_tabs', 'wpse42068_remove_additional_tabs' );

function wpse42068_remove_additional_tabs( $_default_tabs ) {
    return array( 'type' => __('From Computer') );
}

// Now just include the WP_Editor. See
// http://codex.wordpress.org/Function_Reference/wp_editor
// for settings available
wp_editor( '', 'posteditor', array( 'media_buttons' => true ) );

Definir o ID da postagem é provavelmente a parte crítica, e como você faz isso dependerá da lógica de sua funcionalidade. Eu sugeriria:

• Criar um rascunho automático ao visitar esta página pela primeira vez e salvar o ID da postagem retornado na variável global $ post_id.
• Em seguida, salve a postagem criada com o mesmo ID quando o formulário for enviado.

Talvez essa não seja a sua solução ideal, mas vale a pena tentar. Entendi, pesquisando no Google, mas infelizmente eu esqueci o URL. A peça anexada é semelhante à do artigo @goldenapples.

Aqui está a função básica.

function attach_uploads($uploads,$post_id = 0){
    $files = rearrange($uploads);
    if($files[0]['name']==''){
        return false;   
    }
    foreach($files as $file){
        $upload_file = wp_handle_upload( $file, array('test_form' => false) );
        $attachment = array(
        'post_mime_type' => $upload_file['type'],
        'post_title' => preg_replace('/\.[^.]+$/', '', basename($upload_file['file'])),
        'post_content' => '',
        'post_status' => 'inherit'
    );
        $attach_id = wp_insert_attachment( $attachment, $upload_file['file'], $post_id );
        $attach_array[] = $attach_id;
        require_once(ABSPATH . 'wp-admin/includes/image.php');
        $attach_data = wp_generate_attachment_metadata( $attach_id, $upload_file['file'] );
        wp_update_attachment_metadata( $attach_id, $attach_data );
    }
    return $attach_array;
}

A função ajax

add_action('wp_ajax_attach_file', 'process_attach_file');
function process_attach_file() {

    // add some filter and validation on the id and the files here
    $post_id = $_POST['post_id'];
    $files = $_FILES['profile-picture'];

    // insert attachment
    $attached_files = attach_uploads($files,$post_id);

    // set the first file as post thumbnail
    if($attached_files){
        set_post_thumbnail( $post_id, $attached_files[0] ); 
    }

    // now all you have to do is set the response data

}

A marcação

<form id="upload-form" action="<?php echo admin_url('admin-ajax.php'); ?>" method="post" class="form" enctype="multipart/form-data" >
    <label for="profile-picture">Foto Profil</label>
    <input type="file" id="profile-picture" name="profile-picture[]" size="40" multiple />
    <?php wp_nonce_field( // intention nonce); ?>
    <input name="action" value="attach_file" type="hidden">
    <input name="post_id" value="12" type="hidden">
</form>

Espero que esta ajuda