SHET21

خطای Mixed Content – Your Connection is not secure و روش حل آن

خطای Mixed Content – Your Connection is not secure و روش حل آن

هر کسی که یه مدت با وردپرس کار کرده باشه، بالاخره یه جایی با یه ارور عجیب و غریب روبه‌رو شده. یکی از همین ارورها که خیلی هم رایجه، خطای Mixed Content هست. احتمالاً خودتون هم دیدینش؛ همون لحظه‌ای که مرورگر به جای قفل کوچولوی کنار آدرس سایت، یه علامت هشدار نشون میده و می‌نویسه سایت امن نیست.

مشکل اینجاست که خیلی‌ها این خطا رو جدی نمی‌گیرن. میگن «حالا سایت که بالا میاد، ولش کن!» ولی همین بی‌خیالی می‌تونه بعداً دردسرهای خیلی بزرگ‌تری درست کنه. تو این مقاله می‌خوایم دقیقاً بگیم این ارور چیه، چرا سراغتون میاد، و مهم‌تر از همه چطوری از شرش خلاص شید. بریم سراغش.

خطای Mixed Content چیست؟

قبل از اینکه بریم سراغ حلش، بذارید یه توضیح ساده بدیم که بدونید داریم راجع به چی حرف می‌زنیم.

ماجرا از اینجا شروع میشه که سایتتون روی HTTPS لود میشه (یعنی SSL دارید و اتصال رمزنگاری شده)، ولی یه سری از فایل‌های داخل صفحه (مثل عکس، فایل CSS، جاوااسکریپت یا فونت) هنوز دارن از آدرس HTTP خونده میشن. یعنی صفحه امنه ولی محتواش نصفه‌نیمه امنه. به همین قاطی‌پاتی بودن میگن Mixed Content، یعنی «محتوای ترکیبی».

مرورگر هم که حساسیت داره، تا این وضعیت رو ببینه بلافاصله هشدار میده که «اینجا یه چیزی درست نیست، یه محتوای ناامن وجود داره». تو کروم معمولاً به شکل پیام Your Connection is Not Secure یا همون هشدار Mixed Content تو کنسول خودشو نشون میده.

خطای Mixed Content در Google Chrome
خطای Mixed Content در Google Chrome

خبر خوب اینه که حلش واقعاً سخت نیست. خبر بد اینه که اگه ولش کنید، هم روی سئوتون اثر می‌ذاره هم روی اعتماد کاربرها.

چرا این خطا سراغمون میاد؟

توی ۹۰ درصد مواقع، جوابش یه چیزه: انتقال ناقص از HTTP به HTTPS.

یعنی شما SSL رو نصب کردید، سایت روی HTTPS اومده بالا، ولی آدرس‌های قدیمی داخل دیتابیس و کدها هنوز با http:// ذخیره شدن. وردپرس هم بنده خدا داره همون آدرسی که تو دیتابیس نوشته شده رو صدا می‌زنه و نمی‌دونه باید HTTPS باشه.

ولی دلایل دیگه‌ای هم داره:

  • به یه منبع خارجی لینک دادید که خودش HTTPS نداره (مثلاً یه عکس از یه سایت قدیمی).
  • توسعه‌دهنده قالب یا افزونه، آدرس‌ها رو هاردکد کرده و با http:// نوشته.
  • یه اسلایدر یا ویدیوی امبد شده که آدرسش قدیمیه.

خلاصه هرجا یه http:// ته کد باقی مونده باشه، همون‌جا این ارور جوونه می‌زنه.

چرا HTTPS انقدر اهمیت دارد؟

شاید بگید «خب سایت ما که فروشگاه نیست، HTTPS به چه دردمون می‌خوره؟» بذارید سه تا دلیل بگیم که نظرتون عوض شه.

۱. تأثیرش روی سئو

گوگل خیلی وقته رسماً اعلام کرده که HTTPS یکی از فاکتورهای رتبه‌بندیه. یعنی بین دو تا سایت با کیفیت محتوای برابر، اونی که HTTPS داره شانس بیشتری برای بالا اومدن داره. الان دیگه HTTPS نداشتن مثل امتیاز منفیه، نه اینکه داشتنش امتیاز مثبت باشه.

۲. تأثیرش روی امنیت

وردپرس یکی از محبوب‌ترین اهداف هکرهاست، چون تعداد سایت‌هاش زیاده. HTTPS باعث میشه هر اطلاعاتی که بین کاربر و سرور شما رد و بدل میشه (از رمز عبور گرفته تا اطلاعات فرم تماس) رمزنگاری شه و وسط راه قابل شنود نباشه. مخصوصاً اگه فروشگاه اینترنتی دارید، این دیگه انتخاب نیست، اجباره.

۳. تأثیرش روی اعتبارتون

این یکی رو دست کم نگیرید. کاربری که وارد سایتتون میشه و به جای قفل، علامت هشدار قرمز می‌بینه، همون لحظه فکر می‌کنه سایت مشکوکه. مهم نیست محتواتون چقدر خوب باشه؛ یه کلیک روی دکمه Back و تمام. تو فضای آنلاین که مشتری نمی‌تونه از نزدیک شما رو ببینه، همین جزئیات کوچیک اعتماد می‌سازن یا خرابش می‌کنن.

راستی یه نکته: تو نسخه‌های جدید کروم دیگه اون قفل سبز قدیمی رو نمی‌بینید. گوگل آیکون رو عوض کرده و الان یه آیکون تنظیمات (شبیه دو تا اسلایدر) کنار آدرس نشون میده. با کلیک روش می‌تونید وضعیت امنیت اتصال رو ببینید. پس اگه قفل سبز ندیدید نگران نشید، طبیعیه!

connection in secure
connection in secure

انواع خطای Mixed Content

دو نوع، و فرقشون مهمه:

Active Mixed Content: این خطرناکه‌ست. وقتی اتفاق میفته که فایل‌های اجرایی مثل جاوااسکریپت، CSS یا iframe از طریق HTTP لود بشن. چرا خطرناکه؟ چون این فایل‌ها می‌تونن کل محتوای صفحه رو تغییر بدن. اگه یکی وسط راه اسکریپت رو دستکاری کنه، عملاً کنترل صفحه رو گرفته. به همین خاطر مرورگرهای مدرن معمولاً این نوع محتوا رو کلاً بلاک می‌کنن و اجازه لود شدنش رو نمیدن.

Passive Mixed Content: این ملایم‌تره. مربوط به فایل‌هایی مثل عکس، ویدیو و صوته که از HTTP لود میشن. اینا نمی‌تونن ساختار صفحه رو دستکاری کنن، برای همین مرورگر معمولاً لودشون می‌کنه ولی هشدار میده و قفل رو ازتون می‌گیره.

خلاصه اینکه هر دوش باید حل شه، ولی اگه وقت کم دارید اول برید سراغ Active.

چطور بفهمیم مشکل از کجاست؟

قبل از اینکه شروع کنید به حل کردن، باید بدونید دقیقاً کدوم فایل داره اذیت می‌کنه. سه تا روش می‌گیم، از ساده به حرفه‌ای.

روش اول: کنسول مرورگر (بهترین روش)

این روش رو بیشتر از همه پیشنهاد می‌کنیم چون سریع‌ترین و دقیق‌ترینه.

صفحه مورد نظرتون رو تو کروم باز کنید، راست کلیک کنید و Inspect رو بزنید (یا کلید F12). بعد برید به تب Console. اونجا مرورگر با رنگ زرد یا قرمز دقیقاً بهتون میگه کدوم آدرس داره از HTTP لود میشه.

تب console ار مرورگر
تب console ار مرورگر

مثلاً یه همچین چیزی می‌بینید:

Mixed Content: The page at 'https://example.com/' was loaded over HTTPS,
but requested an insecure image 'http://example.com/wp-content/uploads/img.jpg'.

همین! آدرس دقیق فایل مشکل‌دار جلوی چشمتونه. دیگه لازم نیست دستی بگردید.

روش دوم: سایت‌های تست آنلاین

سایت Why No Padlock یکی از معروف‌ترین‌هاست.

آدرس صفحه‌تون رو وارد می‌کنید، دکمه Test Page رو می‌زنید و اون کل صفحه رو اسکن می‌کنه و لیست منابع ناامن رو نشون میده. فقط یه نکته: این سایت برای آی‌پی ایران معمولاً بسته‌ست، پس یا با تغییر آی‌پی برید سراغش یا از ابزارهای مشابه استفاده کنید.

نتیجه Why No Padlock
نتیجه Why No Padlock

روش سوم: افزونه‌های وردپرسی

اگه اصلاً حوصله کد و کنسول رو ندارید، افزونه‌هایی هستن که خودشون اسکن می‌کنن و گزارش میدن. جلوتر مفصل درباره‌شون حرف می‌زنیم.

روش حل کردن مشکل Mixed Content

خب، مشکل رو پیدا کردید. حالا نوبت درست کردنشه. از ساده‌ترین راه شروع می‌کنیم.

قدم اول: آدرس سایت رو تو تنظیمات درست کنید

تنظیمات عمومی
تنظیمات عمومی

اول از همه برید به پیشخوان وردپرس، بعد تنظیمات ← عمومی. اونجا دو تا فیلد دارید:

  • نشانی وردپرس (URL)
  • نشانی سایت (URL)

مطمئن شید هر دوتاشون با https:// شروع میشن، نه http://. اگه با HTTP بودن، عوضشون کنید و ذخیره بزنید.

تغییر http به https
تغییر http به https

این ساده‌ترین قدمه ولی معمولاً به تنهایی کافی نیست، چون آدرس‌های داخل پست‌ها و دیتابیس هنوز سر جاشونن.

قدم دوم: آدرس‌های قدیمی داخل دیتابیس رو عوض کنید

اینجا جاییه که کار دستی خیلی وقت‌گیر میشه. تصور کنید ۵۰۰ تا پست دارید که هر کدوم چند تا عکس با آدرس HTTP دارن. دستی که نمیشه!

راه‌حل: از افزونه‌های Search & Replace استفاده کنید. افزونه Better Search Replace یکی از بهترین‌هاست.

افزونه Better Search Replace
افزونه Better Search Replace

نصبش می‌کنید، تو قسمت Search for می‌نویسید http://yoursite.com و تو قسمت Replace with می‌نویسید https://yoursite.com، جدول‌ها رو انتخاب می‌کنید و اجرا می‌زنید.

replace url
replace url

⚠️ خیلی مهم: قبل از این کار حتماً از دیتابیس بکاپ بگیرید. اول هم گزینه Run as dry run رو بزنید تا ببینید چند مورد قراره عوض شه، بعد اجرای واقعی رو انجام بدید.

قدم سوم: افزونه SSL Insecure Content Fixer

SSL Insecure Content Fixer
SSL Insecure Content Fixer

اگه بعد از کارهای بالا هنوز خطا دارید (که معمولاً به خاطر قالب یا افزونه‌هاست)، این افزونه نجات‌دهنده‌ست. رایگانه، از مخزن وردپرس نصبش کنید و برید تو تنظیماتش.

اونجا ۵ تا سطح می‌بینید که هر کدوم شدت کارشون فرق داره:

سطح های مختلف افزونه SSL Insecure Content Fixer
سطح های مختلف افزونه SSL Insecure Content Fixer

۱. Simple حالت پیش‌فرض و سبک‌ترین گزینه. آدرس‌های داخل محتوا، ویجت‌ها و لینک‌های اصلی رو درست می‌کنه. اول با همین شروع کنید، شاید همین کافی بود.

۲. Content مشکلات مربوط به تصاویر و ویدیوهای embed شده داخل محتوا رو حل می‌کنه.

۳. Widgets علاوه بر محتوا، سراغ ابزارک‌های سایت هم میره. اگه مشکلتون از یه ابزارک تو سایدباره، این گزینه کارتون رو راه می‌ندازه.

۴. Capture یه پله جدی‌تر. علاوه بر همه موارد بالا، فایل‌های scripts و css رو هم پوشش میده. اگه قالبتون آدرس‌ها رو هاردکد کرده، معمولاً از اینجا به بعد حل میشه.

۵. Capture All قوی‌ترین حالت که حتی درخواست‌های AJAX رو هم شامل میشه. چون سنگین‌ترین گزینه‌ست و روی سرعت سایت اثر می‌ذاره، فقط وقتی برید سراغش که بقیه جواب ندادن. بعد از فعال کردنش هم حتماً کل سایت رو تست کنید.

توصیه ما: از پایین شروع کنید، نه از بالا. اول Simple، اگه حل نشد Content، بعد Widgets و همین‌طور برید بالا. با Capture All شروع نکنید چون بی‌دلیل به سایتتون فشار میارید.

قدم چهارم: افزونه Really Simple SSL (اگه دنبال راه سریع‌تری هستید)

Really Simple SSL
Really Simple SSL

یه راه دیگه هم هست: افزونه Really Simple SSL. این افزونه تقریباً همه کارهای بالا رو خودکار انجام میده (از ریدایرکت HTTP به HTTPS گرفته تا اصلاح آدرس‌های ناامن).

راستی اگه توی مقاله‌های قدیمی اسم افزونه «WordPress HTTPS (SSL)» رو دیدید، بدونید که اون افزونه سال‌هاست به‌روزرسانی نشده و از مخزن وردپرس هم برداشته شده. سراغش نرید، همون Really Simple SSL یا SSL Insecure Content Fixer گزینه‌های بهتری هستن.

چک‌لیست سریع برای آخر کار

بعد از اینکه همه کارها رو کردید، اینا رو هم چک کنید:

  • کش سایت و کش افزونه کش رو کاملاً پاک کنید (خیلی وقتا مشکل حل شده ولی کش داره نسخه قدیمی رو نشون میده!)
  • اگه از CDN استفاده می‌کنید، کش اونم پاک کنید
  • فایل wp-config.php رو چک کنید که آدرس هاردکد شده با HTTP نداشته باشه
  • چند تا صفحه مختلف سایت رو با کنسول تست کنید، نه فقط صفحه اصلی
  • یه ریدایرکت ۳۰۱ از HTTP به HTTPS تنظیم کنید تا کاربرای قدیمی هم هدایت شن

جمع‌بندی

خطای Mixed Content از اون مشکلاییه که ظاهرش کوچیکه ولی اثرش روی سئو، امنیت و اعتماد کاربر واقعاً بزرگه. خوشبختانه حلش هم پیچیده نیست. با کنسول مرورگر مشکل رو پیدا می‌کنید، با یه Search & Replace آدرس‌های دیتابیس رو درست می‌کنید، و با یه افزونه مثل SSL Insecure Content Fixer باقی موارد رو جمع می‌کنید.

فقط یه خواهش: وقتی این ارور رو دیدید، ولش نکنید. الان ده دقیقه وقت می‌بره، ولی اگه چند ماه بگذره و رتبه‌تون افت کنه، جبرانش خیلی سخت‌تره.

امیدواریم این مقاله کارتون رو راه انداخته باشه. اگه سؤالی داشتید یا جایی گیر کردید، تو کامنت‌ها بپرسید. موفق باشید! 🙂

نظر شما در این مورد چیه؟

  1. U326126۱ شهریور ۱۴۰۲

    سلام
    من ادرس سایت رو به httpsهمونطوری که گفتین تغییر دادم اما بعد از Reloadکردن سایت کاملا از دسترس خارج شد و ارور Your connection is not private برام نمایش داده میشه میشه بگین چیکارکنم؟

  2. U43912۸ اسفند ۱۴۰۰

    سلام شما SSL رو نوشتید SLL

    • رضا راد۱۴ اسفند ۱۴۰۰

      سپاس از شما تصحیح شد.

  3. U12585۶ مهر ۱۳۹۸

    سلام.
    در روش استفده از Console در مروگر کروم، در همین صفحه تست کردم، هشدار هایی بصورت زیر نمایش داده می شود:
    content-hooks-frames-web . js : 232 SingleFile is hooking the requestAnimationFrame and cancelAnimationFrame functions to load deferred images in background tabs.
    window.requestAnimationFrame – content-hooks-frames-web.js : 232
    content-hooks-frames-web . js : 309 SingleFile is hooking the IntersectionObserver API to detect and load deferred images.
    window.IntersectionObserver – content-hooks-frames-web . js : 309

    این موارد را باید نادیده بگیریم؟
    در وبسایت خودم هم در قسمت کنسول دقیقا همین موارد اومده، با اینکه طبق سایت Why No PadLock مشکلی وجود ندارد.
    سپاس از شما برای ارائه این محتوای ارزشمند.

    • تیم پشتیبانیتیم پشتیبانی۶ مهر ۱۳۹۸

      با سلام و احترام
      لطفا از طریق آدرس تلگرامی که برای شما ایمیل شد با جناب حسینی راد در ارتباط باشید

پشتیبانپشتیبانپشتیبانپشتیبانپشتیبان
تیم میهن وردپرس
پشتیبانپشتیبانپشتیبانپشتیبانپشتیبان
تیم میهن وردپرسآنلاین و پاسخگوی شما هستیم.آنلاین

در حال بارگذاری...

هر سوالی دارید بپرسید.پاسخگوی شما هستیم.