نقل البيانات إلى وضع الحماية في إطار IFRAME

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

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

  • عليك الآن إلغاء السمة target للرابط باستخدام target="_top" أو target="_blank".
  • يجب أن تتضمّن ملفات HTML التي تقدّمها "خدمة HTML" العلامات <!DOCTYPE html> و<html> و<body>
  • لا يتم تحميل مكتبة أداة التحميل gapi (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>

يجب تحميل مكتبة gapi loader بشكلٍ صريح

يجب تغيير النصوص البرمجية التي كانت تعتمد على التحميل التلقائي لمكتبة أداة التحميل gapi (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. قد يمثّل ذلك مشكلة إذا كان مشروعك في "برمجة تطبيقات Google" يستوفي الشرطين التاليين:

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

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

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

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

يجب تغيير التطبيقات السابقة التي استوردت موارد باستخدام HTTP إلى HTTPS.

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

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

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

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

// 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);

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