ऑन-पेज जेएस

Question

के माध्यम से ध्वनि क्लाउड के lib/audiomanager तक पहुंचने के लिए मैं एक greasemonkey स्क्रिप्ट बनाए रखता हूं जो वर्तमान ट्रैक के साथ-साथ ध्वनि क्लाउड पर प्रगति पर नज़र रखता है। पहले, मैं किसी ऑब्जेक्ट तक पहुंच प्राप्त करने के लिए बस require("lib/audiomanager") कर सकता था जो मुझे पूरे पृष्ठ की स्थिति जैसे ट्रैक जानकारी खेलने की अनुमति देता है।

मुद्दा यह है कि, ध्वनि क्लाउड अपने क्लाइंटसाइड जावास्क्रिप्ट के लिए वेबपैक का उपयोग करने के लिए स्थानांतरित हो गया है। यह मेरी समझ के लिए, इन सभी वर्गों को एक पैकेज में एक विशिष्ट संख्या के रूप में स्टोर करता है। को हर बार क्लाइंटसाइड जेएस को अपडेट किया गया है और फिर से संकलित किए जाने के बाद उन्हें संग्रहीत किया गया नंबर दिखाई देता है।

वेबपैक के भीतर संग्रहीत वस्तुओं तक पहुंचने का एकमात्र तरीका वैश्विक वेबपैक जेसनपी के माध्यम से नीचे जैसा दिखता है। पैक के लिए संख्या सिर्फ अद्वितीय होना चाहिए।

webpackJsonp([6060], { 
    0: function (e, t, n) { 
     window.aman = n(726); 
     e.exports = function (abc) { 
      console.log("Exports called"); 
     }; 
    } 
}); 

कि कोड निष्पादित और मुझे webpack में उस नंबर पर वस्तु का उपयोग करने दे देंगे। वस्तु के रूप में जे एस webpack'd clientside में परिभाषित किया गया है:

726: function (e, t, n) { 
    (function (t) { 
     function i(e) { 
      var n = t(e.getContainerElement()), 
       i = e.getState() === r.States.ERROR; 
      n.toggleClass('blocked', i) 
     } 
     var r, 
      s = n(53), 
      o = n(14), 
      a = 1000/60; 
     e.exports = r = new s({ 
       flashAudioPath: n(2181), 
       flashObjectID: 'flashAudioObject', 
       updateInterval: a, 
       debug: !1 
      }), 
      r.Errors = s.Errors, 
      r.States = s.States, 
      r.UPDATE_INTERVAL = a, 
      o.once('audio:flash_block audio:flash_unblock', i) 
    }) 
    .call(t, n(1)) 
}, 

तो, समाधान मैं के बारे में सोच सकते हैं:

• , एक वस्तु जिसका webpack संख्या परिवर्तन नहीं करता है का पता लगाएं कि मैं करने के लिए उपयोग कर सकते हैं इस ऑब्जेक्ट को एक हैंडल प्राप्त करें
• प्रत्येक वेबपैक नंबर को दोहराएं और उस ऑब्जेक्ट को ढूंढें जिसमें इस तरह के तरीकों का एक ही सेट है।

उत्तरार्द्ध गन्दा लगता है, और पहला असंभव प्रतीत होता है। कोई विचार?

बातें मैं कोशिश की है:

• वांछित वस्तु की तरह एक नया एन (53) बनाना है यह एक ही भर में अपडेट रहने के लिए लगता है के रूप में। मुझे एक ऑडीओमेनगर देता है, लेकिन पेज के सामान्य ऑडिओमेनर से निश्चित रूप से अलग है, इसलिए मैं नहीं देख सकता कि क्या खेल रहा है।

Answer 1

अफैइक आप केवल दूसरे पैकेज से पैकेज तक पहुंच सकते हैं। साउंडक्लाउड ProvidePlugin का उपयोग नहीं करता है इसलिए वैश्विक अंतरिक्ष से पुस्तकालयों और मॉड्यूल में से कोई भी उपलब्ध नहीं है।

अपडेट किया गया:

मैं जानता हूँ कि यह एक बदसूरत हैक है, लेकिन यह काम करता है:

webpackJsonp([6060], { 
 
    0: function (e, t, n) { 
 
     var i = 0, 
 
     found = false, 
 
     lib; 
 
     while (i < 2000 && !found) { 
 
      try { 
 
       lib = n(i); 
 
      } 
 
      catch (err) { 
 
       lib = null; 
 
      } 
 

 
      if (lib && typeof lib._mute !== 'undefined') { 
 
       found = true; 
 
       console.log('found', lib, i); 
 
      } 
 
      console.log(i, lib); 
 
      i++; 
 
     } 
 
     window.aman = lib; 
 
    } 
 
});

Answer 2

हम भी SoundCloud एपीआई हमारे क्लाइंट साइड स्क्रिप्ट में उपयोग करते हैं, तो हम समाप्त हो गया थोड़ा 'क्लीनर' code के साथ। यहां इसका मुख्य भाग है (ध्यान दें कि इसमें ट्राइक-कैच ब्लॉक नहीं हैं क्योंकि सभी मॉड्यूल मौजूद हैं):

var playManager, libAudio, eventBus; 

webpackJsonp([], {0: function(a, b, require) 
{ 
    var modules = require.c; 

    for (var moduleid in modules) 
    { 
     var el = require(moduleid); 

     if (typeof el["playCurrent"] == "function") 
     { 
      playManager = el; 
     } 
     else if (typeof el["getSettings"] == "function") 
     { 
      libAudio = el; 
     } 
     else if (typeof el["trigger"] == "function" 
       && typeof el["bind"] == "function" 
       && typeof el["listenToOnce"] == "function" && 
       typeof el["$"] != "function" && 
       typeof el["broadcast"] == "function") 
     { 
      eventBus = el; 
     } 
}