1

para ocultar el acceso directo al url de un archivob mp3 encripte su nombre en la subida y lo almacene en la bd con laravel, pero ahora me encuentro con el problema que no se como desencriptarlo en mi reproductor.js para que obter la cadena original donde esta la url hacia el archivo

mi reproductor js toma el url desde una vista en la etiqueta html data-src="path-a-mi-archivo" que esta encriptada a continuacion el codigo js:

(function ($) {
  "use strict";

  if($('.playlist').length == 0) return;

  var playlist = $( '.playlist' ).mepPlaylist({
    audioHeight: '40',
    audioWidth: '100%',
    videoHeight: '40',
    videoWidth: '100%',
    audioVolume: 'vertical',
    mepPlaylistLoop: true,
    alwaysShowControls: true,
    mepSkin: 'mejs-audio',
    mepResponsiveProgress: true,
    mepSelectors: {
      playlist: '.playlist',
      track: '.track',
      tracklist: '.tracks'
    },
    features: [
      'meplike',
      'mepartwork',
      'mepcurrentdetails',
      'mepplaylist',
      'mephistory',
      'mepprevioustrack',
      'playpause',
      'mepnexttrack',
      'progress',
      'current',
      'duration',
      'volume',
      'mepicons',
      'meprepeat',
      'mepshuffle',
      'mepsource',
      'mepbuffering',
      'meptracklist',
      'mepplaylisttoggle',
      'youtube'
    ],

  // get player, then you can use the player.mepAdd(), player.mepRemove(), player.mepSelect()
  var player = playlist.find('audio, video')[0].player;

  // event on like btn
  player.$node.on('like.mep', function(e, trackid){
    $('[track-id='+trackid+']').toggleClass('is-like');
  });

  // event on play
  player.$node.on('play', function(e){
    updateDisplay();
  });

  // event on pause
  player.$node.on('pause', function(e){
    updateDisplay();
  });

  // update when pjax end
  $(document).on('pjaxEnd', function() {
    updateDisplay();
  });

  // simulate the play btn
  $(document).on('click.btn', '.btn-playpause', function(e){
      e.stopPropagation();
      var self = $(this);
      if( self.hasClass('is-playing') ){
        self.removeClass('is-playing');
        player.pause();
      }else{
        var item = getItem(self);
        item && player.mepAdd(item, true);
      }
  });

  function updateDisplay(){
    $('[data-id]').removeClass('active').find('.btn-playpause').removeClass('is-playing').parent().removeClass('active');
    var track = player.mepGetCurrentTrack();
    if(!track || !track.id) return;
    var item = $('[data-id="'+track.id+'"]');
    if( player.media.paused ){
      item.removeClass('active').find('.btn-playpause').removeClass('is-playing').parent().removeClass('active');
    }else{
      item.addClass('active').find('.btn-playpause').addClass('is-playing').parent().addClass('active');
    }
  }

  // get item data, you can use ajax to get data from server
  function getItem(self){
    var item = self.closest('.item');
    // track detail
    if(!item.attr('data-src')){
      self.toggleClass('is-playing');
      $('#tracks').find('.btn-playpause').first().trigger('click');
      return false;
    }

    var obj = {
        meta: {
           author: item.find('.item-author').find('a').text()
          ,authorlink : item.find('.item-author').find('a').attr('href')
        }
        ,src: self.closest('[data-src]').attr("data-src")
        ,thumb: {
          src: item.find('.item-media-content').css("background-image").replace(/^url\(["']?/, '').replace(/["']?\)$/, '')
        }
        ,title: item.find('.item-title').find('a').text()
        ,link: item.find('.item-title').find('a').attr('href')
        ,id: self.attr("data-id") ? self.attr("data-id") : self.closest('[data-id]').attr("data-id")
    };
    return obj;
  }

})(jQuery);

y el codigo de mi vista:

<div class="row item-grid " >
                            @isset($datos)
                                @foreach($datos as $dato)
                                <div class="col-xs-6 col-sm-3 col-md-3">
                                <div class="item r item-track" data-dir="storage/songs" id="song" data-src="storage/songs/{{$dato->name_song}}">
                                    <div id="info"></div>
                                    <div class="item-media ">
                                        <a href="http://flatfull.com/wp/pulse/track/pink-floyd-another-brick-in-the-wall-will-barber-the-voice-2017-blind-audition/" class="item-media-content" style="background-image: url(http://flatfull.com/wp/pulse/wp-content/uploads/2019/04/Wizkid-Fever-mp3-image-300x300.jpg);"></a>
                                        <div class="item-overlay center">
                                            <button  class="btn-playpause">Play</button>
                                        </div>
                                    </div>
                                    <div class="item-info">
                                        <div class="item-overlay bottom text-right">
                                            <a class="btn-like " data-site-id="1" data-post-id="1120" data-count="0">
                                                <span class="">
                                                    <i class="fa fa-heart-o"></i>
                                                    <i class="active fa fa-heart text-primary"></i>
                                                </span>
                                            </a>
                                            <a href="#" class="btn-more" data-toggle="dropdown"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="dropdown-menu pull-right l-h grey lt"></div>
                                        </div>
                                        <div class="item-title text-ellipsis">
                                            <a href="http://flatfull.com/wp/pulse/track/pink-floyd-another-brick-in-the-wall-will-barber-the-voice-2017-blind-audition/">Pink Floyd – {{$dato->nombre_song}} | Will Barber| The Voice 2017| Blind Audition</a>
                                        </div>
                                        <div class="item-author text-sm text-ellipsis text-muted">
                                            <a href="http://flatfull.com/wp/pulse/user/admin/" title="Posts by Pablo Nouvelle" rel="author">Pablo Nouvelle</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                                @endforeach
                                @else
                                        <li>Aun no hay musica en la biblioteca :c</li>
                            @endisset
                        </div>

realmente no se como funciona javascript, nunca lo he usado y estoy muy confundido sobre como podria desifrar la direccion de mi archivo mp3, espero puedan ayudarme a corregirlo

2
  • No acabo de entender lo que quieres hacer: ¿eres consciente de que cualquier usuario podrá ver la URL si quiere? Commented el 12 jun. 2019 a las 8:02
  • Es justo lo que quiero evitar que tengan acceso directo a la url y por ello puedan descargar el archivo, pero no se me ocurre otra forma Commented el 12 jun. 2019 a las 12:23

0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

Examina otras preguntas con la etiqueta o formula tu propia pregunta.