首页 > 解决方案 > WordPress前端媒体上传器在前面上传图像时注销

问题描述

我创建了一个前端表单,登录用户可以在其中创建帖子并上传图像。当用户登录并单击添加媒体按钮时,wordpress 媒体上传器窗口将打开。当用户从他的计算机中选择一个文件上传时,它就可以工作了。图像在 wordpress 媒体窗口中成功加载。但是一旦上传了新图像,用户就会退出。用户角色具有上传功能。这是我的表格

<form action="" method="post" enctype="multipart/form-data" name="myForm" >
<?php
update_option( 'media_selector_attachment_id', absint( $_POST['image_attachment_id'] ) );
wp_enqueue_media();
?>
<div class='image-preview-wrapper'>
        <img id='image-preview' src='<?php echo wp_get_attachment_url( get_option( 'media_selector_attachment_id' ) ); ?>' width='336'>
</div>
<br>
<input id="upload_image_button" type="button" class="button" value="Upload image" />
<input type='hidden' name='image_attachment_id' id='image_attachment_id' value='<?php echo get_option( 'media_selector_attachment_id' ); ?>'>
<input type="hidden" name="submit_image_selector" value="Save" class="button-primary">
<input type="submit" name="submitnewp" value="Save">
</form>
<?php
$my_saved_attachment_post_id = get_option( 'media_selector_attachment_id', 0 );
?>

<script type='text/javascript'>

                jQuery( document ).ready( function( $ ) {

                    // Uploading files
                    var file_frame;
                    var wp_media_post_id = wp.media.model.settings.post.id; // Store the old id
                    var set_to_post_id = <?php echo $my_saved_attachment_post_id; ?>; // Set this

                    jQuery('#upload_image_button').on('click', function( event ){

                        event.preventDefault();

                        // If the media frame already exists, reopen it.
                        if ( file_frame ) {
                            // Set the post ID to what we want
                            file_frame.uploader.uploader.param( 'post_id', set_to_post_id );
                            // Open frame
                            file_frame.open();
                            return;
                        } else {
                            // Set the wp.media post id so the uploader grabs the ID we want when initialised
                            wp.media.model.settings.post.id = set_to_post_id;
                        }

                        // Create the media frame.
                        file_frame = wp.media.frames.file_frame = wp.media({
                            title: 'Sélectionnez une image',
                            button: {
                                text: 'Utiliser cette image',
                            },
                            library: {
                                type: 'image',
                            },
                            allowLocalEdits: false,
                            displaySettings: false,
                            displayUserSettings: false,
                            multiple: false // Set to true to allow multiple files to be selected
                        });

                        // When an image is selected, run a callback.
                        file_frame.on( 'select', function() {
                            // We set multiple to false so only get one image from the uploader
                            attachment = file_frame.state().get('selection').first().toJSON();

                            // Do something with attachment.id and/or attachment.url here
                            $( '#image-preview' ).attr( 'src', attachment.url ).css( 'width', '200' );
                            $( '#image_attachment_id' ).val( attachment.id );

                            // Restore the main post ID
                            wp.media.model.settings.post.id = wp_media_post_id;
                        });

                            // Finally, open the modal
                            file_frame.open();
                    });

                    // Restore the main ID when the add media button is pressed
                    jQuery( 'a.add_media' ).on( 'click', function() {
                        wp.media.model.settings.post.id = wp_media_post_id;
                    });
                });

            </script>
<form action="" method="post" enctype="multipart/form-data" name="myForm">
<?php
                update_option( 'media_selector_attachment_id', absint( $_POST['image_attachment_id'] ) );
                wp_enqueue_media();
            ?>
<div class='image-preview-wrapper'>
                    <img id="image-preview" src="<?php echo wp_get_attachment_url( get_option( 'media_selector_attachment_id' ) ); ?>" width="100">
            </div>
<br>
            <input id="upload_image_button" type="button" class="button" value="Upload image">
            <input type="hidden" name="image_attachment_id" id="image_attachment_id" value="<?php echo get_option( 'media_selector_attachment_id' ); ?>">
            <input type="hidden" name="submit_image_selector" value="Save" class="button-primary">
<input type="submit" name="submitnewp" value="Save">
</form>
<?php
        $my_saved_attachment_post_id = get_option( 'media_selector_attachment_id', 0 );
        ?>

每次用户上传新图片时,如何解决注销问题?

标签: wordpress

解决方案


推荐阅读