কোনও ফ্রেমে প্রদর্শন করতে অস্বীকৃতি জানায় কারণ এটি 'এক্স-ফ্রেম-বিকল্পগুলি' কে 'সাম্যুরিজিন' এ সেট করে


272

আমি এমন একটি ওয়েবসাইট বিকাশ করছি যা ধারণাযোগ্য বলে মনে করা হচ্ছে যাতে লোকেরা তাদের ফোন থেকে এটি অ্যাক্সেস করতে পারে। সাইটটিতে কিছু সুরক্ষিত অংশ পাওয়া গেছে যা গুগল, ফেসবুক, ... ইত্যাদি (ওআউথ) ব্যবহার করে লগ ইন করতে পারে।

সার্ভার ব্যাকএন্ডটি এএসপি.নেট ওয়েব এপিআই 2 ব্যবহার করে তৈরি করা হয়েছে এবং সামনের প্রান্তটি কিছুটা রেজারের সাথে মূলত অ্যাঙ্গুলারজেএস।

প্রমাণীকরণ অংশের জন্য, অ্যান্ড্রয়েড সহ সমস্ত ব্রাউজারে সবকিছু ঠিকঠাক কাজ করছে তবে গুগল প্রমাণীকরণ আইফোনে কাজ করছে না এবং এটি আমাকে এই ত্রুটি বার্তা দেয়

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

এখন পর্যন্ত আমি আমার এইচটিএমএল ফাইলগুলিতে কোনও আইফ্রেম ব্যবহার করি না ra

আমি প্রায় googled, কিন্তু কোন উত্তর আমাকে সমস্যা সমাধান করতে পারেনি।


আইফ্রেমগুলি কখনও কখনও পরিষেবাগুলিতে ব্যবহার করা হয় যা আপনি সংযুক্ত করেন এমনকি যদি এটি দৃশ্যমান না হয় (প্রথম দর্শনে)
NoWomenNoCry

উত্তর:


171

আমি একটি ভাল সমাধান পাওয়া যায় নি, হয়তো এটা সাহায্য করতে কারো প্রতিস্থাপন "watch?v="দ্বারা "v/"এবং এটি কাজ করবে

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

51
আপনি "ভি /" এর পরিবর্তে "এম্বেড /" ব্যবহার করতেও এটি পরিবর্তন করতে পারেন যাতে একটি সম্পূর্ণ ইউআরএল হয়ে যায়:<iframe width='1080' height='760' src="https://www.youtube.com/embed/dQw4w9WgXcQ" frameborder="0" allowfullscreen></iframe>
পিছনে

1
আমি এই উত্তরটি "এম্বেড /" - এ পরিবর্তন করার পরামর্শ দিচ্ছি কারণ "ভি /" আর কাজ করছে না
tm81

88

এই এসও পোস্টের সহায়তায় এটিতে আরও বেশি সময় ব্যয় করার পরে ঠিক আছে

"এক্স-ফ্রেম-বিকল্পগুলির দ্বারা নিষিদ্ধ প্রদর্শন" কাটিয়ে ওঠা

আমি &output=embedগুগল ইউআরএল পোস্ট করার আগে url এর শেষে যুক্ত করে সমস্যাটি সমাধান করতে সক্ষম হয়েছি :

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

1
আমি এটি আমার মূল পোস্টে যেমন বলেছি ঠিক তেমনি এটি আউথের জন্য। এবং এখনও OAUTH 2.0 তে করে। যদিও, গুগল পরিষেবাটি ব্যবহারের জন্য তার সেটিংস পরিবর্তন করেছে, সুতরাং এখন আপনাকে বিশেষত OAUTH 2.0 ব্যবহার করতে কিছু বৈশিষ্ট্য পরিবর্তন করতে হবে এবং এটি ওউইএন 3.0 মিডলওয়্যারের ক্ষেত্রে। আপনি যদি "access_denied" ত্রুটি বার্তা পেয়ে থাকেন তবে এই লিঙ্কটি দেখুন। ব্লগস.এমএসডিএন
আলী হামার

1
@ অলিহ্যামার ধন্যবাদ অনেক বন্ধু আপনি আমার দিনটি সংরক্ষণ করেছেন :) এবং আউটপুট = এম্বেড করা আমার জন্য আকর্ষণীয় কাজ করেছে .. :)
সাহিল মনচাঁদা

1
অ্যাপ্লিকেশন ওয়েবভিউয়ের মধ্যে গুগল-ক্যালেন্ডার iframe এর জন্যও কাজ করে না।
নোব্যাগস

42

ব্যবহার করার চেষ্টা করুন

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>

35

তারা এক্ষেত্রে সামোরজিগিনে শিরোনাম সেট করেছে, যার অর্থ তারা তাদের ডোমেনের বাইরের কোনও আইফ্রেমে সংস্থানটি লোড করার বিষয়টি অস্বীকার করেছেন। সুতরাং এই 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>

2
কী your_relative_path?
সবুজ

2
এটা কি আপনার_ সম্পর্কিত_পথ?
সোবিয়োলিক


11

ইউটিউব ভিডিওটি আপনার কৌণিক পাতাতে এম্বেড করার জন্য, আপনি কেবল আপনার ভিডিওর জন্য নিম্নলিখিত ফিল্টারটি ব্যবহার করতে পারেন

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>


7

আমি নীচের পরিবর্তনগুলি করেছি এবং আমার জন্য ভাল কাজ করে।

কেবল গুণটি যুক্ত করুন <iframe src="URL" target="_parent" />

_parent: এটি একই উইন্ডোতে এমবেডড পৃষ্ঠা খুলবে।

_blank: বিভিন্ন ট্যাবে


1
আমি জানি না যে মূল প্রশ্নের উত্তরটি কতটা প্রাসঙ্গিক, তবে আমার ক্ষেত্রে, অন্য প্রসঙ্গে, এটি সমাধানটি সরবরাহ করেছে
Éric Viala

4

আমার জন্য এই সিদ্ধান্তটি কনসোল.ডিভলভর.কম.তে গিয়ে OAuth 2 শংসাপত্রের "জাভাস্ক্রিপ্ট অরিজিনস" বিভাগে অ্যাপ্লিকেশন ডোমেন যুক্ত করা ছিল।


2

অল্প দেরীতে, তবে আপনি যদি একটি এর native application Client IDপরিবর্তে একটি ব্যবহার করেন তবে এই ত্রুটিটিও ঘটতে পারে web application Client ID


আপনি কি বোঝাতে চেয়েছেন? আমি আরও লক্ষ্য করেছি যে ফ্রেমটি একটি সাফারি উইন্ডোতে কাজ করে তবে কোনও অ্যাপের ওয়েবভিউয়ের আইফ্রেমে নয়, তবে কীভাবে আপনি এটি পরিবর্তন করবেন?
নোব্যাগস

আমার সমস্যাটি অনুরূপ ছিল, ওয়েব অ্যাপ্লিকেশন ক্লায়েন্ট আইডি তৈরি করার সময় আমি আমার ওয়েবসাইটের
ইউরিসগুলিকে

2

আমার কৌণিক 9 এ একই সমস্যাটি বাস্তবায়িত হচ্ছে আমি এই দুটি পদক্ষেপটি করেছি:

  1. থেকে আপনার YouTube URL পরিবর্তন https://youtube.com/your_codeকরতে https://youtube.com/embed/your_code

  2. এবং তারপর DomSanitizerকৌণিকের মাধ্যমে 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>

1

পিতামাতার কথা উল্লেখ করে আমার জন্য কাজ করা একটি সমাধান রয়েছে। ইউআরএল পাওয়ার পরে যা গুগল প্রমাণীকরণ পৃষ্ঠায় পুনর্নির্দেশ করবে, আপনি নিম্নলিখিত কোডটি চেষ্টা করতে পারেন:

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

0

প্রশ্নের জন্য ধন্যবাদ। ইউটিউবের জন্য যদি ইফ্রেমে প্রথম ইস্যু হয় তবে আপনি যে 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" বিভক্ত হবে। আপনাকে ভিডিও আইডি পেতে হবে এমবেড হিসাবে ইউআরএল সেট করতে হবে। এইচটিএমএলে

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

কৌনিক 2/5 আবার ধন্যবাদ।


0

ইউআরএল প্রত্যয় সহ নীচে যুক্ত করুন

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

0

ইউটিউব চ্যাট এম্বেড করার অনুরূপ একটি সমস্যা ছিল এবং আমি এটি খুঁজে বের করি। অনুরূপ সমস্যার জন্য একই রকম সমাধান হতে পারে।

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 ব্যবহার করছেন না, তবে স্ক্রিপ্টটি কোথায় ব্যবহৃত হচ্ছে তা বলার জন্য আপনার সিনট্যাক্সে আপনাকে কিছু ভেরিয়েবল যুক্ত করতে হবে।


-1

বিভিন্ন ডোমেন সহ সাব সাইটগুলিতে লগআউট করতে 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);
});


-1

ইউটিউব / এম্বেড, দুটি স্বাদ:

https://www.youtube.com/e એમ્બેડ/ watch? v = eAxV4uO8oTU& list = RDeAxV4uO8oTU& start_radio =1 https://www.youtube.com/e એમ્બેડ/ CNG7yrHHJ5A

আপনার ব্রাউজারে পেস্ট করুন এবং দেখুন

মূল:

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

একটিতে "ওয়াচ? ভি =" রাখা দরকার, অন্যটি নয়

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.