Javascript 如何让Figma API与Google应用程序脚本API配合使用？

我正在考虑使用谷歌应用程序脚本创建一个谷歌幻灯片到Figma exporter。首先，我想将在中创建的形状从google幻灯片发送到figma。我将如何设置我的文件？我不知道如何在Google和Figma之间建立Oauth api通信，或者是否可能

我相信我可以从以下几点开始：

工具书类 菲格玛参考

谷歌应用程序脚本参考

获得Figma形状 创建新的Figma文件# 但是从那里我还想从google应用程序脚本中获取文件id到Figma文件吗

看了之后：我想知道我是否需要创建一个chrome扩展或谷歌幻灯片插件。

这个答案如何

问题和解决方法： 不幸的是，谷歌幻灯片的形状似乎无法放到Figma文件的页面上。因为似乎没有API的方法来放置形状。但人们发现，使用FigmaAPI可以将Figma文件的页面检索为图像

在这个答案中，我想提出一个示例脚本，使用带有访问令牌的Figma API，可以将Figma文件的页面作为图像放到Google幻灯片中。因此，您可以直接将Figma API与Google应用程序脚本一起使用

用法： 1.检索访问令牌 您可以在中查看检索访问令牌的方法。虽然也有OAuth2用于检索访问令牌，但在您的情况下，我认为在站点上直接生成访问令牌的方法可能是合适的。因此，在这个答案中，将使用站点上生成的访问令牌。请按如下方式检索访问令牌

生成个人访问令牌

登录到您的Figma帐户

从Figma中的左上菜单进入帐户设置

查找个人访问令牌部分

单击创建新令牌

将生成一个令牌。这将是您复制令牌的唯一机会，因此请确保将此令牌的副本保存在安全的地方

本次访问令牌的访问令牌是像《代码》一样的，访问令牌的访问令牌是像《代码》一样的，访问令牌是像《代码》一样的的，访问令牌是像《代码》一样的的，访问令牌是像《代码》的方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方方##。在GoogleApps脚本中，授权是通过

标题：{“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幻灯片的每张幻灯片中
• 我认为这个脚本的动作类似于你问题底部的动作

注:

• 这是一个示例脚本。因此，请根据您的实际情况进行修改

参考资料：

---

如果我误解了你的问题，并且这不是你想要的方向，我很抱歉。

你会用它来处理oauth。@Figma的管理员，似乎有两种方法可以检索访问令牌。一个是使用OAuth2进程。另一种是在用户登录的页面上直接生成访问令牌。生成的访问令牌没有过期时间。由此，。在我的回答中，我将后者作为一个示例案例。nice@Tanaike！！！！！你真的认为我只能从Figma那里得到图像并将它们发送到谷歌幻灯片？我将尝试一下，看看它是否有效@感谢您的回复。在当前阶段，似乎虽然可以使用API检索Figma文件中的形状和页面数据，但无法使用API将形状和页面数据放入Figma文件。但这些方法可能会在将来的更新中添加。如果您在阅读API文档时发现了实现后者的方法，请告诉我。我还想检查一下。所以你说的是“没有办法将谷歌幻灯片中的形状转换成svg，然后发送给Figma？”我知道Figma可以使用SVGs@Zachary谢谢你的回复。不幸的是，在当前阶段，似乎没有方法将数据（包括SVG）从外部放入Figma API中的Figma文件页面。我对这种情况深表歉意。当你阅读API文档时，如果你找到了，请告诉我。如果我的回答对你的情况没有帮助，我必须道歉。哎呀，这几乎奏效了。但是我犯了一个错误<代码>此应用未经验证此应用尚未经谷歌验证。只有在了解并信任开发人员的情况下才能继续。

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

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

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