এইচটিটিপিএস পৃষ্ঠায় HTTP AJAX অপারেশন চালানোর সময় "মিশ্রিত সামগ্রী অবরুদ্ধ করা হয়েছে"


108

আমি একটি ফর্ম যা আমি জমা করছি (জিইটি এর মাধ্যমে এটি যেমন প্রয়োজন তেমন) কোনও সিআরএম (ভিসিডিয়াল) এ জমা দিচ্ছি। আমি যদি সফলভাবে ফর্মটি জমা দিতে পারি তবে যদি আমি এটি করি যে সিআরএম-তে প্রসেসিং ফাইলটি কেবল একটি সাফল্যের পাঠ্য প্রতিধ্বনিত করবে এবং এটিই।

এই পাঠ্যের পরিবর্তে, আমি আমার ওয়েবসাইটে একটি ধন্যবাদ পৃষ্ঠা প্রদর্শন করতে চাই, তাই আমি ফর্মটি জমা দিতে এবং আমার প্রয়োজনীয় পৃষ্ঠায় এটি পুনঃনির্দেশ করতে AJAX ব্যবহার করার সিদ্ধান্ত নিয়েছি, তবে আমি আমার ব্রাউজারে এই ত্রুটিটি পাচ্ছি:

মিশ্র সামগ্রী: ' https://page.com ' এ পৃষ্ঠাটি এইচটিটিপিএস-এর মাধ্যমে লোড করা হয়েছিল, তবে একটি অনিরাপদ এক্সএমএলএইচটিপিআরকোয়েস্ট শেষ পয়েন্ট ' http://XX.XXX.XX.XXX/vicidial/non_agent_api.php?queries=query=data '। এই অনুরোধটি অবরুদ্ধ করা হয়েছে; লিখিত সামগ্রীটি অবশ্যই HTTPS এর মাধ্যমে পরিবেশন করা উচিত।

এটি আমার এজেএক্স স্ক্রিপ্ট:

    <script>
    SubmitFormClickToCall = function(){

        jQuery.ajax({
            url: "http://XX.XXX.XX.XX/vicidial/non_agent_api.php",
            data : jQuery("#form-click-to-call").serialize(),
            type : "GET",
            processData: false,
            contentType: false,
            success: function(data){
                window.location.href = "https://www.example.com/thank-you";
            }
        });
    }
    </script>

কেবলমাত্র ইউআরএল এ https সেট করা কাজ করবে না, এমন কোনও উপায় আছে যার মাধ্যমে আমি জিইটি এর মাধ্যমে ডেটা জমা দিতে এবং ব্যবহারকারীকে আমার থ্যাঙ্কিউ পৃষ্ঠায় রিডাইরেক্ট করতে পারি?

============================

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

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

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


আপনার এপিআই-এর কোনও সুরক্ষিত সংস্করণ রয়েছে? আপনি যদি সুরক্ষিত সাইটটিকে উত্স হিসাবে ব্যবহার করে থাকেন তবে আপনাকে এইচটিটিপিএসের মাধ্যমে অনুরোধ করতে হবে।
ক্যামেরন টিঙ্কার

1
না আমি করি না, অন্য কোনও উপায় আছে যেখানে আমি এটি করতে পারি? আমার অর্থ অনুরোধটি কেবলমাত্র যদি কোন ফর্মটি অ্যাজাক্স
স্ট্ররমরেজ

আপনি অ্যাপাচিতে XX.XXX.XX.XXএইচটিটিপি-র উপরে প্রক্সি করার জন্য একটি HTTPS URL তৈরি করতে পারেন । তবে, HTTP- র উদ্দেশ্য যদি ব্যবহারকারীর তথ্য রক্ষা করা হয় তবে আপনাকে সতর্কতা অবলম্বন করতে হবে যে সার্ভারগুলির মধ্যে রুটটি পাবলিক ইন্টারনেটের উপরে না চলে।
অর্ধ

উত্তর:


89

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

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


1
ঠিক আছে, এপিআই আমার সার্ভারে আছে, আমি কি https তৈরি করতে কোন গাইড অনুসরণ করতে পারি?
স্টর্মরেজ

1
নিবন্ধন করুন আপনি কোন ধরণের সার্ভার চালাচ্ছেন? এ্যাপাচি? এটি কি হোস্টিং বা কোনও ব্যক্তিগত সার্ভার ভাগ করা আছে?
মাইকেল বিটসন

@ স্টটারমরেজ দয়া করে আপনার আরও কোনও সহায়তার দরকার হলে আমাকে জানান know অন্যথায়, ভোটদান আপনাকে এখানে এসওতে পাবলিক সহায়তার জন্য উত্সাহিত করবে।
মাইকেল বিটসন

1
এটির জন্য দেরী হওয়ার জন্য দুঃখিত, আমি এজেএক্স ব্যবহার না করেই এটি সমাধান করতে পেরেছি, আমার সমাধানগুলিতে কিছু ওয়ার্ডপ্রেস ফাংশন / পিএইচপি কার্ল অন্তর্ভুক্ত রয়েছে, আমার সমাধানটি যত তাড়াতাড়ি সম্ভব পোস্ট করা উচিত, আমি কি আমার প্রশ্নটি সম্পাদনা করে তাতে আমার সমাধানটি লিখতে পারি, বা "আমি আপনার নিজের প্রশ্নের উত্তর দিন" বলছে এমন বোতামটি ব্যবহার করা উচিত?
স্টর্মরেজ

1
উত্তরের প্রাসঙ্গিক অংশটি এখানে হাইলাইট করেছেন। এর একমাত্র ব্যবহারিক সমাধান হ'ল এইচটিটিপিএস
লিয়াম

129

আমি এইচটিএমএল পৃষ্ঠায় নিম্নলিখিত কোড যুক্ত করে এটি সমাধান করেছি, যেহেতু আমরা তৃতীয় পক্ষের এপিআই ব্যবহার করছি যা আমাদের দ্বারা নিয়ন্ত্রিত নয়।

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"> 

আশা করি এটি সহায়তা করবে এবং একটি রেকর্ডের জন্যও।


8
এটি httpব্যবহারের জন্য সমস্ত অনুরোধ আপগ্রেড করে https, তাই আপনাকে প্রতিটি কলের জন্য প্রোটোকল পরিবর্তন করার দরকার নেই।
14

3
এটি আমার পক্ষে কাজ করেছে, তবে দুর্ভাগ্যক্রমে এটি ইন্টারনেট এক্সপ্লোরারের সাথে কাজ করে না: বিকাশকারী.মোজিলা.আর.ইন-
সায়ানান গ্যালাগার

2
আমি এটি চেষ্টা করেছি তবে এখন আমি ফায়ারফক্স এবং নেট এ ক্রোসে ত্রুটি পেয়ে যাচ্ছি: ক্রোমে নেট: ERR_SSL_PROTOCOL_ERROR আমি জানি সমস্ত কল কাজ করে কারণ আমার ওয়েবপৃষ্ঠাটি আগে এইচটিপি ছিল তবে এখন আমি এইচপি https তে পরিবর্তন করেছি এই কলগুলি কাজ করছে না। আমি কি আমার প্রধান এইচটিএমএল ফাইলটিতে যুক্ত করতে পারি? কারণ আমি যদি @ জুয়ানমা মেনেনডিজ অনুসরণ করি তবে সমস্ত কল কাজ করে তবে আমি প্রতিটি ব্যবহারকারী এটি করার আশা করতে পারি না।
ওটোরিনোলারোলজিস্ট -মান

আপনার উত্তর না পাওয়া পর্যন্ত আমি কয়েক ঘন্টা ধরে এই সমস্যাটির সাথে লড়াই করে যাচ্ছি, ধন্যবাদ অনেক!
মুহাব

আমরা নিশ্চিত করি যে এই সমাধানটি আমাদের ক্ষেত্রে কাজ করে, ভবিষ্যতেও সম্ভবত আপনাকে খুব সহায়তা করবে: আমরা একটি ডিগমেন্টেড এইচটিটিপি লাইভ স্ট্রিমিং / ভিডিওটি ডিমান্ড ফিচারে স্থাপন করার চেষ্টা করেছি, এরকম কিছু www.example.com/blabla/master.m3u8। এটি সব HTTP এ দুর্দান্ত কাজ করেছে। তবে যখন আমরা এটিকে https এ স্থানান্তরিত করব তখন এটি কার্যকর হবে না। আমরা জানতে পেরেছি যে প্রাথমিকটি অনুরোধ master.m3u8করতে সক্ষম হয়েছিল https, তবে নিম্নলিখিত বিভাগের বিভাজনগুলি সর্বদা ব্যবহার করে http(কারণ আমরা তৃতীয় পক্ষের মডিউলটি ব্যবহার করছি)। আমরা এটিকে যা টুইট করি তা কেবল ব্যবহার করবে না https। এই নীতিটি ব্যবহার করেছে এবং একটি কবজির মতো তাত্ক্ষণিকভাবে কাজ করেছে!
rahmatns

34

আপনি যদি বিশ্বাস করেন এমন কোনও ওয়েবপৃষ্ঠাটি ঘুরে দেখছেন এবং আপনি দ্রুত এগিয়ে যেতে চান, ঠিক:

1- অ্যাড্রেস বারের একেবারে ডানদিকে শিল্ড আইকনটি ক্লিক করুন।

গুগল ক্রোমে মিশ্রিত সামগ্রীর অনুমতি দিন

2- পপ-আপ উইন্ডোতে, "যাইহোক লোড করুন" বা "নিরাপদ স্ক্রিপ্ট লোড করুন" (আপনার ক্রোম সংস্করণের উপর নির্ভর করে) ক্লিক করুন।


আপনি যদি সর্বদা আপনার ক্রোম ব্রাউজারটি সেট করতে চান তবে (সমস্ত ওয়েবপৃষ্ঠায়) মিশ্র সামগ্রীর অনুমতি দিন:

1- একটি উন্মুক্ত ক্রোম ব্রাউজারে, ক্রোম বন্ধ করার জন্য আপনার কীবোর্ডে Ctrl + Shift + Q টিপুন। পরবর্তী পদক্ষেপগুলির পূর্বে অবশ্যই ক্রোম পুরোপুরি বন্ধ করা উচিত।

2- গুগল ক্রোম ডেস্কটপ আইকনটিতে ডান ক্লিক করুন (বা মেনু লিঙ্ক শুরু করুন)। বৈশিষ্ট্য নির্বাচন করুন।

3- লক্ষ্য ক্ষেত্রের বিদ্যমান তথ্যের শেষে যুক্ত করুন: "- নায়েলে-চলমান-সুরক্ষিত-সামগ্রী" (প্রথম ড্যাশের আগে একটি জায়গা রয়েছে space)

4- ওকে ক্লিক করুন।

5- ক্রোম খুলুন এবং এর আগে অবরুদ্ধ করা সামগ্রীটি চালু করার চেষ্টা করুন। এটি এখন কাজ করা উচিত।


4
এটি সেই ব্যবহারকারীদের জন্য ওয়েবসাইট ডিজাইনকারীদের জন্য কিছুই করে না যারা তাদের ব্রাউজারে সাইটটিকে কাজ করতে তাদের সেটিংস পরিবর্তন করতে চান না, উদাহরণস্বরূপ, ওপি।
স্মার্টপ্যান্টস

12

এই ত্রুটির কারণ খুব সহজ। আপনার সার্ভারটি এইচটিটিপিএসের সাথে চলমান থাকাকালীন আপনার এজেএক্স এইচটিটিপিকে কল করার চেষ্টা করছে, সুতরাং আপনার সার্ভারটি আপনার এজেএক্স কল করতে অস্বীকার করছে। আপনার মূল এইচটিএমএল ফাইলের হেড ট্যাগের ভিতরে নিম্নলিখিত লাইনটি যুক্ত করে এটি ঠিক করা যেতে পারে:

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"> 

এটি এটির অনুমতি দেয় তবে অনুরোধটি https
বিজি ব্রুনো

আমার ক্ষেত্রে. সার্ভার শুধুমাত্র HTTP অনুরোধ। আমি চেষ্টা করছি এটি <মেটায়> কাজ করতে পারে না। ব্রাউজারটি ইউআরএলে অনুরোধের ত্রুটি বলে।
iHad 169

1

যদি আপনার এপিআই কোডটি কোনও নোড.জেএস সার্ভারে চলমান থাকে তবে অ্যাপাচি বা এনজিআইএনএক্সে নয়, আপনাকে সেখানে মনোযোগ নিবদ্ধ করতে হবে। মাইকেল ঠিক বলেছেন, এইচআইপিটিএস-তে ইউআরএল ইউআরএল পরিবর্তন করা উত্তর তবে আপনার এপিআই যদি কোনও নোড.জেএস সার্ভার কল করে থাকে তবে এটি আরও ভাল এইচটিটিপিএস-এর জন্য সেটআপ করা উচিত! এবং অবশ্যই, নোড.জেএস সার্ভারটি কোনও অব্যবহৃত পোর্টে থাকতে পারে, এটি 443 পোর্ট হতে হবে না।


এপিআই তৃতীয় পক্ষ ছিল, সুতরাং আমি এটিকে https এ সেট করার কোনও উপায় ছিল না, এবং আপনি যে ইউআরএলটিতে আঘাত করতে চাইছেন তাতে আপনি দেখতে পাচ্ছেন,
পিআইপিএফ এ

@ স্টটারমরেজ আপনার প্রশ্ন এবং মাইকেলের উত্তর আমার সমস্যার সমাধানের দিকে নিয়ে গেছে তাই আমি ভেবেছিলাম যে আমি এখানে এখানে এটি নোট করব যদিও আমার উত্তরটি সত্যিই আপনার পরিস্থিতিতে প্রযোজ্য নয়।
ম্যাকমেকারসন

ঠিক আছে, আপনি এবং মাইকেল ঠিক বলেছেন, সবচেয়ে যুক্তিসঙ্গত সমাধানটি হবে API এ এসএসএল ব্যবহার করা, তবে এই প্রসঙ্গে আমি এটি করতে সক্ষম হইনি কারণ এটি একটি তৃতীয় পক্ষের এপিআই, তবে ওয়ার্ডপ্রেস বা পিপিএল ব্যবহার করে একটি সমাধান কোনও লিগ্যাসি সাইট তাদের ব্যাকএন্ডে ডেটা প্রেরণ এবং সার্ভারের মধ্যে এপিআইতে অনুরোধ প্রেরণ করতে পারে।
স্টর্মরেজ

আমি তাই আমি একই ভুল এই প্রবন্ধে উল্লেখ করেছি একই হোস্ট সার্ভার প্রান্তের এবং PWA যেমন আয়নের অ্যাপ্লিকেশন হিসেবে Laravel দ্বারা API বাস্তবায়িত stackoverflow.com/q/56157129/308578
সাবের tabatabaee yazdi

1

এজাক্স পোস্ট পদ্ধতিটি ব্যবহার না করে আপনি উপাদানটির সাথে ডায়নামিক ফর্মটি ব্যবহার করতে পারেন। এটি কাজ করবে এমনকি পৃষ্ঠায় এসএসএল লোড হয় এবং জমা দেওয়া উত্সটি এসএসএল নয়।

আপনাকে ফর্মের উপাদানটির মান নির্ধারণ করতে হবে।

যখন টার্গেট অ্যাট্রিবিউটটি '_ব্ল্যাঙ্ক' সেট করেছে তখন নতুন গতিশীল ফর্ম ব্রাউজারের পৃথক ট্যাবে নন এসএসএল মোড হিসাবে খুলবে will

var f = document.createElement('form');
f.action='http://XX.XXX.XX.XX/vicidial/non_agent_api.php';
f.method='POST';
//f.target='_blank';
//f.enctype="multipart/form-data"

var k=document.createElement('input');
k.type='hidden';k.name='CustomerID';
k.value='7299';
f.appendChild(k);



//var z=document.getElementById("FileNameId")
//z.setAttribute("name", "IDProof");
//z.setAttribute("id", "IDProof");
//f.appendChild(z);

document.body.appendChild(f);
f.submit()

আমি আসলে একটি এপিআই হিট করতে চাই, তবে যখন আমি অনুরোধটি করে আপনার পদ্ধতিটি দিয়ে করি তখন আমি আসলে একটি ফর্ম জমা দিচ্ছিলাম তবে এখন আমি এপিআই থেকে প্রতিক্রিয়াটি পড়তে আটকে আছি। কারণ আমি অনুমান করি যে এজ্যাক্স বা এক্সএমএলএইচটিএইচটিপ্রিয়েষ্টটিই একমাত্র বিকল্প
সিদ্ধার্থ চৌধুরী চৌধুরী

সমাধানের সমাধান করে :-)
বিজি ব্রুনো

সরল এবং উজ্জ্বল
হরাকাল

0

আমি একই সমস্যা ছিল, কিন্তু আমার জন্য সমস্যাটি ছিল এনজি বিল্ড কমান্ড। আমি "এনজি বিল্ড - প্রোড" করছিলাম আমি এটিকে "এনজি বিল্ড - প্রোড --base-href / অ্যাপ্লিকেশন নাম /" এ সংশোধন করেছি। এবং এটি আমার সমস্যার সমাধান করে।


0

আমার ক্ষেত্রে, আমার লোকালহোস্ট ছিল httpএবং আমার মোতায়েন করা সংস্করণ ছিল https, তাই আমি এই স্ক্রিপ্টটি কেবলমাত্র https- র জন্য HTTP- সম মেটা ট্যাগ যুক্ত করতে ব্যবহার করেছি:

if (window.location.protocol.indexOf('https') == 0){
  var el = document.createElement('meta')
  el.setAttribute('http-equiv', 'Content-Security-Policy')
  el.setAttribute('content', 'upgrade-insecure-requests')
  document.head.append(el)
}
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.