Menangani unggahan file front-end, dengan mempertimbangkan keamanan dan kemudahan penggunaan

Saya ingin mengadaptasi plugin mirip forum yang sudah ada yang tidak memiliki fasilitas untuk melampirkan media.

Plugin ini berfungsi sebagai Jenis Posting Kustom, jadi itu akan "sesederhana" seperti melampirkan gambar ke posting.

Saya hanya peduli tentang melampirkan gambar daripada jenis file apa pun, tetapi plugin tidak menggunakan wp_editordan dengan demikian solusinya harus dalam beberapa cara mengintegrasikan dengan itu. Saya tidak terlalu sibuk membuat tombol tinyMCE, asalkan solusinya mampu memasukkan thumbnail gambar ke dalam textarea tinyMCE.

Harap dicatat, saya merujuk ke front-end situs web saya daripada area admin.

Dalam situasi yang sangat ideal, saya ingin skenario ini terjadi:

• Pengguna mengklik "Ajukan pertanyaan"
• Gunakan memasuki detail posting mereka
• Pengguna mengklik tombol pada antarmuka tinyMCE yang, mirip dengan StackExchange, meminta pengguna untuk mengunggah file.
• Sistem kemudian memasukkan thumbnail berukuran benar ke dalam textarea tinyMCE, setelah menggeretakkan file ke dalam ukuran thumbnail ini
• Mengklik gambar ini harus menawarkan fungsionalitas yang sama dengan lampiran gambar dalam Postingan
• Pengguna kemudian dapat mengklik lagi untuk memasukkan gambar baru
• Pengguna juga dapat menghapus gambar dari textarea tinyMCE sesuai kebutuhan

Namun, saya senang tombol tinyMCE menjadi periferal - jika kotak "unggah file" jauh lebih mudah, itu tidak masalah.

Saya menemukan tautan ini, tetapi saya selalu khawatir tentang membaca artikel WordPress di internet karena saya tidak pernah terlalu yakin seberapa amannya mereka, saya juga bukan pakar keamanan php oleh imajinasi apa pun.

Terima kasih sebelumnya,

Saya pikir cara termudah, karena Anda sudah menggunakan wp_editorfungsi akan hanya memasukkan tombol media dalam contoh WP_Editor - cara ini Anda akan memiliki fungsi asli, termasuk tombol "Masukkan ke dalam pos", dibangun di gratis.

Cara Anda melakukannya jelas tergantung pada plugin yang Anda coba gunakan. Namun, ini harus Anda mulai. Sertakan kode seperti ini di templat halaman untuk menampilkan editor, dan Anda akan mendapatkan editor di halaman Anda. Memasukkan ini dalam bentuk dan memproses hasilnya adalah langkah lain yang tidak dirinci di sini.

// 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 ) );

Menentukan ID kiriman mungkin merupakan bagian penting, dan cara Anda melakukannya tergantung pada logika fungsi Anda. Saya akan menyarankan:

• Membuat konsep otomatis pada kunjungan pertama halaman ini, dan menyimpan ID posting yang dikembalikan dalam variabel $ post_id global.
• Kemudian simpan pos yang dibuat dengan ID yang sama saat formulir dikirimkan.

Mungkin ini bukan solusi ideal Anda, tetapi patut dicoba. Dapat dengan googling tapi sayangnya saya lupa urlnya. Bagian yang dilampirkan mirip dengan yang ada di artikel @goldenapples.

Inilah fungsi dasarnya.

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;
}

Fungsi 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

}

Markup

<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>

Semoga bantuan ini