angularjs - एक फ्रेम में प्रदर्शित करने से इंकार कर दिया क्योंकि यह 'एक्स-फ्रेम-विकल्प' को 'सैमोरिजिन' पर सेट करता है





asp.net-web-api google-oauth (10)


मुझे एक बेहतर समाधान मिला, शायद यह "watch?v=" को "v/" द्वारा प्रतिस्थापित करने में मदद कर सकता है और यह काम करेगा

var url = url.replace("watch?v=", "v/");

मैं ऐसी वेबसाइट विकसित कर रहा हूं जिसे उत्तरदायी माना जाता है ताकि लोग इसे अपने फोन से एक्सेस कर सकें। साइट पर कुछ सुरक्षित भाग हैं जिन्हें Google, Facebook, ... आदि (OAuth) का उपयोग करके लॉग इन किया जा सकता है।

सर्वर बैकएंड एएसपी.Net वेब एपीआई 2 का उपयोग करके विकसित किया गया है और फ्रंट एंड मुख्य रूप से एंगुलरजेएस कुछ रेजर के साथ है।

प्रमाणीकरण भाग के लिए, एंड्रॉइड समेत सभी ब्राउज़रों में सब ठीक काम कर रहा है लेकिन Google प्रमाणीकरण आईफोन पर काम नहीं कर रहा है और यह मुझे यह त्रुटि संदेश देता है

Refused to display 'https://accounts.google.com/o/openid2/auth
?openid.ns=http://specs.openid.ne…tp://axschema.org/namePerson
/last&openid.ax.required=email,name,first,last'
in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.

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

मैं चारों ओर घूम गया, लेकिन इस मुद्दे को ठीक करने के लिए मुझे कोई जवाब नहीं मिला।




बहुत देर हो चुकी है, लेकिन यदि आप किसी web application Client ID बजाय native application Client ID उपयोग करते हैं तो यह त्रुटि भी हो सकती है।




प्रश्न के लिए धन्यवाद। यूट्यूब iframe के लिए पहला मुद्दा वह यूआरएल है जो आपने दिया है, क्या यह पता बार से एम्बेडेड यूआरएल या यूआरएल लिंक है। गैर एम्बेड यूआरएल के लिए यह त्रुटि लेकिन यदि आप गैर एम्बेड यूआरएल देना चाहते हैं तो आपको "सुरक्षित पाइप" में कोड करना होगा (दोनों गैर एम्बेडेड या एम्बेड यूआरएल के लिए):

import {Pipe, PipeTransform} from '@angular/core';
import {DomSanitizer} from '@angular/platform-browser';

@Pipe({name: 'safe'})
export class SafePipe implements PipeTransform {

constructor(private sanitizer: DomSanitizer) {

}

transform(value: any, url: any): any {
    if (value && !url) {
        const regExp = /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/;
        let match = value.match(regExp);
        if (match && match[2].length == 11) {
            console.log(match[2]);
            let sepratedID = match[2];
            let embedUrl = '//www.youtube.com/embed/' + sepratedID;
            return this.sanitizer.bypassSecurityTrustResourceUrl(embedUrl);
        }

     }

   }
}

यह "vedioId" विभाजित होगा। आपको वीडियो आईडी प्राप्त करना होगा और फिर एम्बेडेड के रूप में यूआरएल पर सेट करना होगा। एचटीएमएल में

 <div>
   <iframe width="100%" height="300" [src]="video.url | safe"></iframe>
 </div>

कोणीय 2/5 फिर से धन्यवाद।




मेरे लिए फिक्स console.developer.google.com में जाना था और एप्लिकेशन डोमेन को OAuth 2 प्रमाण-पत्रों के "जावास्क्रिप्ट उत्पत्ति" अनुभाग में जोड़ना था।




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

इस उद्देश्य के लिए आपको अपने अपाचे या किसी भी अन्य सेवा में स्थान से मिलान करने की आवश्यकता है जिसका आप उपयोग कर रहे हैं

यदि आप apache का उपयोग httpd.conf फ़ाइल में कर रहे हैं।

  <LocationMatch "/your_relative_path">
      ProxyPass absolute_path_of_your_application/your_relative_path
      ProxyPassReverse absolute_path_of_your_application/your_relative_path
   </LocationMatch>



उपयोग करने का प्रयास करें

https://www.youtube.com/embed/YOUR_VIDEO_CODE

आप 'एम्बेडेड कोड' अनुभाग में सभी एम्बेड किए गए कोड पा सकते हैं और ऐसा लगता है

<iframe width="560" height="315"  src="https://www.youtube.com/embed/YOUR_VIDEO_CODE" frameborder="0" allowfullscreen></iframe>






मैंने नीचे दिए गए परिवर्तन किए और मेरे लिए ठीक काम किया।

बस विशेषता <iframe src="URL" target="_parent" />

_parent : यह एक ही विंडो में एम्बेडेड पेज खोल देगा।

_blank : विभिन्न टैब में




यूट्यूब वीडियो को अपने कोणीय पृष्ठ में एम्बेड करने के लिए, आप बस अपने वीडियो के लिए निम्नलिखित फ़िल्टर का उपयोग कर सकते हैं

app.filter('scrurl', function($sce) {
    return function(text) {
        text = text.replace("watch?v=", "embed/");
        return $sce.trustAsResourceUrl(text);
    };
});
<iframe class="ytplayer" type="text/html" width="100%" height="360" src="{{youtube_url | scrurl}}" frameborder="0"></iframe>




  • क्या मैं पूछ सकता हूं कि आप इस सेक्शन को क्यों हटाना चाहते हैं? जैसे आप अपनी सेवा में फॉर्मूरलेनोडेड फॉर्मेटर का समर्थन नहीं करना चाहते हैं? यदि हां, तो आप फॉर्मेटर के संग्रह से खुद को फॉर्मेटर को हटा सकते हैं, इस मामले में यह खंड दिखाई नहीं देगा।

    config.Formatters.Clear();
    config.Formatters.Add(new JsonMediaTypeFormatter());
    config.Formatters.Add(new XmlMediaTypeFormatter());  
    
  • वैकल्पिक रूप से, आप Areas\HelpPage\SampleGeneration\HelpPageSampleGenerator.cs पर फ़ाइल में निम्न परिवर्तन ( Areas\HelpPage\SampleGeneration\HelpPageSampleGenerator.cs टिप्पणियां) कर सकते हैं और निम्न कार्य करें, जो स्वरूपण को फ़िल्टर करना है:

        // Do the sample generation based on formatters only if an action doesn't return an HttpResponseMessage.
        // Here we cannot rely on formatters because we don't know what's in the HttpResponseMessage, it might not even use formatters.
        if (type != null && !typeof(HttpResponseMessage).IsAssignableFrom(type))
        {
            object sampleObject = GetSampleObject(type);
    
            // Change Begin --------------------------------------
            IEnumerable<MediaTypeFormatter> filteredFormatters = formatters.Where(frmtr => frmtr.GetType() != typeof(JQueryMvcFormUrlEncodedFormatter));
    
            foreach (var formatter in filteredFormatters)
            {
    
            // Change End --------------------------------------
    




angularjs asp.net-web-api google-oauth