2017-03-15 8 views
5

के भीतर यूट्यूब प्रदर्शित करना मैं एक आईओएसआईसी 2 फीड के भीतर यूट्यूब वीडियो प्रदर्शित करने की कोशिश कर रहा हूं, जिसमें जेएसओएन डेटा फीड से खींचे गए यूआरएल हैं।एक आईओनिक 2 ऐप

व्यक्तिगत वीडियो प्रदर्शित किए जा सकते हैं जब यूट्यूब यूआरएल विवरण पृष्ठ पर कन्स्ट्रक्टर में सेट किया गया है, लेकिन मुझे JSON फ़ीड में प्रत्येक वीडियो के लिए वीडियो प्रदर्शित करने के लिए विवरण पृष्ठ की आवश्यकता है।

import {SafeResourceUrl, DomSanitizer} from '@angular/platform-browser'; 
videoUrl: SafeResourceUrl; 

constructor(private domSanitizer: DomSanitizer, public navCtrl: NavController) { 
this.videoUrl = this.domSanitizer.bypassSecurityTrustResourceUrl('https://www.youtube.com/embed/DuwXCFyo4-w') 
} 
:

यहाँ कैसे एक व्यक्ति यूट्यूब वीडियो detail.ts और detail.html भीतर आयोनिक 2 में प्रदर्शित करने के लिए सक्षम है

<iframe width="100%" height="315" [src]="data.youtube" frameborder="0" allowfullscreen></iframe> 

आईओएस tweak

<allow-navigation href="https://*youtube.com/*"/> 

क्या मैं जरूरत detail.ts में कुछ कोड फेरबदल किसी भी यूट्यूब यूआरएल अनुमति देने के लिए है?

यहाँ यूट्यूब विवरण पृष्ठ http://plnkr.co/edit/Ar2whVFCmBAbE7fxA3nf?p=preview

enter image description here

एक समाधान मैंने देखा है नीचे है पर एक Plunker में दिखाया गया है, लेकिन यह काम करने के लिए प्रतीत नहीं कर सकते हैं:

transform(videoId: string): SafeResourceUrl { 
return this.domSanitizer.bypassSecurityTrustResourceUrl(
https://www.youtube.com/embed/${videoId}); 
} 
+0

आप इस देखा है? http://stackoverflow.com/questions/39059601/playing-youtube-video-using-iframe-in-ionic-2-app#39398934 – ipinak

उत्तर

8

आप इसे गलत कर रहे हैं। आपको अपने आयनिक ऐप पर एम्बेडेड यूट्यूब फ्रेम का उपयोग नहीं करना चाहिए।

आप Ionic Youtube Plugin

का उपयोग करना चाहिए यह स्थापित करने के लिए आदेश पंक्ति में अपने आयोनिक परियोजना पर जाएँ:

ionic plugin add https://github.com/Glitchbone/CordovaYoutubeVideoPlayer.git 
npm install --save @ionic-native/youtube-video-player 

बेसिक उपयोग:

import { YoutubeVideoPlayer } from '@ionic-native/youtube-video-player'; 

constructor(private youtube: YoutubeVideoPlayer) { } 

this.youtube.openVideo('myvideoid'); 
बेशक

'myvideoid' है आपकी यूट्यूब वीडियो आईडी एक स्ट्रिंग के रूप में पास की गई।

+0

इसे आईफ़्रेम के साथ HTML wise कैसे प्रदर्शित किया जाना चाहिए?