'DOMWindow' पर 'पोस्टमैसेज' को अंजाम देने में विफल: https://www.youtube.com! == http: // http: // 9000

Question

यह त्रुटि संदेश है जो मुझे मिलता है:

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided
('https://www.youtube.com') does not match the recipient window's origin 
('http://localhost:9000').

मैंने अन्य समान समस्याओं को देखा है जहां लक्ष्य उत्पत्ति है http://www.youtube.comऔर प्राप्तकर्ता मूल है https://www.youtube.com, लेकिन मेरा जैसा कोई नहीं है जहां लक्ष्य है https://www.youtube.comऔर मूल है http://localhost:9000।

1. मुझे समस्या नहीं आती। समस्या क्या है?
2. मेरे द्वारा यह कैसे किया जा सकता है?

Comments

'DOMWindow' पर 'पोस्टमेज' को अंजाम देने

— Leo

मेरे पास एक ही मुद्दा था, और @ChrisFranklin द्वारा नीचे दिए गए फिक्स ने इसे मेरे लिए तय किया; लेकिन यह अजीब है कि मेरे मुद्दे के साथ, मुझे केवल आधे समय के बारे में त्रुटि मिलेगी, और तब भी वीडियो अभी भी लोड होगा (हालांकि अन्य चीजें टूट जाएगी)।

— dgo

@ वही मुद्दा, यह पेज लोड पर यादृच्छिक था। पता चलता है (मुझे लगता है) वास्तविक iframe सामग्री के कारण पूरी तरह से समय तक तैयार नहीं होने के कारण कुछ और पोस्टमैसेज करने का प्रयास कर रहा है। तो इसकी एक दौड़ की स्थिति। और अगर पोस्टमासेज बाद के समय (उपयोगकर्ता कार्रवाई) में होता है, तो यह त्रुटि के बिना ठीक काम करता है।

— अतुल्य

यहां तक ​​कि Google के पास स्वयं वह त्रुटि है - कंसोल खोलें और यहां वीडियो चलाएं: Developers.google.com/youtube/iframe_api_reference

— T.Todua

Answer 1

मेरा मानना ​​है कि यह एक लक्ष्य है, जिसका मूल लक्ष्य है https। मुझे संदेह है क्योंकि आपके iFrame url के httpबजाय इसका उपयोग किया जा रहा है https। उस फ़ाइल का url बदलने का प्रयास करें जिसे आप एम्बेड करने की कोशिश कर रहे हैं https।

उदाहरण के लिए:

'//www.youtube.com/embed/' + id + '?showinfo=0&enablejsapi=1&origin=http://localhost:9000';

होने के लिए:

'https://www.youtube.com/embed/' + id + '?showinfo=0&enablejsapi=1&origin=http://localhost:9000';

Comments

लगता है काम किया है। धन्यवाद! तो समस्या httpबनाम है https? इससे कोई फर्क नहीं पड़ता कि डोमेन अलग-अलग हैं (youtube बनाम लोकलहोस्ट)? और वास्तव में लक्ष्य उत्पत्ति बनाम प्राप्तकर्ता मूल क्या है? आपने जो कहा है उसे कैसे प्राप्त किया जाए प्राप्तकर्ता मूल (मेरा यूआरएल अभी भी स्थानीय है: 9000)?

— एडम ज़र्नर

त्रुटि थोड़ी भ्रामक है। यह वास्तव में आप पर होने के साथ कुछ नहीं करना है localhost:9000। समस्या वास्तव में उस तरह से थी जैसे आप youtube-api का उपयोग कर रहे थे। जब आप एपीआई को tag.src = "https://www.youtube.com/iframe_api";अपने कोड के रूप में घोषित करते हैं, तो आप youtube को ssl का उपयोग करना चाहते हैं। इसलिए, मेरे द्वारा सुझाए गए परिवर्तन ने वीडियो का अनुरोध करने के लिए आपको ssl का उपयोग करने के लिए बदल दिया। त्रुटि सिर्फ यह कह रही थी कि आप ssl और गैर-ssl कॉल्स को मिला रहे हैं।

— क्रिस फ्रैंकलिन

मैं इस मुद्दे पर आया जब मैंने डोम में इफ्रेम को घूमने की कोशिश की। playerEl = document.querySelector('iframe#ytplayer'); anotherEl.appendChild(playerEl); // yt complains on subsequent api calls

— लैब

क्या होगा अगर मैं YouTube प्लेयर को लोड करने के लिए जावास्क्रिप्ट का उपयोग कर रहा हूं?

— N3R4ZZuRR0

youtube और मेरे डोमेन के लिए https: // में परिवर्तित किया गया है: अभी भी मेरी समस्या का समाधान नहीं हुआ है। 'DOMWindow' पर 'पोस्टमैसेज' को निष्पादित करने में विफल: प्रदत्त लक्ष्य उत्पत्ति (' youtube.com ') प्राप्तकर्ता विंडो की उत्पत्ति (' test.dev ') से मेल नहीं खाती ।

— vee

Answer 2

खिलाड़ी "origin"की paramVarsविशेषता में अपनी साइट के URL के साथ पैरामीटर को इस तरह जोड़ें:

this.player = new window['YT'].Player('player', {
    videoId: this.mediaid,
    width:'100%',
    playerVars: { 'autoplay': 1, 'controls': 0,'autohide':1,'wmode':'opaque','origin':'http://localhost:8100' },
}

Comments

उत्पत्ति: window.location, देव और उत्पादन को कवर करने के गुणों में

— जेम्स बेली

@JamesBailey window.location.origin.. window.locationएक वस्तु है।

— एसिडिक 9

जैसा कि एपीआई डॉक्टर कहते हैं, मूल खिलाड़ी वीयर का उपयोग केवल शुद्ध iframe कार्यान्वयन के साथ किया जाता है। जेएस एपीआई एक नहीं।

— डेमियन सी

ये सभी 'फ़िक्सेस' 2020 में हमारे लिए काम नहीं करते हैं। यह भी जोड़ने के लिए कि त्रुटि दिखाने पर इसका रैंडम प्रति पेज लोड होता है। यह हमारी साइट और यूट्यूब के बीच एक दौड़ की स्थिति है।

— अतुल्यभारत

window.location.host

— लीगी

Answer 3

इसे सेट करना इसे ठीक करता है:

  this$1.player = new YouTube.Player(this$1.elementId, {
    videoId: videoId,
    host: 'https://www.youtube.com',

Comments

इसे बनाने http (के बजाय https) ने मेरी समस्या हल कर दी।

— टोडुआ

यह मेरे लिए भी तय है। यह भी कर सकते हैं: host: `${window.location.protocol}//www.youtube.com`,

— जोएल Worsham

ये सभी 'फ़िक्सेस' 2020 में हमारे लिए काम नहीं करते हैं। यह भी जोड़ने के लिए कि त्रुटि दिखाने पर इसका रैंडम प्रति पेज लोड होता है। यह हमारी साइट और यूट्यूब के बीच एक दौड़ की स्थिति है।

— अतुल्यभारत

Answer 4

आप जावास्क्रिप्ट को स्थानीय फाइलों में सहेज सकते हैं:

• https://www.youtube.com/player_api
• https://s.ytimg.com/yts/jsbin/www-widgetapi-vfluxKqfs/www-widgetapi.js

पहली फ़ाइल में, player_apiयह कोड डालें:

if(!window.YT)var YT={loading:0,loaded:0};if(!window.YTConfig)var YTConfig={host:"https://www.youtube.com"};YT.loading||(YT.loading=1,function(){var o=[];YT.ready=function(n){YT.loaded?n():o.push(n)},window.onYTReady=function(){YT.loaded=1;for(var n=0;n<o.length;n++)try{o[n]()}catch(i){}},YT.setConfig=function(o){for(var n in o)o.hasOwnProperty(n)&&(YTConfig[n]=o[n])}}());

दूसरी फ़ाइल में, कोड खोजें: this.a.contentWindow.postMessage(a,b[c]);

और इसे बदलें:

if(this._skiped){
    this.a.contentWindow.postMessage(a,b[c]); 
}
this._skiped = true;

बेशक, आप एक फ़ाइल में संक्षिप्त कर सकते हैं - अधिक कुशल होगा। यह एक सही समाधान नहीं है, लेकिन यह काम करता है!

मेरा स्रोत: yt_api-concat

Comments

इसे मेरे लिए तय किया। वैसे भी स्थानीय स्तर पर फाइलें मेरे उपयोग के मामले में फिट थीं।

— लगातार

इसने मेरे लिए भी काम किया, लेकिन मुझे यकीन नहीं है कि क्यों। क्या आप बता सकते हैं कि यह इसे ठीक क्यों करता है?

— जच्वनेस

धन्यवाद, दूसरे अजाक्स कॉल पर मेरे सवाल का जवाब दिया: stackoverflow.com/questions/58232081/…

— Diogo Almeida

मेरे विचार से, लाइब्रेरी के लिए स्थानीय फ़ाइल का उपयोग करना, विशेष रूप से थर्ड पार्टी सर्विस लाइब्रेरी के लिए, कोड के लिए एक बहुत बुरा तरीका है। नहीं ?

— डेमियन सी

@DamienC यह सुनिश्चित करने के लिए आदर्श से कम है। लेकिन, इस धागे पर अन्य सभी "सुधारों" के आधार पर, मुझे आश्चर्य नहीं है (और न ही मैं वास्तव में न्यायाधीश हूं) अन्य डेवलपर्स मैन्युअल रूप से एपीआई कोड को बदल रहे हैं।

— Erutan409

Answer 5

सुनिश्चित करें कि आप URL से लोड कर रहे हैं जैसे:

https://www.youtube.com/embed/HIbAz29L-FA?modestbranding=1&playsinline=0&showinfo=0&enablejsapi=1&origin=https%3A%2F%2Fintercoin.org&widgetid=1

"मूल" घटक पर ध्यान दें, साथ ही साथ "enablejsapi = 1"। मूल से मेल खाना चाहिए कि आपका डोमेन क्या है, और फिर इसे श्वेतसूचीबद्ध किया जाएगा और काम किया जाएगा।

Answer 6

window.location.hrefखिड़की की उत्पत्ति से मिलान करने के लिए url का उपयोग करने का प्रयास करें ।

Comments

अच्छा, मैं अन्य सभी जवाब की कोशिश की और यह मेरे लिए काम किया!

— क्लोशर 4o

Answer 7

मुझे भी यही त्रुटि मिली। मेरी गलती यह थी कि enablejsapi=1पैरामीटर iframesrc में मौजूद नहीं था ।

Answer 8

मुझे लगता है कि त्रुटि का वर्णन भ्रामक है और मूल रूप से खिलाड़ी ऑब्जेक्ट के गलत उपयोग के साथ करना है।

स्लाइडर में नए वीडियो पर स्विच करते समय मेरे पास एक ही मुद्दा था।

जब केवल यहाँ वर्णितplayer.destroy() फ़ंक्शन का उपयोग करके समस्या दूर हो गई है।

Comments

क्या आप यह देख सकते हैं कि क्या आप समझते हैं कि मैं यहां YouTube में क्या अनुभव कर रहा हूं और क्या यह संबंधित है? stackoverflow.com/q/57649870/470749 शायद आपका जवाब होगा। धन्यवाद!

— रयान

Answer 9

मुझे भी यही समस्या थी और यह पता चला क्योंकि मुझे क्रोम एक्सटेंशन "HTTPS एवरीवेयर" चल रहा था। एक्सटेंशन को अक्षम करने से मेरी समस्या हल हो गई।

Answer 10

यह सटीक त्रुटि YouTube द्वारा सामग्री ब्लॉक से संबंधित थी जब "कुछ साइटों या अनुप्रयोगों पर प्लेबैक किया जाता था"। अधिक विशेष रूप से WMG (वार्नर म्यूजिक ग्रुप) द्वारा।

त्रुटि संदेश ने हालांकि यह सुझाव दिया कि एक http साइट पर एक iframe आयात एक मुद्दा था, जो इस मामले में नहीं था।

Answer 11

डीएनएस प्रीफेच को हटा दें इस मुद्दे को हल करेंगे।

यदि आप वर्डप्रेस का उपयोग कर रहे हैं, तो इस लाइन को अपने विषय के फ़ंक्शन में जोड़ें

remove_action( 'wp_head', 'wp_resource_hints', 2 );

Answer 12

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

<iframe class="test-testimonials-youtube-group"  type="text/html" width="100%" height="100%"
  src="http://www.youtube.com/embed/HiIsKeXN7qg?enablejsapi=1&origin=http://localhost:8000"
  frameborder="0">
</div>

रेफरी: https://developers.google.com/youtube/iframe_api_reference#Loading_a_VideoPPayer

Answer 13

निम्नलिखित में से कोई भी हो सकता है, लेकिन उन सभी को जावास्क्रिप्ट द्वारा अभिगमन से पहले डोम में लोड नहीं किया जाता है।

तो यहाँ है जो आपको वास्तव में JS कोड को कॉल करने से पहले सुनिश्चित करना है: * सुनिश्चित करें कि कंटेनर को किसी भी जावास्क्रिप्ट से पहले लोड किया गया है * कहा जाता है सुनिश्चित करें कि जो भी कंटेनर में है उसमें लक्ष्य URL लोड किया गया है

मैं इसी तरह के मुद्दे पर आया था, लेकिन अपने स्थानीय पर जब मैं अपने जावास्क्रिप्ट को मुख्य पृष्ठ के ऑनलोड से पहले अच्छी तरह से चलाने की कोशिश कर रहा हूं जो त्रुटि संदेश का कारण बनता है। मैंने इसे लोड करने के लिए पूरे पृष्ठ की प्रतीक्षा करने और फिर आवश्यक फ़ंक्शन को कॉल करके निर्धारित किया है।

जब पृष्ठ लोड हो गया हो, तो आप एक टाइमआउट फ़ंक्शन जोड़कर बस ऐसा कर सकते थे और अपने ऑनलोड इवेंट को कॉल कर सकते हैं जैसे:

window.onload = new function () {setTimeout (फंक्शन () {// कुछ ऑनलोड इवेंट}, 10); }

यह सुनिश्चित करेगा कि आप जो भी कोशिश कर रहे हैं, वह अच्छी तरह से चालू हो जाएगा जब onLad ट्रिगर है।

Comments

document.addEventListener("DOMContentLoaded", function () {दुर्भाग्य से अंदर सब कुछ डाल मदद नहीं की।

— रयान

Answer 14

जब आप कॉल में targetOrigin निर्दिष्ट नहीं करते हैं तो आपको यह संदेश भी मिलता हैwindow.postMessage() ।

इस उदाहरण में हम पहले iFrame और *लक्ष्य के रूप में उपयोग करने के लिए एक संदेश पोस्ट करते हैं , जो किसी भी लक्ष्य के लिए संचार की अनुमति देनी चाहिए।

window.frames[0].postMessage({
                    message : "Hi there",
                    command :"hi-there-command",
                    data : "Some Data"
                }, '*')

Answer 15

मेरे उदाहरण में कम से कम यह एक हानिरहित "तैयार नहीं" स्थिति प्रतीत होती है कि एपीआई सफल होने तक पीछे हट जाती है।

मुझे इनमें से दो से नौ तक कहीं भी मिल जाता है (मेरे सबसे खराब स्थिति वाले परीक्षक पर, 2009 के फॉसिलबुक, जिसमें 20 टैब सेलुलर हॉटस्पॉट के माध्यम से खुले हैं) .... लेकिन फिर वीडियो ठीक से काम करता है। एक बार जब यह निश्चित रूप से काम करने के लिए मेरी पोस्टमेजेज-आधारित कॉल चला रहा है, तो दूसरों ने परीक्षण नहीं किया है।

Answer 16

कुछ मामलों में (जैसा कि एक टिप्पणीकार ने उल्लेख किया है) इसका कारण यह हो सकता है कि आप खिलाड़ी को DOM, like appendया etc में घुमा रहे हैं।

Answer 17

तुम कोशिश कर सकते हो :

document.getElementById('your_id_iframe').contentWindow.postMessage('your_message', 'your_domain_iframe')

Answer 18

मैं भी इसी मुद्दे का सामना कर रहा था तब मैं आधिकारिक Youtube इफ्रेम एपी का दौरा करता हूं जहां मुझे यह मिला:

उपयोगकर्ता के ब्राउज़र को HTML5 पोस्टमैसेज सुविधा का समर्थन करना चाहिए। अधिकांश आधुनिक ब्राउज़र पोस्टमैसेज का समर्थन करते हैं

और यह देखने के लिए भटकते हैं कि आधिकारिक पृष्ठ भी इस मुद्दे का सामना कर रहा था। बस आधिकारिक Youtube Iframe Api पर जाएं और कंसोल लॉग देखें। मेरा Chrome संस्करण 79.0.3945.88 है।

Answer 19

मेरा था:

<youtube-player
  [videoId]="'paxSz8UblDs'"
  [playerVars]="playerVars"
  [width]="291"
  [height]="194">
</youtube-player>

मैंने प्लेयर प्लेयर के साथ लाइन को हटा दिया, और यह कंसोल पर त्रुटियों के बिना काम किया।