حظر القراءة المشتركة (CORB) في ملحقات Chrome

صورة

إذا كنت قد طورت لاحقًا إضافة لمتصفح Chrome ، فقد يتبين أنها توقفت عن العمل.

والسبب هو أنه بدءًا من العام الماضي ، يتم حظر طلبات Cross-Origin من نصوص المحتوى في متصفح Chrome. وهذا يعني أنه في حالة وصول الإضافة إلى بعض واجهة برمجة التطبيقات التابعة لجهة خارجية مباشرةً من النص البرمجي للمحتوى ، فسيتم حظر هذا الطلب بفضل Cross-Origin Read Blocking (CORB)

الطريقة الموصى بها لحل مشكلة الحظر هي نقل الطلبات من البرنامج النصي للمحتوى إلى البرنامج النصي للخلفية. مثال من الوثائق:

نص المحتوى القديم:

var itemId = 12345;
var url = "https://another-site.com/price-query?itemId=" +
         encodeURIComponent(request.itemId);
fetch(url)
  .then(response => response.text())
  .then(text => parsePrice(text))
  .then(price => ...)
  .catch(error => ...)

نص محتوى جديد:

chrome.runtime.sendMessage(
    {contentScriptQuery: "queryPrice", itemId: 12345},
    price => ...);

نص خلفية جديد:

chrome.runtime.onMessage.addListener(
  function(request, sender, sendResponse) {
    if (request.contentScriptQuery == "queryPrice") {
      var url = "https://another-site.com/price-query?itemId=" +
          encodeURIComponent(request.itemId);
      fetch(url)
          .then(response => response.text())
          .then(text => parsePrice(text))
          .then(price => sendResponse(price))
          .catch(error => ...)
      return true;  // Will respond asynchronously.
    }
  });

انتبه أيضًا إلى حقيقة أنه لا ينبغي لك إنشاء وكيل من نص برمجي للخلفية ، أي لا يجب إرسال عنوان URL كرسالة من البرنامج النصي للمحتوى إلى البرنامج النصي للخلفية لتلقي البيانات ، ولكن من الجدير تحديد عنوان URL داخل البرنامج النصي للخلفية بناءً على البيانات الموجودة في الرسالة. وهكذا، في المثال أعلاه، يتم تحديد URL للطلب من contentScriptQuery و المعلمات itemId . مثال على رسالة "سيئة" مأخوذة من الوثائق:

{
  contentScriptQuery: "fetchUrl",
  url: "https://example.com/any/path/or/site/allowed/here"
}

ملاحظة: أقوم

بتطوير امتدادات لمتصفح Firefox و Chrome ، ولكن المتصفح الرئيسي هو Firefox ، وأتحقق من الأداء في Chrome عندما أقوم بتنزيل إصدار جديد من الإضافة. في اليوم الآخر ، اكتشفت أن أحد امتداداتي توقفت عن العمل ، لقد خمنت ذلك بفضل CORB. تحقق من الامتدادات الخاصة بك حتى لا يكون هذا مفاجأة لك.

All Articles