2015-08-15 12 views
7

का उपयोग कर लोड नहीं अगर मैं निम्नलिखित कोड में mp3: "/Music/StreamUploadedSongs/1" का उपयोग करें:jPlayer गीत सही ढंग से MVC विधि

var player = new $("#jquery_jplayer_1").jPlayer({ 
     ready: function() { 
      $(this).jPlayer("setMedia", { 
       mp3: "/Music/StreamUploadedSongs/1", 
      }); 
     }, 
     cssSelectorAncestor: "#jp_container_1", 
     swfPath: "~Scripts/Jplayer/jquery.jplayer.swf", 
     useStateClassSkin: true, 
     autoBlur: false, 
     keyEnabled: true   
     } 
}); 

यहाँ कि यह दिखता है, आप देख सकते jplayer सही ढंग से बार चलती नहीं है (वे अतिव्यापी हैं) और यह भी तलाश/चलाएं बार काम नहीं करता है, हालांकि गीत अभी भी खेला जा सकता है: enter image description here

HTML मार्कअप: <audio id="jp_audio_0" preload="metadata" src="http://localhost:6060/Music/StreamUploadedSongs/1"></audio>

संगीत नियंत्रक:

012,351,
public ActionResult StreamUploadedSongs(int id) 
{ 
     byte[] song = db.UploadedSongs.Where(x => x.Id == id).FirstOrDefault().SongBytes; 
     return File(song, "audio/*"); 
} 

यदि मैं एमपी 3 संपत्ति को इसके बजाय बदलता हूं: mp3: "http://www.jplayer.org/audio/mp3/TSP-01-Cro_magnon_man.mp3" तो यह पूरी तरह से काम करता है।

var player = new $("#jquery_jplayer_1").jPlayer({ 
    ready: function() { 
     $(this).jPlayer("setMedia", { 
      mp3: "http://www.jplayer.org/audio/mp3/TSP-01-Cro_magnon_man.mp3", 
     }); 
    }, 
    cssSelectorAncestor: "#jp_container_1", 
    swfPath: "~Scripts/Jplayer/jquery.jplayer.swf", 
    useStateClassSkin: true, 
    autoBlur: false, 
    keyEnabled: true   
    } 

}); enter image description here

HTML मार्कअप:

यहाँ, ठीक से काम, की तलाश/चलाएं बार काम करता है और jplayer सही पदों के लिए समय ले जाया गया है क्या यह लग रहा है है <audio id="jp_audio_0" preload="metadata" src="http://www.jplayer.org/audio/mp3/TSP-01-Cro_magnon_man.mp3"></audio>

मैं दूसरे पर अन्य jPlayers है पेज और यह भी उनके साथ सटीक है।

संपादित: बस यह करने की कोशिश की:

public string StreamUploadedSongs(int id) 
    { 
     string filePath = Server.MapPath(Url.Content("~/Content/TSP-01-Cro_magnon_man.mp3")); 

     return filePath; 
    } 

मुझे लगता है कि निर्देशिका में एमपी 3 फ़ाइल डाल, लेकिन यह सब पर अब नहीं चलता है। यदि मैं इसे url http://localhost:6060/Music/StreamUploadedSongs/1034" में पेस्ट करता हूं तो यह गीत चलाने के बजाए I: \ Users \ UserName \ Desktop \ MusicSite \ MusicSite \ MusicSite \ Content \ TSP-01-Cro_magnon_man.mp3 देता है।

+0

मुझे लगता है कि यह सर्वर में संग्रहीत फ़ाइल के ** पथ ** की अपेक्षा करता है और यह आपके नियंत्रक से लगता है कि आप 'फ़ाइल' लौट रहे हैं। –

+0

आपको फ़ाइल पथ युक्त सरल स्ट्रिंग को वापस करने की आवश्यकता है, न कि ऑडियो फ़ाइल। क्या यह कंसोल पर कोई त्रुटि दिखा रहा है? – Akshay

+0

@ अक्षय कंसोल में कोई त्रुटि नहीं। यह मैं कैसे करूंगा? – sitBy

उत्तर

0

जैसा कि आपके पास डेटाबेस में आपके गाने हैं, मैंने माना है कि आप एक फ़ाइल बनाना और वापस करना चाहते हैं।

यदि ऐसा नहीं है तो मुझे बताएं और मैं इसके बजाय फ़ाइल पथ विधि जोड़ सकता हूं।

देखें

<script type="text/javascript" src="https://code.jquery.com/jquery-1.9.1.min.js"></script> 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jplayer/2.9.2/jplayer/jquery.jplayer.min.js"></script> 
<script type="text/javascript"> 

    $(function() { 

     var player = new $("#jquery_jplayer_1").jPlayer({ 
      ready: function() { 
       $(this).jPlayer("setMedia", { 
        mp3: "/Music/StreamUploadedSongs/1", 
       }); 
      }, 
      cssSelectorAncestor: "#jp_container_1", 
      swfPath: "~Scripts/Jplayer/jquery.jplayer.swf", 
      useStateClassSkin: true, 
      autoBlur: false, 
      keyEnabled: true 
      //} deleted this extra bracket 
     }); 

    }); 

</script> 

<div id="jquery_jplayer_1"></div> 
<div id="jp_container_1"> 
    <a href="#" class="jp-play">Play</a> 
    <a href="#" class="jp-pause">Pause</a> 
</div> 

आप कोई दस्तावेज़ तैयार लिपटे और एक अतिरिक्त ब्रैकेट नष्ट कर दिया:

मैं थोड़ा अपने ग्राहक कोड अनुकूल करने के लिए किया था।

नियंत्रक

public ActionResult StreamUploadedSongs(int id) 
{ 
    //byte[] song = db.UploadedSongs.Where(x => x.Id == id).FirstOrDefault().SongBytes; 
    var song = System.IO.File.ReadAllBytes(@"C:\Foo.mp3"); 
    return File(song, "audio/mp3"); 
} 

मैं MIME प्रकार निर्दिष्ट करने के लिए किया था, अगर मैं "audio/*" जहां उसे छोड़ा ब्राउज़र बस बल्कि यह खेल रहे हैं की तुलना में फ़ाइल डाउनलोड की।

आप सीधे नियंत्रक कार्रवाई पर नेविगेट करके स्वयं का परीक्षण कर सकते हैं, निर्दिष्ट एक माइम प्रकार के साथ यह फ़ाइल डाउनलोड करने के बजाय डिफ़ॉल्ट प्लेयर प्रदर्शित करेगा।

मैं आपके रास्ते से हार्डकोडिंग की बजाय अपने गीत से माइम प्रकार को पढ़ने का सुझाव दूंगा।

public ActionResult StreamUploadedSongs(int id) 
{ 
    byte[] song = db.UploadedSongs.Where(x => x.Id == id).FirstOrDefault().SongBytes; 

    return File(song, "audio/" + song.MimeType); 
} 
1

यहां समस्या है, Google क्रोम और आईपैड (मुझे लगता है?) सामग्री-रेंज अनुरोधों के लिए समर्थन की आवश्यकता है। आप पूरे गीत को लोड कर रहे हैं, आपको इसके कुछ हिस्सों को लोड करने की आवश्यकता है। यदि आप मोज़िज़ला फ़ायरफ़ॉक्स लोड करते हैं तो आप अपना रास्ता काम करते हैं लेकिन Google क्रोम यह नहीं करता है। यह एचटीएमएल 5 ऑडियो के साथ भी होता है।

डिफ़ॉल्ट एएसपी इसका समर्थन नहीं करता है, तो आपको इसे मैन्युअल रूप से जोड़ना होगा। यही कारण है कि यह यूआरएल लिंक का उपयोग करते समय काम करता है और डीबी से चयन करते समय नहीं।

public FileStreamResult StreamUploadedSongs(int id) 
    { 
     byte[] song = db.UploadedSongs.Where(x => x.Id == id).FirstOrDefault().SongBytes; 
     long fSize = song.Length; 
     long startbyte = 0; 
     long endbyte = fSize - 1; 
     int statusCode = 200; 
     if ((Request.Headers["Range"] != null)) 
     { 
      //Get the actual byte range from the range header string, and set the starting byte. 
      string[] range = Request.Headers["Range"].Split(new char[] { '=', '-' }); 
      startbyte = Convert.ToInt64(range[1]); 
      if (range.Length > 2 && range[2] != "") endbyte = Convert.ToInt64(range[2]); 
      //If the start byte is not equal to zero, that means the user is requesting partial content. 
      if (startbyte != 0 || endbyte != fSize - 1 || range.Length > 2 && range[2] == "") 
      { statusCode = 206; }//Set the status code of the response to 206 (Partial Content) and add a content range header.          
     } 
     long desSize = endbyte - startbyte + 1; 
     //Headers 
     Response.StatusCode = statusCode; 

     Response.ContentType = "audio/mp3"; 
     Response.AddHeader("Content-Accept", Response.ContentType); 
     Response.AddHeader("Content-Length", desSize.ToString()); 
     Response.AddHeader("Content-Range", string.Format("bytes {0}-{1}/{2}", startbyte, endbyte, fSize)); 

     //Data 
     var stream = new MemoryStream(song, (int)startbyte, (int)desSize); 

     return new FileStreamResult(stream, Response.ContentType); 
    } 
संबंधित मुद्दे