Отчет: значения для передачи между Javascript и Google Apps Script с помощью google.script.run

В проекте Google Apps Script значения можно переносить из HTML в Google Apps Script с помощью google.script.run с помощью Javascript. В этом случае, к сожалению, значения всех типов передать невозможно. В официальном документе говорится следующее. Реф

Большинство типов допустимы, но не элементы Date, Function или DOM, кроме формы; см. описание

Юридические параметры — это примитивы JavaScript, такие как число, логическое значение, строка или значение NULL, а также объекты и массивы JavaScript, состоящие из примитивов, объектов и массивов. Элемент формы на странице также допустим в качестве параметра, но он должен быть единственным параметром функции. Запросы завершаются неудачей, если вы пытаетесь передать элемент Date, Function, DOM помимо формы или другого запрещенного типа, включая запрещенные типы внутри объектов или массивов. Объекты, создающие циклические ссылки, также не будут работать, а неопределенные поля в массивах станут нулевыми. Обратите внимание, что объект, переданный на сервер, становится копией оригинала. Если функция сервера получает объект и изменяет его свойства, свойства клиента не затрагиваются.

Из этого документа он может узнать о значениях (число, логическое значение, строка, массив и объект, включая их), которые часто могут использоваться. Но в Javascript есть значения большего количества типов. Считается, что когда значения, которые можно использовать в этой ситуации, будут четко известны, это будет полезно для многих разработчиков. В этом отчете представлены значения, которые можно использовать для передачи между HTML и скриптом Google Apps с помощью google.script.run.

1. От HTML к скрипту Google Apps

В этом разделе представлены значения, которые можно перенести из HTML в скрипт Google Apps с помощью google.script.run. Пример скрипта можно увидеть в разделе «Приложение». В результате могла быть получена следующая таблица.

Переданные значения

Неверные значения

В случае [0, 1, 2, new Date(), 4, 5] произошла ошибка типа Failed due to illegal value in property: 3. При этом обнаруживается, что ошибка возникает в индексе 3.

2. От скрипта Google Apps к HTML

В этом разделе представлены значения, которые можно перенести из скрипта Google Apps в HTML с помощью google.script.run. Пример скрипта можно увидеть в разделе «Приложение». В результате могла быть получена следующая таблица.

В этом разделе входное и выходное значение являются противоположностью приведенного выше раздела. Пожалуйста, будьте осторожны с этим.

Переданные значения

Неверные значения

Краткое содержание

В этом отчете исследовались значения для передачи между Javascript и Google Apps Script с помощью google.script.run. Из этого отчета был получен следующий результат.

В случае переноса значений из HTML в Google Apps Script можно передать следующие значения:
- Число
- Строка
- Логическое значение
- Массив
- Объект JSON, созданный с помощью чисел, значений и логических значений
- Объект формы
- Null
В случае переноса значений из Google Apps Script в HTML можно перенести следующие значения:
- Число
- Строка
- Логическое значение
- Массив
- Объект JSON, построенный из чисел, значений и логических значений
- Байтовый массив
- Int8Array
- Null
Важным моментом является то, что когда ошибочное значение включается в массив и объект JSON, возникает ошибка. Пожалуйста, будьте осторожны с этим.
Если вы хотите передать неудавшиеся значения, необходимо преобразовать их в переданные значения, такие как строка и массив байтов. Таким образом, вы можете переключаться между HTML и Google Apps Script с помощью google.script.run.

Когда вы разрабатываете скрипт для передачи значений между HTML и Google Apps Script с google.script.run, когда значения не могут быть корректно переданы, если этот отчет будет полезен, я рад.

Приложение

Скрипт «От HTML к скрипту Google Apps»

Скрипт Google Apps

const doGet = (_) => HtmlService.createHtmlOutputFromFile("index");
const sample1 = (e) => {
  const obj = ["null", "undefined", "", "0"];
  if (e) {
    const type = typeof e;
    return { response: e, type };
  }
  return { response: obj[[null, undefined, "", 0].findIndex((f) => f === e)] };
};

HTML и Javascript

<script src="https://cdn.jsdelivr.net/gh/tanaikech/syncGoogleScriptRun@master/syncGoogleScriptRun.min.js"></script>
<form id="form">
  <input type="text" value="sample value" name="sample text" id="text" />
</form>
<input type="button" value="run" onclick="run()" />
<script>
  async function run() {
    const blob = new Blob(["sample text"], { type: "text/plain" });
    const buffer = await blob.arrayBuffer();
    const obj = {
      number1: 123,
      number2: new Number(123),
      string1: "sample",
      string2: new String("sample"),
      bool: true,
      regex: new RegExp("^.*$"),
      array1dObject: new Array(1).fill("sample"),
      array2dObject: new Array(1).fill(new Array(1).fill("sample")),
      jsonObject: { key: "value" },
      functionObject: function () {
        return "ok";
      },
      formObject: document.getElementById("form"),
      inputTagObject: document.getElementById("text"),
      date1Object: new Date(),
      date2Object: [0, 1, 2, new Date(), 4, 5],
      mapObject: new Map([["a", "b"]]),
      setObject: new Set(["a", "b"]),
      promiseObject: new Promise((res) => res("ok")),
      blobObject: blob,
      bufferObject: buffer,
      int8ArrayObject: new Int8Array(buffer.buffer),
      uint8ArrayObject: new Uint8Array(buffer.buffer),
      streamObject: await blob.stream(),
      nullValue: null,
      undefinedValue: undefined,
    };
    const ret = {};
    const err = [];
    const noResponse = [];
    for (let i in obj) {
      const r = await syncGoogleScriptRun({
        gasFunction: "sample1",
        arguments: obj[i],
      }).catch((e) => (err[i] = { error: e.message }));
      if (r) {
        ret[i] = r;
      } else {
        noResponse.push(i);
      }
    }
    const keys = Object.keys(obj);
    const res = keys.reduce((o, k) => ((o[k] = err[k] || ret[k]), o), {});

    console.log(res);
    console.log(err);
    console.log(noResponse);
  }
</script>

Результат

console.log(res)

{
  "number1": { "type": "number", "response": 123 },
  "number2": { "error": "Failed due to illegal value in property: 0" },
  "string1": { "type": "string", "response": "sample" },
  "string2": { "error": "Failed due to illegal value in property: 0" },
  "bool": { "type": "boolean", "response": true },
  "regex": { "error": "Failed due to illegal value in property: 0" },
  "array1dObject": { "type": "object", "response": ["sample"] },
  "array2dObject": { "type": "object", "response": [["sample"]] },
  "jsonObject": { "type": "object", "response": { "key": "value" } },
  "functionObject": { "error": "Failed due to illegal value in property: 0" },
  "formObject": {
    "type": "object",
    "response": { "sample text": "sample value" }
  },
  "inputTagObject": { "error": "Failed due to illegal value in property: 0" },
  "date1Object": { "error": "Failed due to illegal value in property: 0" },
  "date2Object": { "error": "Failed due to illegal value in property: 3" },
  "mapObject": { "error": "Failed due to illegal value in property: 0" },
  "setObject": { "error": "Failed due to illegal value in property: 0" },
  "promiseObject": { "error": "Failed due to illegal value in property: 0" },
  "blobObject": { "error": "Failed due to illegal value in property: 0" },
  "bufferObject": { "error": "Failed due to illegal value in property: 0" },
  "int8ArrayObject": { "error": "Failed due to illegal value in property: 0" },
  "uint8ArrayObject": { "error": "Failed due to illegal value in property: 0" },
  "streamObject": { "error": "Failed due to illegal value in property: 0" },
  "nullValue": { "response": "null" },
  "undefinedValue": { "response": "null" }
}

console.log(err)

[]

console.log(noResponse)

[]

Скрипт «Из сценария Google Apps в HTML»

Скрипт Google Apps

const doGet = (_) => HtmlService.createHtmlOutputFromFile("index");
function sample2(e) {
  const blob = Utilities.newBlob("sample text", "text/plain");
  const bytes = blob.getBytes();
  const buffer = new Uint8Array(bytes).buffer;
  const obj = {
    number1: 123,
    number2: new Number(123),
    string1: "sample",
    string2: new String("sample"),
    bool: true,
    regex: new RegExp("^.*$"),
    array1dObject: new Array(1).fill("sample"),
    array2dObject: new Array(1).fill(new Array(1).fill("sample")),
    jsonObject: { key: "value" },
    functionObject: function () {
      return "ok";
    },
    // formObject: document.getElementById("form"),
    // inputTagObject: document.getElementById("text"),
    date1Object: new Date(),
    date2Object: [0, 1, 2, new Date(), 4, 5],
    mapObject: new Map([["a", "b"]]),
    setObject: new Set(["a", "b"]),
    promiseObject: new Promise((res) => res("ok")),
    blobObject: blob,
    bytesObject: bytes,
    bufferObject: buffer,
    int8ArrayObject: new Int8Array(bytes),
    uint8ArrayObject: new Uint8Array(bytes),
    // streamObject: await blob.stream(),
    nullValue: null,
    undefinedValue: undefined,
    googleAppsScriptClassObject: SpreadsheetApp.getActiveSpreadsheet(),
  };
  return obj[e];
}

HTML и Javascript

<script src="https://cdn.jsdelivr.net/gh/tanaikech/syncGoogleScriptRun@master/syncGoogleScriptRun.min.js"></script>
<input type="button" value="run" onclick="run()" />
<script>
  async function run() {
    const keys = [
      "number1",
      "number2",
      "string1",
      "string2",
      "bool",
      "regex",
      "array1dObject",
      "array2dObject",
      "jsonObject",
      "functionObject",
      "date1Object",
      "date2Object",
      "mapObject",
      "setObject",
      "promiseObject",
      "blobObject",
      "bytesObject",
      "bufferObject",
      "int8ArrayObject",
      "uint8ArrayObject",
      "nullValue",
      "undefinedValue",
      "googleAppsScriptClassObject",
    ];
    const ret = {};
    const err = [];
    const noResponse = [];
    for (let i of keys) {
      const r = await syncGoogleScriptRun({
        gasFunction: "sample2",
        arguments: i,
      }).catch((e) => (err[i] = { error: e.message }));
      if (r) {
        const type = typeof r;
        ret[i] = { response: r, type };
      } else {
        noResponse.push(i);
      }
    }
    const res = keys.reduce((o, k) => ((o[k] = err[k] || ret[k]), o), {});

    console.log(res);
    console.log(err);
    console.log(noResponse);
  }
</script>

Результат

console.log(res)

{
  "number1": { "response": 123, "type": "number" },
  "number2": { "response": {}, "type": "object" },
  "string1": { "response": "sample", "type": "string" },
  "string2": {
    "response": { "0": "s", "1": "a", "2": "m", "3": "p", "4": "l", "5": "e" },
    "type": "object"
  },
  "bool": { "response": true, "type": "boolean" },
  "regex": { "response": {}, "type": "object" },
  "array1dObject": { "response": ["sample"], "type": "object" },
  "array2dObject": { "response": [["sample"]], "type": "object" },
  "jsonObject": { "response": { "key": "value" }, "type": "object" },
  "functionObject": {
    "response": "function () { return \"ok\" }",
    "type": "string"
  },
  "mapObject": { "response": {}, "type": "object" },
  "setObject": { "response": {}, "type": "object" },
  "promiseObject": { "response": "ok", "type": "string" },
  "blobObject": {
    "response": {
      "setName": "function () { [native code] }",
      "setBytes": "function () { [native code] }",
      "getName": "function () { [native code] }",
      "getDataAsString": "function () { [native code] }",
      "getAllBlobs": "function () { [native code] }",
      "setDataFromString": "function () { [native code] }",
      "getBytes": "function () { [native code] }",
      "getAs": "function () { [native code] }",
      "isGoogleType": "function () { [native code] }",
      "getContentType": "function () { [native code] }",
      "toString": "function () { [native code] }",
      "setContentTypeFromExtension": "function () { [native code] }",
      "setContentType": "function () { [native code] }",
      "copyBlob": "function () { [native code] }"
    },
    "type": "object"
  },
  "bytesObject": {
    "response": [115, 97, 109, 112, 108, 101, 32, 116, 101, 120, 116],
    "type": "object"
  },
  "bufferObject": { "response": {}, "type": "object" },
  "int8ArrayObject": {
    "response": {
      "0": 115,
      "1": 97,
      "2": 109,
      "3": 112,
      "4": 108,
      "5": 101,
      "6": 32,
      "7": 116,
      "8": 101,
      "9": 120,
      "10": 116
    },
    "type": "object"
  },
  "uint8ArrayObject": {
    "error": "サーバー エラーが発生しました。しばらくしてからもう一度試してください。"
  }
}

console.log(err)

[]

console.log(noResponse)

[
  "date1Object",
  "date2Object",
  "nullValue",
  "undefinedValue",
  "googleAppsScriptClassObject"
]

Ссылка

Класс google.script.run (Клиентский API)

Новые материалы

Краткое руководство для начинающих по простому сквозному тестированию с помощью Cypress

Автоматизированное тестирование, требующее только базовых навыков JavaScript. Цель этой статьи - показать, как с минимальными усилиями вы можете добавить полезные сквозные (E2E) тесты в свой..

Руководство по быстрой разработке рекомендательной системы промышленного уровня

В этой статье я намерен предоставить краткий обзор методов, которые можно использовать для разработки хорошо работающей рекомендательной системы. Я начал работать над Recommender Systems около 6..

Arshaw FullCalendar для AngularJS — проблемы, с которыми столкнулись, и найденные решения для их устранения

Arshaw FullCalendar — это полноразмерный календарь событий с возможностью перетаскивания, использующий jQuery. Подробнее об этом можно узнать здесь . Директива ui-calendar — это полная..

Простое руководство по Redux для разработчиков React

Понимание строительных блоков Redux Redux — это инструмент управления состоянием, который чаще всего используется с React или React Native. Когда я впервые начал использовать его год назад,..

присоединение к атрисмаркетингу

присоединение к атрисмаркетингу И много дополнительных привилегий. маркетинг — реклама-хорошие отзывы клиентов-доверие-счастье-лояльность и опытные сотрудники устойчивые лесозаготовительные..

КОВАРИАНТНОСТЬ И КОРРЕЛЯЦИЯ

ВВЕДЕНИЕ В этом посте мы обсудим ковариацию и корреляцию. Это играет важную роль при выборе функций. Статистические корреляции говорят нам как о силе связи между двумя переменными, так..

Использование матриц Вигнера в случаях машинного обучения, часть 8

Равномерный локальный закон для матриц Вигнера (arXiv) Автор: Джорджо Чиполлони , Ласло Эрдеш , Доминик Шредер . Аннотация: Мы доказываем общий локальный закон для матриц Вигнера, который..

Метки

Machine Learning JavaScript Data Science Artificial Intelligence Software Development Web Development Python Coding Deep Learning AI React Software Engineering Nodejs Development Data Java NLP Typescript Computer Science Learning Front End Development Algorithms Tutorial Productivity Tech Programming Languages Angular ChatGPT Javascript Development Python Programming CSS Neural Networks Developer Javascript Tips Science React Native Cybersecurity Data Visualization

Отчет: значения для передачи между Javascript и Google Apps Script с помощью google.script.run

1. От HTML к скрипту Google Apps

Переданные значения

Неверные значения

2. От скрипта Google Apps к HTML

Переданные значения

Неверные значения

Краткое содержание

Приложение

Скрипт «От HTML к скрипту Google Apps»

Скрипт Google Apps

HTML и Javascript

Результат

Скрипт «Из сценария Google Apps в HTML»

Скрипт Google Apps

HTML и Javascript

Результат

Ссылка

похожие материалы:

Новые материалы

Краткое руководство для начинающих по простому сквозному тестированию с помощью Cypress

Руководство по быстрой разработке рекомендательной системы промышленного уровня

Arshaw FullCalendar для AngularJS — проблемы, с которыми столкнулись, и найденные решения для их устранения

Простое руководство по Redux для разработчиков React

присоединение к атрисмаркетингу

КОВАРИАНТНОСТЬ И КОРРЕЛЯЦИЯ

Использование матриц Вигнера в случаях машинного обучения, часть 8

Метки