এস 3 - অ্যাক্সেস-নিয়ন্ত্রণ-মঞ্জুরি-উত্স শিরোনাম


187

কেউ কি Access-Control-Allow-Originপ্রতিক্রিয়া শিরোনাম যোগ করতে পরিচালিত? আমার যা দরকার তা হ'ল এরকম কিছু:

<img src="http://360assets.s3.amazonaws.com/tours/8b16734d-336c-48c7-95c4-3a93fa023a57/1_AU_COM_180212_Areitbahn_Hahnkoplift_Bergstation.tiles/l2_f_0101.jpg" />

এই পেতে অনুরোধটিতে প্রতিক্রিয়া থাকা উচিত, শিরোনাম, Access-Control-Allow-Origin: *

বালতির জন্য আমার সিআরএস সেটিংস দেখতে এই রকম দেখাচ্ছে:

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <AllowedHeader>*</AllowedHeader>
    </CORSRule>
</CORSConfiguration>

যেমনটি আপনি আশা করতে পারেন কোনও Originপ্রতিক্রিয়া শিরোনাম নেই।



1
এটি থেকে একটি জিনিস অনুপস্থিত যা হ'ল: <এক্সপোজহাইডার> অ্যাক্সেস-কন্ট্রোল-অরিজিন অরিজিন </ এক্সপোজ হিডার>
দিমিত্রি

উত্তর:


197

সাধারণত, আপনাকে যা করতে হবে তা হ'ল আপনার বালতির বৈশিষ্ট্যগুলিতে "সিআরএস কনফিগারেশন যুক্ত করুন"।

আমাজন-স্ক্রীন-শট

<CORSConfiguration>কিছু ডিফল্ট মান দিয়ে আসে। আপনার সমস্যা সমাধানের জন্য আমার এটাই দরকার। শুধু "সংরক্ষণ করুন" ক্লিক করুন এবং এটি কাজ করে কিনা তা আবার চেষ্টা করুন। যদি এটি না হয় তবে আপনি নীচের কোডটিও ব্যবহার করতে পারেন (অ্যালেক্সারবি উত্তর থেকে) যা বেশিরভাগ লোকের জন্য কাজ করেছে বলে মনে হয়।

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <AllowedMethod>HEAD</AllowedMethod>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <AllowedHeader>Authorization</AllowedHeader>
    </CORSRule>
</CORSConfiguration> 

আরও তথ্যের জন্য, আপনি বালতি অনুমতি সম্পাদনা এই নিবন্ধটি পড়তে পারেন ।


4
এটা সম্ভব বলে মনে হচ্ছে। উপরের লিঙ্কটি পড়ার চেষ্টা করুন (উত্তরে) বা সরাসরি এটির
ফ্ল্যাভিও উয়েনশে

7
ধন্যবাদ. কেবলমাত্র এতে ক্লিক করে আমার ফন্টগুলি লোড হতে পারে allowed
তানিয়া রাসিয়া

2
আমি লক্ষ্য করি এটি কখনও কখনও এবং অন্যান্য সময়ে কাজ করে তবে আমি এটি সম্পাদনার পরেও ব্রাউজারের ত্রুটি পাই। এটির ক্লাউডফ্লেয়ার বা এস 3 কিনা তা নিশ্চিত নয়।
চিহ্নিত করুন

4
আপনি যোগ করার প্রয়োজন হতে পারে HEADজন্য AllowedMethodগুলি
jordanstephens

31
আমার জন্য কাজ করে না। এখনও হেড বা জিইটি অনুরোধের প্রতিক্রিয়ায় কোনও 'অ্যাক্সেস-কন্ট্রোল-অলজিন-অরিজিন' শিরোনাম নেই।
carpiediem

104

ওয়েব ফন্টগুলি লোড করার ক্ষেত্রে আমার একইরকম সমস্যা ছিল, আমি যখন বালতি বৈশিষ্ট্যে 'অ্যাড সিওআরএস কনফিগারেশন' এ ক্লিক করি তখন এই কোডটি ইতিমধ্যে ছিল:

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <AllowedMethod>HEAD</AllowedMethod>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <AllowedHeader>Authorization</AllowedHeader>
    </CORSRule>
</CORSConfiguration> 

আমি কেবল সংরক্ষণ ক্লিক করেছিলাম এবং এটি একটি ট্রিট কাজ করেছে, আমার কাস্টম ওয়েব ফন্টগুলি আইই এবং ফায়ারফক্সে লোড হচ্ছে। আমি এতে কোনও বিশেষজ্ঞ নই, আমি কেবল ভেবেছিলাম এটি আপনাকে সাহায্য করতে পারে।


12
ধন্যবাদ! এটা আমার জন্য এটি। আমি 'সিওআরএস কনফিগারেশন অ্যাড করুন' ক্লিক করার মতোই পেয়েছি, তবে বুঝতে পারি না যে আমাকে 'সেভ' ক্লিক করতে হবে কারণ আমি ভেবেছিলাম যে আমি ডিফল্ট কনফিগারেশনটি দেখছি। ডি ওহ।
জ্যাক কুশনম্যান

35
আমাকে <AllowedHeader>*</AllowedHeader>এটির কাজ করার জন্য সেট করতে হয়েছিল (এটি করার পরে কেবল আপনার সাইটের জন্য একটি নতুন নিয়ম তৈরি করা ভাল)
সংসদ

4
@ পার্লামেন্টে সেখানে জাদু ছিল, কারণ উপরের অন্যান্য সমস্ত সেটিংস <অ্যালাউডহাইডার> একটি ওয়াইল্ডকার্ডে না লাগানো পর্যন্ত কৌশলটি করেনি। Hurray থেকে।
নীল ম্যাজি

আমি CORS সেটিংসে গিয়েছিলাম এবং সেখানে একই সেটিংস পেয়েছি, তবে <সেভডআরগিন> * << অনুমোদিত অরগিন> আমি যখন সেভ টিপলাম তখন সক্রিয় হয়ে উঠলাম। এটা আগে নষ্ট।
ডিভিডিএমএন

1
এটি ছিল, সংরক্ষণ করুন
ল্যাপিনকোইরা

48

যদি আপনার অনুরোধটি Originশিরোনাম নির্দিষ্ট না করে , S3 প্রতিক্রিয়াতে CORS শিরোনামকে অন্তর্ভুক্ত করবে না। এটি সত্যই আমাকে ছুঁড়ে দিয়েছে কারণ আমি সিওআরএস পরীক্ষা করার জন্য ফাইলগুলি কার্ল করার চেষ্টা করেছিলাম তবে কার্ল এতে অন্তর্ভুক্ত নয় Origin


2
আমি 2, সপ্তাহের পরে ইন্টারনেটের উপর নজর রাখছিলাম সমস্ত নিবন্ধ এবং উত্তরগুলি S3 CORS কনফিগারেশনগুলি যেমন বলেছিল তেমন পরিবর্তন করার বিষয়ে কথা বলছিল তবে প্রতিক্রিয়াতে কোনও পরিবর্তন হয়নি, যতক্ষণ না আমি আপনার উত্তরটি আমার কাছে বোধগম্য করি, আমি এটি ব্যবহার করে পরীক্ষা করেছি পোস্টম্যান এবং তার কাজ! তাই আপনাকে অনেক ধন্যবাদ
আবদুল্লাহ আওয়াদ আলখওয়ালদহ 8:38

1
যে কেউ জানেন যে আমি কীভাবে একটি imgট্যাগের শিরোনাম পরিবর্তন করতে পারি ? আমি বিভিন্ন হেডার পাঠাতে পারবেন না, ব্রাউজার অনুরোধ পাঠায়
idan

1
ওএমজি এটি কোথাও নথিভুক্ত করা হয়?
ডারকোইচ

2
এটি :) ডকস.আও.এসএজ়োন.আমজোনএস 3 / ফলসট / দেব />> যাচাই করুন যে অনুরোধটির অরিজিনাল শিরোনাম রয়েছে f এবং প্রতিক্রিয়াতে CORS প্রতিক্রিয়া শিরোনাম প্রেরণ করে না।
ডারকোইচ

46

@ জর্ডানস্টেফেনস একটি মন্তব্যে এটি বলেছেন, তবে এটি একরকম হারিয়ে যায় এবং এটি আমার পক্ষে সত্যই সহজ সমাধান।

আমি কেবল HEAD পদ্ধতি যুক্ত করেছি এবং সেভ ক্লিক করেছি এবং এটি কাজ শুরু করে।

<CORSConfiguration>
	<CORSRule>
		<AllowedOrigin>*</AllowedOrigin>
		<AllowedMethod>GET</AllowedMethod>
		<AllowedMethod>HEAD</AllowedMethod> <!-- Add this -->
		<MaxAgeSeconds>3000</MaxAgeSeconds>
		<AllowedHeader>Authorization</AllowedHeader>
	</CORSRule>
</CORSConfiguration>


3
এটি 17 জানুয়ারী 2018 পর্যন্ত কাজ করে, গৃহীত উত্তরটি হ'ল অপমান। lol
lasec0203

4
হাঁ। অ্যাডাব্লুএস এস 3 এর ফন্টের মতো জিনিসগুলি যখন জিইটি-ইন করা হয় তখন এটি Chrome এ "না 'অ্যাক্সেস-কন্ট্রোল-অলজিন-অরিজিন' শিরোনাম" ত্রুটিটিকে ঠিক করে।
নস্টালজি.ও

1
হ্যাঁ! তোমাকে অনেক ধন্যবাদ. অনুমতি HEADপদ্ধতি কৌশলটি করেছে।
জ্যাক

37

এই কাজটি করার এটি একটি সহজ উপায়।

আমি জানি এটি একটি পুরানো প্রশ্ন, তবে এর সমাধান খুঁজে পাওয়া এখনও শক্ত।

শুরু করার জন্য, এটি আমার জন্য রেলস 4, পেপারক্লিপ 4, ক্যাম্যানজেএস, হেরোকু এবং এডাব্লু এস এস 3 দিয়ে নির্মিত একটি প্রকল্পে কাজ করেছে।


আপনাকে crossorigin: "anonymous"প্যারামিটার ব্যবহার করে আপনার চিত্রটির জন্য অনুরোধ করতে হবে ।

    <img href="your-remote-image.jpg" crossorigin="anonymous"> 

আপনার সাইটের ইউআরএলকে অ্যাডাব্লুএস এস 3-তে CORS এ যুক্ত করুন। এটি সম্পর্কে অ্যামাজনের একটি রেফারেন্স এখানে দেওয়া হয়েছে । খুব সুন্দর, কেবল আপনার বালতিতে যান, এবং তারপরে ডানদিকের ট্যাবগুলি থেকে " বৈশিষ্ট্যগুলি " নির্বাচন করুন, " অনুমতি ট্যাবটি খুলুন এবং তারপরে," সম্পাদনা কর্স কনফিগারেশন "এ ক্লিক করুন ।

মূলত, আমি < AllowedOrigin>সেট করেছিলাম *। কেবল সেই URLটিকে আপনার ইউআরএলে পরিবর্তন করুন, বিকল্পগুলি পছন্দ করার মতো http://এবং https://পৃথক লাইনে অন্তর্ভুক্ত করতে ভুলবেন না । আমি প্রত্যাশা করছিলাম যে তারাটি "সমস্ত" গ্রহণ করে, তবে দৃশ্যত আমাদের তুলনায় আরও নির্দিষ্ট হতে হবে।

এটি আমার জন্য এইভাবে দেখায়।

এখানে চিত্র বর্ণনা লিখুন


1
গৃহীত উত্তরের মতো নয়, এটি আসলে কাজ করে! এমনকি এই এস 3 টি লোড করা ক্লডফ্রন্ট সিডিএন এই শিরোনামগুলির প্রতিরূপ তৈরি করছে। আপনাকে ধন্যবাদ কয়েক ঘন্টা কয়েক ঘন্টা বাঁচিয়েছি!
সমমান 8

5
আপনি যদি ক্লাউডফ্রন্ট ব্যবহার করছেন তবে আপনি এটিও দেখতে চাইতে পারেন - blog.celingest.com/en/2014/10/02/…
কুণাল

1
@ কুণালের লিঙ্কটি ধন্যবাদ। ক্লাউডফ্রন্ট এই সমীকরণে জটিলতার একটি স্তর যুক্ত করে।
টাইলার কলিয়ার

1
আমি এমডিএন ডকস যতদূর <img>পেরেছি, তবে আমি কেবল crossOrigin="true"ভুল করেই রেখেছি । ধন্যবাদ!
Cezille07

বাহ এটা সত্যিই আমার জন্য কৌতুক করেছিল! আমি লোকালহোস্টে এটি ব্যবহার করতে সক্ষম এবং আমি এমনকি তারকাচিহ্নটিও ব্যবহার করতে পারি, মূলটি ছিল আমার এইচটিএমএল উপাদানটিতে ক্রসরিগিন = "বেনামে" যুক্ত করা: ডি
আলেকজান্ডার

23

উপরের উত্তর দেখুন। (তবে আমারও ক্রোম বাগ ছিল)

CHROME এ পৃষ্ঠায় চিত্রটি লোড এবং প্রদর্শন করবেন না। (যদি আপনি পরে একটি নতুন উদাহরণ তৈরি করতে যাচ্ছেন)

আমার ক্ষেত্রে, আমি চিত্রগুলি লোড করেছি এবং সেগুলি পৃষ্ঠায় প্রদর্শন করেছি। যখন সেগুলি ক্লিক করা হয়েছিল, আমি তাদের একটি নতুন উদাহরণ তৈরি করেছি:

// there is already an html <img /> on the page, I'm creating a new one now
img = $('<img crossorigin />')[0]
img.onload = function(){
  context.drawImage(img, 0, 0)
  context.getImageData(0,0,w,h)
}
img.src = 'http://s3.amazonaws.com/my/image.png'; // I added arbitrary ?crossorigin to change the URL of this to fix it

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

ঠিক করার জন্য, আমি ?crossoriginইমেজ ইউআরএলটির শেষে যুক্ত করেছি (তবে আপনি যুক্ত করতে পারেন ?blah, এটি কেবল ক্যাশের স্থিতি পরিবর্তন করতে স্বেচ্ছাচারী) যখন আমি এটি ক্যানভাসের জন্য লোড করেছি .. আপনি যদি ক্রোমের জন্য আরও ভাল সমাধান খুঁজে পান তবে আমাকে জানান


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

এছাড়াও Chrome এ ক্যাশে সমস্যা ছিল। সহজ ফিক্স: সরঞ্জাম / সেটিংস> ব্রাউজিং ডেটা সাফ করুন ...> ক্যাশেড ছবি এবং ফাইল যদিও এই সমস্যার মুখোমুখি হতে পারে এমন ব্যবহারকারীদের জন্য আরেকটি সমাধানের প্রয়োজন হতে পারে।
স্টিভিপ

1
এই উত্তরের জন্য ধন্যবাদ! ক্রোমের সাথে আমারও একই সমস্যা ছিল এবং আমি উত্তর পাই না।
ওয়ানড্রিল

1
CORS এ সমস্যা থাকলে সমস্ত লোককে এটি চেষ্টা করা দরকার !! আমার দিন বাঁচাও!
সাঙ্গার 82২

23

আমি কেবল এই উত্তরটিতে যুক্ত করব - উপরে – যা আমার সমস্যাটি সমাধান করেছে।

সিওআরএস অরিজিন শিরোনামটি উত্তোলনের জন্য এডাব্লুএস / ক্লাউডফ্রন্ট ডিস্ট্রিবিউশন পয়েন্ট সেট করতে, বিতরণ পয়েন্টের সম্পাদনা ইন্টারফেসে ক্লিক করুন:

এখানে চিত্র বর্ণনা লিখুন

আচরণ ট্যাবে যান এবং আচরণ সম্পাদনা করুন, "নির্বাচিত অনুরোধ শিরোনামের ভিত্তিতে ক্যাশে" পরিবর্তন থেকে কোনওটি Originশ্বেত তালিকাতে নেই, তারপরে শ্বেত তালিকাভুক্ত বাক্সে যুক্ত করা হয়েছে তা নিশ্চিত করুন । AWS ডক্সে CORS সেটিংসকে সম্মান জানাতে ক্লাউডফ্রন্টটি কনফিগার করা দেখুন Config

এখানে চিত্র বর্ণনা লিখুন


HTTP পদ্ধতিগুলি আপনাকে কীভাবে সেট করতে হবে?
শিক্ষার্থী

আপনার মানে জিইটি, পোস্ট, মোছা, ইত্যাদি ...? তাদের কোথায় অনুরোধ করা হচ্ছে?
মাইকিএলএল

আপনি কি আপনার প্রশ্নের পুনঃব্যবহার করতে পারেন দয়া করে যাতে আপনি সিএফ ওয়েব ফর্মটি উল্লেখ করছেন কিনা, বা এস -3 সংস্থানটির জন্য অনুরোধ করা অ্যাপ্লিকেশনটি আমি বুঝতে পারি? সাবেক, তাহলে একটি HTTP পদ্ধতি বিকল্পটি ডক্স এখানে উল্লেখ করা হয় docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/...
শিক্ষার্থী

দেখে মনে হচ্ছে আপনি এডাব্লুএসের মধ্যে কী HTTP Request Methodsসেট করতে হবে তা জিজ্ঞাসা করছেন । এবং এই প্রশ্নটির জন্য, আমি দেখতে পাচ্ছি না যে কোনওটি কোথাও সেট করা দরকার। আপনি যদি অ্যাপ্লিকেশনটির মধ্যে সংস্থানটির অনুরোধের বিষয়ে কথা বলছেন তবে আমি বিশ্বাস করি আপনি কেবল এটির মাধ্যমে ফাইলটির জন্য অনুরোধ করবেন url string: যেমন একটি চিত্র, ভিডিও, অডিও ফাইল।
মাইকিএলএল

সেটাই ছিল নিখোঁজ টুকরো! ধন্যবাদ! আমি এর উপরে সমস্ত উত্তর চেষ্টা করেছিলাম এবং কেবলমাত্র এই শিরোনামগুলি শ্বেত
ওমর লেশেম

11

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

আমার জন্য এটি কী স্থির করেছিল তা AllowedHeaderডিফল্ট Authorizationথেকে *সিওআরএস কনফিগারেশনে পরিবর্তিত হয়েছিল :

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>

3
<AllowedHeader>*</AllowedHeader>অক্টোবর 2017 এ ক্রোমের একটি নক্ষত্রের সাথে ঠিক এটির মতো সেট করা দরকার you আপনাকে অনেক ধন্যবাদ! (এছাড়াও, সেটিংস করার পরে ব্রাউজার ক্যাশে সাফ করতে ভুলবেন না)।
নস্টালজি.ইও

ছোট বিন্দু - আমি মনে করি না যে আপনি এটি পরিবর্তন করতে হবে AllowedHeader। আমারও এখানে একই সমস্যা ছিল, তবে দেখা যাচ্ছে এটি পূর্ববর্তী প্রতিক্রিয়াটিকে ( MaxAgeSeconds) সাড়া দিচ্ছে ব্রাউজারটি । ডেভটুলস সেটিংসে, কনসোল খোলা থাকার সময় আপনি ক্যাশে উপেক্ষা করতে পারবেন। একবার এটি হয়ে গেলে, এটি আমার জন্য কাজ শুরু করে
সাফল্য

মঞ্জুরিপ্রাপ্ত হায়দার> * <অবশ্যই আমার জন্য এই সমস্যাটি স্থির করেছেন। এটি কেবল তখনই প্রয়োগ হতে পারে যখন অনুরোধটি কোনও নির্দিষ্ট এক্সএইচআর লাইব্রেরির মাধ্যমে প্রেরণ করা হয়? আমি অক্ষ ব্যবহার করছি এবং এটি প্রয়োজনীয় খুঁজে পেয়েছি found
জেরেমি

6

অন্যের মতো স্টেট রয়েছে, আপনার প্রথমে আপনার এস 3 বালতিতে সিওআরএস কনফিগারেশন থাকা দরকার:

<CORSConfiguration>
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>HEAD</AllowedMethod> <!-- Add this -->
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <AllowedHeader>Authorization</AllowedHeader>
</CORSRule>
</CORSConfiguration>

তবে তা করার পরে আমার ক্ষেত্রে এটি এখনও কাজ করছে না। আমি ক্রোম ব্যবহার করছিলাম (অন্যান্য ব্রাউজারগুলির ক্ষেত্রে সম্ভবত একই সমস্যা)।

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

ক্রোম ক্যাশে সাফ করার পরে এবং পৃষ্ঠাটি পুনরায় লোড করার পরে , চিত্রটির প্রত্যাশিত সিওআরএস শিরোনাম ছিল


1
ধন্যবাদ! এই ক্যাচিংয়ের বিষয়টি আমাকে উন্মাদ করে দিয়েছে। ক্রোমে সহজেই ক্যাশেটি কীভাবে পরিষ্কার করা যায় সে সম্পর্কে ভাবছেন (version৩ সংস্করণ), পুনরায় লোড বোতামটি টিপুন এবং 'খালি ক্যাশে এবং হার্ড পুনরায় লোড' চয়ন করুন। তারপরে <5 সেকেন্ডের মধ্যে আপনি নিজের এস 3 কর্সে যে কোনও পরিবর্তন করেছেন তার প্রভাব আপনি দেখতে পাবেন। (হয়তো আরো দ্রুত - যে শুধু কতদিন এটা আমাকে ব্রাউজার ট্যাব স্যুইচ করতে সময় লাগে।)
thund

1
এই আমার সমস্যা ছিল। আমার বালতিটির উপযুক্ত সিওআরএস কনফিগারেশন ছিল, আমার ব্রাউজারটি কেবল দুর্দান্তভাবে দক্ষ হয়ে উঠছিল - আপনাকে ধন্যবাদ।
ড্যানিয়েল ব্র্যাডি

5

আমি এই থ্রেডে পৌঁছেছি এবং উপরোক্ত সমাধানগুলির কোনওোটাই আমার ক্ষেত্রে প্রয়োগ করতে পারেনি। দেখা যাচ্ছে, আমাকে<AllowedOrigin> আমার বালতির সিওআরএস কনফিগারেশনে ইউআরএল থেকে কেবল একটি অনুসরণীয় স্ল্যাশ সরিয়ে ফেলতে হয়েছিল।

ব্যর্থ হলে:

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
        <AllowedOrigin>http://www.mywebsite.com/</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <AllowedHeader>*</AllowedHeader>
    </CORSRule>
</CORSConfiguration>

জেতা:

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
        <AllowedOrigin>http://www.mywebsite.com</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <AllowedHeader>*</AllowedHeader>
    </CORSRule>
</CORSConfiguration>

আমি আশা করি এটি কারও চুল টানতে বাঁচায়।


4

আমি উপরের সমস্ত উত্তর চেষ্টা করেছিলাম এবং কিছুই কার্যকর হয়নি। প্রকৃতপক্ষে, এটিকে কাজ করতে আমাদের উপরের উত্তরগুলি থেকে তিনটি পদক্ষেপের প্রয়োজন:

  1. যেমন ফ্ল্যাভিও পরামর্শ দিয়েছেন; আপনার বালতিতে সিওআরএস কনফিগারেশন যুক্ত করুন:

    <CORSConfiguration>
       <CORSRule>
         <AllowedOrigin>*</AllowedOrigin>
         <AllowedMethod>GET</AllowedMethod>
       </CORSRule>
     </CORSConfiguration>
    
  2. ছবিতে; ক্রসরিগিন উল্লেখ করুন:

    <img href="abc.jpg" crossorigin="anonymous">
    
  3. আপনি কি সিডিএন ব্যবহার করছেন? যদি সবকিছু অরিজিনাল সার্ভারের সাথে সংযোগ স্থাপনের কাজ করে তবে সিডিএন এর মাধ্যমে না; এর অর্থ আপনার সিডিএন-তে কিছু সেটিং দরকার যেমন CORS শিরোনাম গ্রহণ করুন accept আপনি কোন সিডিএন ব্যবহার করছেন তার উপর নির্ভুল সেটিং নির্ভর করে।


ধন্যবাদ সিডিএন অংশটি অত্যন্ত গুরুত্বপূর্ণ, আপনি কী সিডিএন পর্যায়ে প্রয়োজন তার বিবরণ যুক্ত করতে পারবেন?
svelandiag

3
  1. আপনার এস 3 বালতির জন্য অনুমতি সেটিংসে সিওআরএস কনফিগারেশন সেট করুন

    <?xml version="1.0" encoding="UTF-8"?>
    <CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
        <CORSRule>
            <AllowedOrigin>*</AllowedOrigin>
            <AllowedMethod>GET</AllowedMethod>
            <MaxAgeSeconds>3000</MaxAgeSeconds>
            <AllowedHeader>Authorization</AllowedHeader>
        </CORSRule>
    </CORSConfiguration> 
    
  2. এস3 কেবলমাত্র সিআরএস শিরোনাম যুক্ত করে যখন HTTP অনুরোধের Originশিরোনাম থাকে।

  3. ক্লাউডফ্রন্ট ডিফল্টরূপে শিরোনাম ফরোয়ার্ড করে নাOrigin

    Originআপনার ক্লাউডফ্রন্ট বিতরণের জন্য আচরণের সেটিংসে আপনাকে শিরোনামটি সাদা করতে হবে ।


2

আমি নিম্নলিখিতটি লিখে এটি স্থির করেছি:

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>

<AllowedHeader>*</AllowedHeader>কাজ করছে <AllowedHeader>Authorization</AllowedHeader>না কেন ?


1

fwuensche "উত্তর" একটি সিডিএন স্থাপনের জন্য ক্যারেট; এটি করে আমি ম্যাক্সএজ সেকেন্ডগুলি সরিয়েছি।

<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedHeader>Authorization</AllowedHeader>
</CORSRule>

1

সর্বশেষতম এস 3 ম্যানেজমেন্ট কনসোলে, আপনি যখন অনুমতি ট্যাবে সিওআরএস কনফিগারেশনটিতে ক্লিক করবেন, এটি একটি ডিফল্ট নমুনা সিওআরএস কনফিগারেশন প্রদর্শন করবে। এই কনফিগারেশন না আসলে সক্রিয় ! CORS সক্রিয় করতে আপনাকে প্রথমে সেভ ক্লিক করতে হবে।

এটি বের করতে আমার অনেক বেশি সময় লেগেছে, আশা করি এটি কারও কিছু সময় সাশ্রয় করবে।


1

এই কনফিগারেশনটি আমার জন্য সমস্যাটি সমাধান করেছে:

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>PUT</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
    <AllowedMethod>DELETE</AllowedMethod>
    <AllowedMethod>HEAD</AllowedMethod>
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <ExposeHeader>ETag</ExposeHeader>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>

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

1

সতর্কতা - হ্যাক

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

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

S3Image.prototype.imageEl = function (src, theme) {
    if (!src) {
        return null;
    }
    var selected = this.props.selected;
    var containerStyle = { position: 'relative' };
    return (React.createElement("div", { style: containerStyle, onClick: this.handleClick },
        React.createElement("img", { crossOrigin: 'use-credentials', style: theme.photoImg, src: src, onLoad: this.handleOnLoad, onError: this.handleOnError}),
        React.createElement("div", { style: selected ? theme.overlaySelected : theme.overlay })));
};

403 ইস্যু এখন সমাধান করা হয়েছে। কি ব্যথা আগ্রাসক!


1
<AllowedOrigin>*</AllowedOrigin>

এটি একটি ভাল ধারণা নয় কারণ * দিয়ে আপনি আপনার বালতিতে থাকা ফাইলগুলিতে কোনও ওয়েবসাইট অ্যাক্সেস মঞ্জুর করেন। পরিবর্তে, আপনার বালতি থেকে উত্সগুলি ব্যবহার করার জন্য কোন উত্সটি হুবহু অনুমোদিত তা নির্দিষ্ট করা উচিত। সাধারণত, এটি আপনার ডোমেন নামটির মতো

<AllowedOrigin>https://www.example.com</AllowedOrigin>

অথবা আপনি যদি সমস্ত সম্ভাব্য সাবডোমেনগুলি অন্তর্ভুক্ত করতে চান:

<AllowedOrigin>*.example.com</AllowedOrigin>

1

নীচে কনফিগারেশন রয়েছে এবং এটি আমার পক্ষে কাজ করা ভাল। আমি আশা করি এটি AWS S3- এ আপনার সমস্যা সমাধানে সহায়তা করবে to

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>PUT</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
    <AllowedMethod>DELETE</AllowedMethod>
    <ExposeHeader>ETag</ExposeHeader>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>

এটি আমার শুরু করার জন্য কাজ করেছিল, তারপরে আমি প্রয়োজনীয় পদ্ধতিগুলির প্রয়োজন না সরিয়ে সুরক্ষা জোরদার করেছি এবং এটি কেবল যে শিরোনামগুলি চেয়েছিলাম তা উল্লেখ করে
হিটউইল

0

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


0

যদি আপনার সিওআরএস সেটিংস আপনাকে সহায়তা না করে।

কনফিগারেশন S3 সঠিক কিনা তা যাচাই করুন । আমার একটি অবৈধ বালতির নাম ছিল Storage.configure। আমি বালতির একটি সংক্ষিপ্ত নাম ব্যবহার করেছি এবং এটি একটি ত্রুটি ঘটায়:

অনুরোধকৃত উত্সটিতে কোনও 'অ্যাক্সেস-কন্ট্রোল-অলজন-অরিজিন' শিরোনাম উপস্থিত নেই।


0

প্রথমে আপনার এস 3 বালতিতে CORS সক্রিয় করুন। দিকনির্দেশনা হিসাবে এই কোডটি ব্যবহার করুন:

<CORSConfiguration>
 <CORSRule>
   <AllowedOrigin>http://www.example1.com</AllowedOrigin>

   <AllowedMethod>PUT</AllowedMethod>
   <AllowedMethod>POST</AllowedMethod>
   <AllowedMethod>DELETE</AllowedMethod>

   <AllowedHeader>*</AllowedHeader>
 </CORSRule>
 <CORSRule>
   <AllowedOrigin>http://www.example2.com</AllowedOrigin>

   <AllowedMethod>PUT</AllowedMethod>
   <AllowedMethod>POST</AllowedMethod>
   <AllowedMethod>DELETE</AllowedMethod>

   <AllowedHeader>*</AllowedHeader>
 </CORSRule>
 <CORSRule>
   <AllowedOrigin>*</AllowedOrigin>
   <AllowedMethod>GET</AllowedMethod>
 </CORSRule>
</CORSConfiguration>

2) যদি এটি এখনও কাজ না করে, আপনার ইমগ ট্যাগগুলিতে "*" মান সহ একটি "ক্রসরিগিন" যুক্ত করার বিষয়টি নিশ্চিত করুন। এটি আপনার এইচটিএমএল ফাইলে রাখুন:

  let imagenes = document.getElementsByTagName("img");
    for (let i = 0; i < imagenes.length; i++) {
      imagenes[i].setAttribute("crossorigin", "*");

-1

এটি মূল্যবান কিসের জন্য, আমার একটি অনুরূপ সমস্যা হয়েছিল - যখন নির্দিষ্ট অনুমোদিত উত্স যুক্ত করার চেষ্টা করা হয় (হয় না) * )।

দেখা যাচ্ছে আমাকে সংশোধন করতে হয়েছিল

<AllowedOrigin>http://mydomain:3000/</AllowedOrigin>

প্রতি

<AllowedOrigin>http://mydomain:3000</AllowedOrigin>

(ইউআরএল মধ্যে শেষ স্লাহ নোট করুন)

আশা করি এটি কাউকে সাহায্য করবে

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