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

Question

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

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

प्रमाणीकरण भाग के लिए, Android सहित सभी ब्राउज़रों में सब कुछ ठीक काम कर रहा है, लेकिन Google प्रमाणीकरण iPhone पर काम नहीं कर रहा है और यह मुझे यह त्रुटि संदेश देता है

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'.

अब जहाँ तक मेरा सवाल है मैं अपनी HTML फ़ाइलों में किसी भी iframe का उपयोग नहीं करता।

मैं इधर-उधर भटकता रहा, लेकिन मुझे कोई जवाब नहीं मिला।

Comments

iframes का उपयोग कभी-कभी ऐसी सेवाओं द्वारा भी किया जा रहा है जिससे आप कनेक्ट होते हैं, भले ही यह दिखाई न दे (पहली नजर में)

— NoWomenNoCry

Answer 1

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

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

Comments

आप यह भी बदल सकते हैं कि "v /" के बजाय "एम्बेड /" का उपयोग करने के लिए एक पूर्ण URL बन जाएगा:<iframe width='1080' height='760' src="https://www.youtube.com/embed/dQw4w9WgXcQ" frameborder="0" allowfullscreen></iframe>

— बैकवर्ड

मैं इस सवाल का जवाब करने के लिए बदलने के लिए सुझाव है कि "एम्बेड /" क्योंकि "वी /" अब और काम नहीं कर रहा

— tm81

Answer 2

इस SO पोस्ट की सहायता से इस पर अधिक समय बिताने के बाद ठीक है

"X- फ्रेम-ऑप्शंस द्वारा निषिद्ध प्रदर्शन" पर काबू पाना

मैं &output=embedGoogle URL पर पोस्ट करने से पहले url के अंत में समस्या को हल करने में कामयाब रहा :

var url = data.url + "&output=embed";
window.location.replace(url);

Comments

वास्तव में यह OAUTH के लिए है जैसा कि मैंने अपने मूल पोस्ट में बताया है। और अभी भी OAUTH 2.0 में है। हालाँकि, Google ने सेवा का उपयोग करने के लिए अपनी सेटिंग्स बदल दी हैं, इसलिए अब आपको विशेष रूप से OAUTH 2.0 का उपयोग करने के लिए कुछ गुणों को बदलना होगा और OWIN 3.0 मिडलवेयर में यह स्थिति है। यदि आपको "access_denied" त्रुटि संदेश मिल रहा है, तो इस लिंक का संदर्भ लें। blogs.msdn.com/b/webdev/archive/2014/07/02/…

— अली हमर

@AliHmer बहुत बहुत धन्यवाद दोस्त। आपने मेरा दिन बचाया :) और आउटपुट = एम्बेड ने मेरे लिए एक आकर्षण की तरह काम किया .. :)

— साहिल मनचंदा

ऐप वेबव्यू के भीतर Google-कैलेंडर iframe के लिए भी काम नहीं करता है।

— NoBugs 16

Answer 3

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

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>

Answer 4

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

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

अगर आप अपाचे का उपयोग कर रहे हैं तो 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>

Comments

क्या है your_relative_path?

— ग्रीन

यह क्या है आपका_रेटिव_पैथ?

— सोबियाहोलिक

Answer 5

यदि आप vimeo के लिए iframe का उपयोग कर रहे हैं, तो url को इसमें से बदलें:

https://vimeo.com/63534746

सेवा:

http://player.vimeo.com/video/63534746

इससे मेरा काम बनता है।

Answer 6

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

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>

Answer 7

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

बस विशेषता जोड़ें <iframe src="URL" target="_parent" />

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

_blank: अलग टैब में

Comments

मुझे नहीं पता कि मूल प्रश्न का उत्तर कितना प्रासंगिक है, लेकिन मेरे मामले में, एक अलग संदर्भ में, इसने समाधान प्रदान किया

— 4ric Viala

Answer 8

मेरे लिए तय यह था कि कंसोल.डेवलपर्स.ओक डॉट कॉम पर जाए और एप्लिकेशन डोमेन को OAuth 2 क्रेडेंशियल्स के "जावास्क्रिप्ट ओरिजिनल" सेक्शन में जोड़ें।

Answer 9

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

Comments

आपका क्या अर्थ है? मैंने यह भी देखा कि फ़्रेम सफारी विंडो में काम करता है, लेकिन ऐप के वेबव्यू के आइफ्रेम में नहीं, लेकिन आप इसे कैसे बदलते हैं?

— NoBugs

मेरा मुद्दा भी ऐसा ही था, जब वेब एप्लिकेशन क्लाइंट आईडी बनाते समय मैंने अपनी वेबसाइट के यूआरआई को दो वर्गों में शामिल नहीं किया था, जब आप क्लाइंट डेवलपर्स आईडी को गूगल डेवलपर्स कंसोल में

— बनाते हैं

Answer 10

मैं एक ही मुद्दे को कोणीय 9 में लागू कर रहा था। ये दो चरण हैं जो मैंने किए थे:

1. से अपने YouTube URL को परिवर्तित https://youtube.com/your_codeकरने के लिए https://youtube.com/embed/your_code।

2. और फिर DomSanitizerAngular के माध्यम से URL पास करें ।

   import { Component, OnInit } from "@angular/core";
   import { DomSanitizer } from '@angular/platform-browser';
   
   @Component({
     selector: "app-help",
     templateUrl: "./help.component.html",
     styleUrls: ["./help.component.scss"],
   })
   export class HelpComponent implements OnInit {
   
     youtubeVideoLink: any = 'https://youtube.com/embed/your_code'
   
     constructor(public sanitizer: DomSanitizer) {
       this.sanitizer = sanitizer;   
     }
   
     ngOnInit(): void {}
   
     getLink(){
       return this.sanitizer.bypassSecurityTrustResourceUrl(this.youtubeVideoLink);
     }
   
   }

   <iframe width="420" height="315" [src]="getLink()" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

Answer 11

एक समाधान है जो मेरे लिए काम करता है, माता-पिता का जिक्र है। Url प्राप्त करने के बाद, जो Google प्रमाणीकरण पृष्ठ पर रीडायरेक्ट करेगा, आप निम्न कोड आज़मा सकते हैं:

var loc = redirect_location;      
window.parent.location.replace(loc);

Answer 12

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

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" को विभाजित करेगा। आपको वीडियो आईडी प्राप्त करनी होगी, फिर URL पर एम्बेड के रूप में सेट करना होगा। एचटीएमएल में

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

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

Answer 13

URL प्रत्यय के साथ नीचे जोड़ें

/override-http-headers-default-settings-x-frame-options

Answer 14

यूट्यूब चैट एम्बेड करने के लिए इसी तरह की समस्या थी और मैं इसका पता लगाता हूं। शायद इसी तरह की समस्या के लिए एक समान समाधान है।

Refused to display 'https://www.youtube.com/live_chat?v=yDc9BonIXXI&embed_domain=your.domain.web' in a frame because it set 'X-Frame-Options' to 'sameorigin'

मेरा वेबपेज www और इसके बिना काम करता है। तो यह काम करने के लिए आपको यह सुनिश्चित करने की ज़रूरत है कि आप उस एक को लोड करें जिसे एम्बेड_डोमेन = मान पर सूचीबद्ध किया गया है ... हो सकता है कि कोई चर आपके लापता को यह बताए कि आपके आइफ्रेम को कहां एम्बेड करना है। मेरी समस्या को ठीक करने के लिए सही वेबपेज का पता लगाने और उचित iframe एम्बेड डोमेन नाम को निष्पादित करने के लिए एक स्क्रिप्ट लिखना था।

<iframe src='https://www.youtube.com/live_chat?v=yDc9BonIXXI&embed_domain=your.domain.web' width="100%" height="600" frameborder='no' scrolling='no'></iframe>

या

<iframe src='https://www.youtube.com/live_chat?v=yDc9BonIXXI&embed_domain=www.your.domain.web' width="100%" height="600" frameborder='no' scrolling='no'></iframe>

समझें कि आप iframes का उपयोग नहीं कर रहे हैं, लेकिन फिर भी कुछ वैरिएबल हो सकते हैं जिन्हें आपको अपने सिंटैक्स में जोड़ने की आवश्यकता है ताकि यह बता सकें कि स्क्रिप्ट का उपयोग कहां होने जा रहा है।

Answer 15

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

var frame = document.createElement('iframe');
frame.style.display = 'none';
frame.setAttribute('src', 'about:blank');
document.body.appendChild(frame);
frame.addEventListener('load', () => {
  frame.setAttribute('src', url);
});

Answer 16

youtube / एम्बेड, दो स्वाद:

https://www.youtube.com/embed/watch?v=eAxV4uO8oTU&list=RDeAxV4uO8oTU&start_radio=1 https://www.youtube.com/embed/CGG7yrHHJ5A

अपने ब्राउज़र में पेस्ट करें और देखें

असली:

https://www.youtube.com/watch?v=eAxV4uO8oTU&list=RDeAxV4uO8oTU&start_radio=1 https://www.youtube.com/watch?v=CNGGyryrHHJ5A

एक को "वॉ? वी =" रखने की जरूरत है, दूसरे को नहीं