Как заставить Figma API работать с Google App-script API?

Я думаю о создании слайдов Google для экспортера Figma с помощью Google App Script. Вначале я хотел бы направить фигуры, созданные в Google Slides, на figma. Как мне настроить свой файл? И я не знаю, как настроить связь Oauth api между Google и Figma и возможно ли это вообще.

Я считаю, что могу начать с:

Ссылки

Ссылка на Figma

https://github.com/figma/plugin-samples/blob/master/react/src/code.ts

справочник по скрипту приложения Google

https://github.com/gsuitedevs/apps-script-samples/blob/master/slides/style/style.gs

Получить Фигму Форму

var file=projectid.key()
var=figma rectangle= file()

  await figma.loadFontAsync({ family: "Roboto", style: "Regular" })
name;


var figmaShape = {
figma.ui.onmessage = msg => {
  if (msg.type === 'create-rectangles') {
    const nodes = []    
        for (let i = 0; i < msg.count; i++) {
      const rect = figma.createRectangle()
      rect.x = i * 150
      rect.fills = [{type: 'SOLID', color: {r: 1, g: 0.5, b: 0}}]
      figma.currentPage.appendChild(rect)
      nodes.push(rect)
    }

    figma.currentPage.selection = nodes
    figma.viewport.scrollAndZoomIntoView(nodes)
  }

  figma.closePlugin()
}
};

Получить форму файла Google Документов

var powerpointfile = driveApp.getFileById = ("### Slide file ID ###")

function powerPointShape = () {
var slide = SlidesApp.getActivePresentation().getSlides()[0];
var shape = slide.insertShape(SlidesApp.ShapeType.TEXT_BOX, 100, 200, 300,
getObjectId.element(SHAPE);
                              };

Создать новый файл Figma #

file.getSlides.shape = (powerPointShape, ) => {
  this.powerPointShape.getRigh()=this.figmaShape(rect.x);
  this.powerPointShape.getleft()=this.figmaShape(rect.y);
}

Но оттуда я также хотел бы получить идентификатор файла из скрипта приложения Google в файл Figma?

и, посмотрев на: https://github.com/alyssaxuu/figma-to-google-slides/blob/master/Chrome%20Extension/background.js, мне интересно, нужно ли мне создать расширение Chrome или плагин Google Slides.

Источник

1 ответ

Решение

Как насчет этого ответа?

Проблема и решение:

К сожалению, кажется, что формы Google Slides не могут быть помещены на страницу файла Figma. Потому что кажется, что нет никаких методов API для размещения фигур. Но было обнаружено, что страницы файла Figma можно получить как изображение с помощью Figma API.

В этом ответе я хотел бы предложить образец сценария, в котором страницы файла Figma могут быть помещены в Google Slides в качестве изображения с помощью API Figma с токеном доступа. Таким образом, вы можете напрямую использовать Figma API с Google Apps Script.

Применение:

1. Получить токен доступа.

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

Создать токен личного доступа

  1. Войдите в свою учетную запись Figma.
  2. Перейдите в настройки учетной записи в верхнем левом меню внутри Figma.
  3. Найдите раздел токенов личного доступа.
  4. Щелкните Создать новый токен.
  5. Будет создан токен. Это будет ваш единственный шанс скопировать токен, поэтому убедитесь, что вы храните его копию в надежном месте.

Токен доступа похож на #####-########-####-####-####-############. В Google Apps Script авторизация выполняетсяheaders: {"X-Figma-Token": accessToken}.

2. Получить ключ файла

Чтобы получить файл Figma с помощью API Figma, требуется ключ файла. Вы можете получить ключ файла из URL-адреса файла.

URL-адрес файла похож на https://www.figma.com/file/###/sampleFilename. В этом случае,### это ключ файла.

3. Запустить скрипт

Пример сценария выглядит следующим образом. Перед запуском скрипта установите переменныеaccessToken а также fileKey.

function myFunction() {
  var accessToken = "###"; // Please set your access token.
  var fileKey = "###"; // Please set the file key.

  var baseUrl = "https://api.figma.com/v1";
  var params = {
    method: "get",
    headers: {"X-Figma-Token": accessToken},
    muteHttpExceptions: true,
  };
  var fileInfo = JSON.parse(UrlFetchApp.fetch(baseUrl + "/files/" + fileKey, params));
  var children = JSON.parse(UrlFetchApp.fetch(baseUrl + "/images/" + fileKey + "?format=jpg&scale=3&ids=" + fileInfo.document.children.map(function(c) {return c.id}).join(","), params));
  if (!children.err) {
    var s = SlidesApp.create("sampleSlide");
    var slide = s.getSlides()[0];
    var keys = Object.keys(children.images);
    keys.forEach(function(c, i) {
      slide.insertImage(children.images[c]);
      if (i != keys.length - 1) slide = s.insertSlide(i + 1);
    })
  } else {
    throw new Error(children);
  }
}
  • когда myFunction() запускается, сначала информация о файле извлекается с помощью ключа файла fileKey. Затем все страницы извлекаются из полученной информации о файле, и полученные страницы помещаются на каждый слайд новых Google Slides.
  • Я думаю, что действие этого сценария похоже на действие сценария, показанного в конце вашего вопроса.

Примечание:

  • Это образец сценария. Поэтому, пожалуйста, измените его для вашей реальной ситуации.

Ссылки:

Если я неправильно понял ваш вопрос и это было не то направление, которое вам нужно, я прошу прощения.

Источник
Другие вопросы по тегам