النقل إلى وضع الحماية IFRAME

تستخدم "برمجة تطبيقات Google" وضع الحماية للأمان لتوفير عزل وقائي Google Workspace للتطبيقات في بعض الحالات. تم إيقاف جميع أوضاع وضع الحماية الآن باستثناء IFRAME. تستخدم التطبيقات التي تستخدم أوضاع وضع الحماية القديمة الآن وضع IFRAME الأحدث تلقائيًا.

بالنسبة إلى التطبيقات التي سبق لها استخدام هذه الأوضاع القديمة مع خدمة HTML، قد تحتاج إلى إجراء تغييرات على وضع IFRAME لمعالجة الاختلافات التالية:

  • عليك الآن إلغاء سمة target للرابط باستخدام target="_top" أو target="_blank".
  • يجب أن تتضمّن ملفات HTML التي تعرضها خدمة HTML علامات <!DOCTYPE html> و<html> و <body>
  • لا يتم تحميل مكتبة برنامج التحميل الأصلي من Google api.js تلقائيًا في وضع IFRAME.
  • يحتاج مستخدمو أداة الاختيار إلى الاتصال بـ setOrigin() لأنه يتم عرض المحتوى من نطاق جديد
  • بعض المتصفحات القديمة، بما في ذلك IE9، غير متوافقة
  • يجب أن تستخدم الموارد المستورَدة بروتوكول HTTPS الآن
  • لم يعُد يتم منع إرسال النماذج تلقائيًا

تم توضيح هذه الاختلافات في الأقسام التالية.

في الوضع IFRAME، عليك ضبط سمة استهداف الرابط على _top أو _blank:

Code.js

function doGet() {
  var template = HtmlService.createTemplateFromFile('top');
  return template.evaluate();
}

top.html

<!DOCTYPE html>
<html>
 <body>
   <div>
     <a href="http://google.com" target="_top">Click Me!</a>
   </div>
 </body>
</html>

يمكنك أيضًا إلغاء هذه السمة باستخدام علامة <base> داخل قسم الرأس من صفحة الويب التي تتضمن الصورة:

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
   <div>
     <a href="http://google.com">Click Me!</a>
   </div>
 </body>
</html>

علامات HTML ذات المستوى الأعلى

في وضع الحماية في NATIVEEMULATED)، تتم إضافة بعض علامات HTML تلقائيًا إلى ملف .html لبرمجة التطبيقات، ولكن لا يحدث ذلك عند استخدام وضع IFRAME.

للتأكد من عرض صفحات مشروعك بشكل صحيح باستخدام IFRAME، عليك التفاف محتوى صفحتك في علامات المستوى الأعلى التالية:

<!DOCTYPE html>
<html>
  <body>
    <!-- Add your HTML content here -->
  </body>
</html>

يجب تحميل مكتبة أداة تحميل JavaScript الأصلية بشكل صريح

يجب تغيير النصوص البرمجية التي اعتمدت على التحميل التلقائي لمكتبة برنامج التحميل الأصلي api.js لتحميل هذه المكتبة بشكل صريح، كما في المثال التالي:

<script src="https://apis.google.com/js/api.js?onload=onApiLoad">
</script>

تغيير في Google Picker API

عند استخدام Google Picker API، عليك الآن استدعاء setOrigin() عند إنشاء PickerBuilder وتمرير google.script.host.origin في الأصل، كما هو موضح في المثال التالي:

function createPicker(oauthToken) {
  var picker = new google.picker.PickerBuilder()
      .addView(google.picker.ViewId.SPREADSHEETS) // Or a different ViewId
      .setOAuthToken(oauthToken)
      .setDeveloperKey(developerKey)
      .setCallback(pickerCallback)
      .setOrigin(google.script.host.origin) // Note the setOrigin
      .build();
  picker.setVisible(true);
}

للاطّلاع على مثال كامل، راجِع مربعات حوار فتح الملف.

المتصفحات المتوافقة

يستند وضع الحماية IFRAME إلى ميزة وضع الحماية باستخدام iframe في HTML5. وهذا الإجراء غير متاح في بعض المتصفّحات القديمة، مثل Internet Explorer 9. يمكن أن يمثل هذا مشكلة إذا كان مشروع برمجة التطبيقات لديك:

  • يستخدم HtmlService،
  • سبق أن تم استخدام وضع الحماية EMULATED أو NATIVE

وعند نقل هذه التطبيقات إلى وضع الحماية في IFRAME، قد لا تعمل على بعض المتصفّحات القديمة (لا سيما IE9 والإصدارات الأقدم) التي لا تتيح استخدام ميزة وضع الحماية باستخدام إطار iframe في HTML5.

لا تؤثر هذه المشكلة على التطبيقات التي تطلب وضع IFRAME أو لا تستخدم HtmlService على الإطلاق.

يجب الآن استخدام HTTPS للموارد التي يتم استيرادها

يجب تغيير التطبيقات السابقة التي استوردت الموارد باستخدام HTTP لاستخدام HTTPS بدلاً من ذلك.

لم يعُد يتم منع إرسال النماذج تلقائيًا

ضمن NATIVE، تم منع نماذج HTML التي تضع وضع الحماية من إرسال الصفحة والتنقل فيها. وبالتالي، بإمكان المطوّر ببساطة إضافة معالج onclick إلى زر الإرسال بدون القلق بشأن ما حدث بعد ذلك.

باستخدام الوضع IFRAME، يُسمح بإرسال نماذج HTML وإذا لم يتم تحديد سمة action في عنصر النموذج، سيتم إرساله إلى صفحة فارغة. والأسوأ من ذلك، هو أنّ إطار iframe الداخلي سيعيد التوجيه إلى الصفحة الفارغة قبل أن يتمكّن معالج onclick من إنهاء العملية.

يكمن الحل في إضافة رمز JavaScript إلى صفحتك لمنع إرسال عناصر النموذج، لكي يكون لدى معالجات النقرات الوقت اللازم لتنفيذ ما يلي:

<script>
  // Prevent forms from submitting.
  function preventFormSubmit() {
    var forms = document.querySelectorAll('form');
    for (var i = 0; i < forms.length; i++) {
      forms[i].addEventListener('submit', function(event) {
        event.preventDefault();
      });
    }
  }
  window.addEventListener('load', preventFormSubmit);
</script>

يمكن العثور على مثال كامل في دليل HtmlService الاتصال من عميل إلى خادم.