Обработка загрузки файлов переднего плана с учетом безопасности и простоты использования
Я собираюсь адаптировать существующий плагин, подобный форуму, который не имеет возможности прикреплять носители.
Плагин работает как пользовательский тип записи, поэтому он будет таким же "простым", как прикрепление изображения к сообщению.
Меня беспокоит только прикрепление изображений, а не какой-либо тип файла, но плагин использует wp_editor
, и поэтому решение должно каким-то образом интегрироваться с этим. Я не слишком беспокоюсь о создании кнопки TinyMCE, если решение возможность вставки миниатюры изображения в текстовую область TinyMCE.
Пожалуйста, обратите внимание, что я имею в виду интерфейс моего веб-сайта, а не административную область.
В абсолютно идеальной ситуации я бы хотел, чтобы произошел такой сценарий:
- Пользователь нажимает "Задать вопрос"
- Пользователь вводит свои данные по почте
- Пользователь нажимает кнопку в интерфейсе TinyMCE, которая, подобно StackExchange, просит пользователя загрузить файл.
- Затем система вставляет миниатюру правильного размера в текстовую область TinyMCE, уменьшив файл до этого размера миниатюры
- Щелчок по этому изображению должен обеспечивать ту же функциональность, что и вложение изображения в сообщении
- Затем пользователь может нажать еще раз, чтобы вставить новое изображение
- Пользователь также может удалить изображение из текстовой области TinyMCE по мере необходимости
Тем не менее, я рад, что кнопка TinyMCE является периферийной - если поле "загрузка файла" значительно проще, это хорошо.
Я наткнулся на эту ссылку , но я всегда с опаской отношусь к чтению статей WordPress на t'interwebs, так как я никогда не был слишком уверен в том, насколько они безопасны, и я не являюсь экспертом по безопасности php при любом напряжении воображения.
Заранее благодарю,
2 answers
Я думаю, что самый простой способ, поскольку вы уже используете функцию wp_editor
, - это просто включить кнопки мультимедиа в экземпляр WP_Editor - таким образом, у вас будут собственные функции, включая кнопку "Вставить в сообщение", встроенную бесплатно.
То, как вы это делаете, очевидно, зависит от плагина, с которым вы пытаетесь работать. Тем не менее, это должно помочь вам начать. Включите подобный код в шаблон страницы для отображения редактора, и вы получите редактор на своей странице. Включение этого в форму и обработка результатов - еще один шаг, не описанный здесь.
// 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 ) );
Определение идентификатора записи, вероятно, является критической частью, и то, как вы это сделаете, будет зависеть от логики вашей функциональности. Я бы предложил:
- Создание автоматического черновика при первом посещении этой страницы и сохранение идентификатора записи, возвращенного в глобальной переменной $post_id.
- Затем сохранение созданной записи с тем же идентификатором при отправке формы.
Возможно, это не ваше идеальное решение, но попробовать стоит. Получил его, погуглив, но, к сожалению, я забыл URL-адрес. Прилагаемая часть аналогична той, что указана в статье @goldenapples.
Вот основная функция.
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;
}
Функция 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
}
Разметка
<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>
Надеюсь, это поможет