Custom Widget Image Upload

I used the code of the Team Member Widget of the Zerif Lite wp-template on my template. It also includes the option to put an image to the widget. It’s working with code in the functions.php and a javascript. In the back-end you click a button “Upload Image” and you get to the media overview window. On my local host this is working fine. I see all my uploaded images. But when I putted it on my webserver this is not working anymore. The uploaded images do not show up. It seams like it’s not finding the url’s. I just wonder why it’s working locally but not online? Here’s the php code in the functions.php:

<?php

add_action('admin_enqueue_scripts', 'zerif_team_widget_scripts');

function zerif_team_widget_scripts() {    

    wp_enqueue_media();

    wp_enqueue_script('zerif_team_widget_script', get_template_directory_uri() . '/js/widget-team.js', false, '1.0', true);

}

class zerif_team_widget extends WP_Widget{  

    public function __construct() {
        parent::__construct(
            'zerif_team-widget',
            __( 'Team Mitglieder Widget', 'zerif-lite' )
        );
    }

    function widget($args, $instance) {

        extract($args);

        echo $before_widget;

        ?>

        <div class="col-lg-4 col-sm-4 team-box">

            <div class="team-member">

                <div class="member-details">

                    <?php if( !empty($instance['name']) ): ?>

                        <h3 class="dark-text red-border-bottom"><?php echo apply_filters('widget_title', $instance['name']); ?></h3>

                    <?php endif; ?> 

                    <?php if( !empty($instance['position']) ): ?>

                        <div class="position"><?php echo htmlspecialchars_decode(apply_filters('widget_title', $instance['position'])); ?></div>

                    <?php endif; ?>

                </div>

                <?php if( !empty($instance['image_uri']) ): ?>

                    <figure class="profile-pic">

                        <img class="img-circle" src="<?php echo esc_url($instance['image_uri']); ?>" alt="<?php _e( 'Uploaded image', 'zerif-lite' ); ?>" />

                    </figure>

                <?php endif; ?>

                <?php if( !empty($instance['nickname']) ): ?>

                    <div class="details"><strong>Alle nennen mich: </strong><?php echo htmlspecialchars_decode(apply_filters('widget_title', $instance['nickname'])); ?></div>

                <?php endif; ?>

                <?php if( !empty($instance['description']) ): ?>
                <div class="details">

                    <?php echo htmlspecialchars_decode(apply_filters('widget_title', $instance['description'])); ?>

                </div>
                <?php endif; ?>

            </div>

        </div>

        <?php

        echo $after_widget;

    }

    function update($new_instance, $old_instance) {

        $instance = $old_instance;

        $instance['name'] = strip_tags($new_instance['name']);
        $instance['position'] = stripslashes(wp_filter_post_kses($new_instance['position']));
        $instance['nickname'] = stripslashes(wp_filter_post_kses($new_instance['nickname']));
        $instance['description'] = stripslashes(wp_filter_post_kses($new_instance['description']));
        $instance['image_uri'] = strip_tags($new_instance['image_uri']);

        return $instance;

    }

    function form($instance) {

        ?>

        <p>
            <label for="<?php echo $this->get_field_id('name'); ?>"><?php _e('Name', 'zerif-lite'); ?></label><br/>
            <input type="text" name="<?php echo $this->get_field_name('name'); ?>" id="<?php echo $this->get_field_id('name'); ?>" value="<?php if( !empty($instance['name']) ): echo $instance['name']; endif; ?>" class="widefat"/>
        </p>
        <p>
            <label for="<?php echo $this->get_field_id('position'); ?>"><?php _e('Position', 'zerif-lite'); ?></label><br/>
            <textarea class="widefat" rows="8" cols="20" name="<?php echo $this->get_field_name('position'); ?>" id="<?php echo $this->get_field_id('position'); ?>"><?php if( !empty($instance['position']) ): echo htmlspecialchars_decode($instance['position']); endif; ?></textarea>
        </p>
        <p>
            <label for="<?php echo $this->get_field_id('nickname'); ?>"><?php _e('Spitzname', 'zerif-lite'); ?></label><br/>
            <textarea class="widefat" rows="8" cols="20" name="<?php echo $this->get_field_name('nickname'); ?>" id="<?php echo $this->get_field_id('nickname'); ?>"><?php if( !empty($instance['nickname']) ): echo htmlspecialchars_decode($instance['nickname']); endif; ?></textarea>
        </p>
        <p>
            <label for="<?php echo $this->get_field_id('description'); ?>"><?php _e('Description', 'zerif-lite'); ?></label><br/>
            <textarea class="widefat" rows="8" cols="20" name="<?php echo $this->get_field_name('description'); ?>"
                  id="<?php echo $this->get_field_id('description'); ?>"><?php
            if( !empty($instance['description']) ): echo htmlspecialchars_decode($instance['description']); endif;
        ?></textarea>
        </p>
        <p>
            <label for="<?php echo $this->get_field_id('image_uri'); ?>"><?php _e('Image', 'zerif-lite'); ?></label><br/>

            <?php

            if ( !empty($instance['image_uri']) ) :

                echo '<img class="custom_media_image_team" src="' . $instance['image_uri'] . '" style="margin:0;padding:0;max-width:100px;float:left;display:inline-block" alt="'.__( 'Uploaded image', 'zerif-lite' ).'" /><br />';

            endif;

            ?>

            <input type="text" class="widefat custom_media_url_team" name="<?php echo $this->get_field_name('image_uri'); ?>" id="<?php echo $this->get_field_id('image_uri'); ?>" value="<?php if( !empty($instance['image_uri']) ): echo $instance['image_uri']; endif; ?>" style="margin-top:5px;">
            <input type="button" class="button button-primary custom_media_button_team" id="custom_media_button_clients" name="<?php echo $this->get_field_name('image_uri'); ?>" value="<?php _e('Upload Image','zerif-lite'); ?>" style="margin-top:5px;">
        </p>

        <?php

        }

    }

add_action('widgets_init', 'zerif_register_widgets');

function zerif_register_widgets() {    

    register_widget('zerif_team_widget');

}

?>

and here’s the js:

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

    function media_upload(button_class) {

        var _custom_media = true,

        _orig_send_attachment = wp.media.editor.send.attachment;

        $('body').on('click', button_class, function(e) {

            var button_id ='#'+$(this).attr('id');

            var self = $(button_id);

            var send_attachment_bkp = wp.media.editor.send.attachment;

            var button = $(button_id);

            var id = button.attr('id').replace('_button', '');

            _custom_media = true;

            wp.media.editor.send.attachment = function(props, attachment){

                if ( _custom_media  ) {

                    $('.custom_media_id').val(attachment.id);

                    $('.custom_media_url_team').val(attachment.url);

                    $('.custom_media_image_team').attr('src',attachment.url).css('display','block');

                } else {

                    return _orig_send_attachment.apply( button_id, [props, attachment] );

                }

            }

            wp.media.editor.open(button);

                return false;

        });

    }

    media_upload('.custom_media_button_team.button');

});