2013-08-23 9 views
8

पर ब्राउज़र नेविगेशन पर लोड नहीं है कहते है मैं एक विस्तार लोड हो जाता है कि जब आप एक यूट्यूब वीडियो page.I पर पहुंचने देखा है कि जब एक आगे और पीछे नेविगेट करता क्रोम बटन का उपयोग कर, विस्तार संभवत जीता चलो लोड नहींChrome एक्सटेंशन यूट्यूब

{ 
    "name": "back forth", 
    "version": "0.1", 
    "manifest_version": 2, 
    "description": "back forth", 
    "permissions": ["storage", "*://www.youtube.com/watch*"], 
    "content_scripts": [ 
     { 
      "matches": ["*://www.youtube.com/watch*"], 
      "js": ["contentscript.js"] 
     } 
    ] 
} 

और contentscript

alert("loaded"); 

चेतावनी हमेशा दिखाई नहीं देता जब आगे पीछे नेविगेट:

एक उदाहरण के रूप में, मैं 2 फ़ाइलें, प्रकट की है। मैं इसे कैसे दूर कर सकता हूं, ताकि विस्तार हर बार लोड हो जाए?

+0

इसी http://stackoverflow.com/a/34100952/72321 – Dennis

उत्तर

17

YouTube ने पुशस्टेट-आधारित नेविगेशन के साथ एक परीक्षण शुरू किया है। सामान्य तौर पर, इस तरह के नेविगेशन केवल कोड है कि history.replaceState/history.pushState (या पृष्ठभूमि पृष्ठ में chrome.webNavigation.onHistoryStateUpdated घटना का उपयोग करके) के लिए कॉल अवरोधन इंजेक्शन लगाने के द्वारा सामग्री स्क्रिप्ट के भीतर पाया जा सकता है।

इस उत्तर के शेष यूट्यूब लिए विशिष्ट है।
यूट्यूब लोड के दौरान पृष्ठ के शीर्ष पर एक (लाल) प्रगति पट्टी दिखाता है। यह प्रगति पट्टी एक सीएसएस संक्रमण का उपयोग कर एनिमेटेड है। संक्रमण घटनाओं के बुलबुले के बाद से, आप एक संक्रमण घटना श्रोता को <body> पर बाध्य कर सकते हैं, और इन मामलों में नेविगेशन जांच सकते हैं।

आप *://www.youtube.com/watch* के बजाय *://www.youtube.com/* पर अपनी सामग्री स्क्रिप्ट सम्मिलित करने के लिए, क्योंकि pushState / से /watch.. नेविगेट करने के लिए इस्तेमाल किया जा सकता है।

function afterNavigate() { 
    if ('/watch' === location.pathname) { 
     alert('Watch page!'); 
    } 
} 
(document.body || document.documentElement).addEventListener('transitionend', 
    function(/*TransitionEvent*/ event) { 
    if (event.propertyName === 'width' && event.target.id === 'progress') { 
     afterNavigate(); 
    } 
}, true); 
// After page load 
afterNavigate(); 

नोट: यह विधि इस तथ्य पर निर्भर करती है कि प्रगति पट्टी डाली गई है। जब भी Google प्रगति पट्टी की आईडी का नाम बदलने का निर्णय लेता है, या प्रगति पट्टी को पूरी तरह से हटा देता है, तो आपका कोड काम करना बंद कर देगा।

नोट 2: यह केवल सक्रिय टैब के लिए काम करता है। आप जबकि टैब केंद्रित नहीं है नेविगेशन परिवर्तन का पता लगाने की जरूरत है, तो आप एक window.onfocus और window.onblur घटना बाँध, और जाँच document.title इन घटनाओं के बीच बदली है या नहीं की जरूरत है। इस उत्तर के लिए

+0

धन्यवाद। इस विधि का उपयोग करना यह काम करता है लेकिन यह DOMContentLoaded जितना जल्दी नहीं है, ऐसा लगता है कि यह 'load' के बराबर है, वैसे भी 'DOMContentLoaded'-like बिंदु का पता लगाने के लिए है? – Noitidart

+1

@Noitidart यदि आप वास्तव में जितनी जल्दी हो सके अधिसूचित होना चाहते हैं, तो आप 'संक्रमण' घटना से जुड़ सकते हैं, दस्तावेज़ परिवर्तनों के लिए मतदान ('setTimeout' या' setInterval' का उपयोग कर)। जब आपको वांछित तत्व मिल गया है, तो संक्रमण ईवेंट को अनधिकृत करें + मतदान रोकें + अपनी कस्टम कॉलबैक का आह्वान करें। यह सुनिश्चित करने के लिए कि आप सीपीयू चक्र बर्बाद नहीं करते हैं, इसे संक्रमण घटना के साथ संयोजित करें; यदि आपके मतदान तर्क को उस बिंदु पर कुछ भी पता नहीं चला है, तो ईवेंट श्रोताओं को हटा दें, परामर्शदाता को रोकें और कॉलबैक का आह्वान करें। –

+0

जीनियस विचार @RobW धन्यवाद! मैंने 'window.onpopstate = function (e) {console.log (e)} जोड़ने का प्रयास किया, मैंने सोचा कि यह चाल करेगा लेकिन मुझे कोई कॉलबैक नहीं मिल रहा है। – Noitidart

संबंधित मुद्दे