소개

최근, Discord에서는 드디어 트윗의 매입에 복수장 화상이 대응했네요.
이런 느낌으로 트윗의 URL을 붙이는 것만으로 진짜 Twitter처럼 이미지가 표시되게 되었습니다.

단지, 모바일판에서는 아직 대응하고 있지 않고, 1장째의 화상 밖에 표시되지 않는 것이 유감이군요.
(Android판에서는 당초 대응하고 있었습니다만, 그 후의 업데이트로 미대응이 되었습니다.)

그런데, 이 Embed의 복수 화상 표시 기능, 실은 Webhook를 사용하면 자전으로, 게다가 Twitter 이외의 화상에서도 사용할 수 있는 것 같습니다.
이번은 「 Discord에 Webhook에 다양한 게시 」를 참고로 해, 실제로 시험해 보고 싶습니다.

아래 준비

앞서 소개한 기사를 참고로 채널에 웹 훅을 추가하여 'Advanced REST Client'를 사용할 수 있는 상태로 두십시오.

실험 그 1

이것은 처음 이미지에 찍힌 내 트윗의 내장 데이터를 API로 가져오고 불필요한 데이터를 삭제 한 것입니다.

{
  "embeds": [
    {
      "url": "https://twitter.com/GrapeColorSoft/status/1205289368786620416",
      "description": "複数枚画像投稿テスト",
      "author": {
        "name": "GrapeColor (@GrapeColorSoft)",
        "url": "https://twitter.com/GrapeColorSoft",
        "icon_url": "https://pbs.twimg.com/profile_images/1063236006135062528/493Dm2lD_bigger.jpg"
      },
      "image": {"url": "https://pbs.twimg.com/media/ELoMRwLVUAAFlm_.jpg:large"}
    },
    {
      "url": "https://twitter.com/GrapeColorSoft/status/1205289368786620416",
      "image": {"url": "https://pbs.twimg.com/media/ELoMRwNU8AEMaoO.jpg:large"}
    },
    {
      "url": "https://twitter.com/GrapeColorSoft/status/1205289368786620416",
      "image": {"url": "https://pbs.twimg.com/media/ELoMRwNUwAAWako.jpg:large"}
    },
    {
      "url": "https://twitter.com/GrapeColorSoft/status/1205289368786620416",
      "image": {"url": "https://pbs.twimg.com/media/ELoMRwMU8AELiyj.jpg:large"}
    }
  ]
}

시도해 보려면 "Advanced REST Client"로 Webhook에 보냅니다.

오, 잘했던 것 같습니다. 매개변수를 다소는 좀 했기 때문에, 외형이 조금 다른 것 같습니다만, 복수장의 화상을 표시할 수 있었습니다.
이미 JSON 데이터를 보고 눈치채게 되었을지도 모릅니다만, 실은 이 복수장 이미지, 트윗의 Embed와 이미지만의 Embed 복수로 구성되어 있는 것입니다.
한층 더 주목해 주었으면 하는 것이, url 파라미터의 값에 모두 같은 URL이 지정되고 있는 것을 깨달았을까 생각합니다.
분명히 Discord 내부에서는 같은 URL을 가진 이미지만의 Embed가 나중에 계속되었을 경우, 화면상에서는 1개의 Embed로서 표시하게 되어 있는 것 같습니다.

실험 2

방금 전에는 트윗의 매입을 바탕으로 실험해 보았습니다만, 위의 가설이 맞으면 다른 사이트의 이미지에서도 할 수 있을 것 같네요.
그래서 다른 사이트의 이미지에서 시도해 봅시다.
이번은 내 "pixivFANBOX"에서 실험하고 싶습니다.

{
  "embeds": [
    {
      "title": "GrapeColor｜pixivFANBOX",
      "url": "https://www.pixiv.net/fanbox/creator/2985748",
      "author": {
        "name": "GrapeColor",
        "url": "https://www.pixiv.net/fanbox/creator/2985748",
        "icon_url": "https://pixiv.pximg.net/c/160x160_90_a2_g5/fanbox/public/images/user/2985748/icon/dLL4qL9wsm2FLb1EvNzC64FZ.jpeg"
      },
      "image": {"url": "https://pixiv.pximg.net/fanbox/public/images/creator/2985748/profile/vpwby6SqjUS2Z9M4NFQuahcy.jpeg"}
    },
    {
      "url": "https://www.pixiv.net/fanbox/creator/2985748",
      "image": {"url": "https://pixiv.pximg.net/fanbox/public/images/creator/2985748/profile/WxUeBmOPefmKqFcnUE5z4SNR.jpeg"}
    },
    {
      "url": "https://www.pixiv.net/fanbox/creator/2985748",
      "image": {"url": "https://pixiv.pximg.net/fanbox/public/images/creator/2985748/profile/6NqUWxUgC3WIj0dRp8bQ6Ayt.jpeg"}
    },
    {
      "url": "https://www.pixiv.net/fanbox/creator/2985748",
      "image": {"url": "https://pixiv.pximg.net/fanbox/public/images/creator/2985748/profile/L6sNRGsQz650TreT0DlzDaOR.jpeg"}
    }
  ]
}

조금 이미지의 URL이 길기 때문에 보기 어렵습니다만, 이것을 Webhook에 보내 봅시다.

오, 제대로 표시할 수 있었습니다.
이와 같이, Twitter 이외의 사이트의 URL·이미지에서도 제대로 복수장 표시에 대응할 수 있는 것 같습니다.

요약

트윗의 화상의 복수장 표시하는 기능도, 간단하게 응용할 수 있는 것을 알 수 있을까 생각합니다.
단지 주의해 두고 싶은 것이, 역시 url 파라미터가 일치하고 있는 것이 키가 되어 있는 것 같고, 조금이라도 다르면 다른 Embed로서 인식되어 버립니다.
또, 5장 이상의 화상에는 대응하고 있지 않는 것 같고, 같은 수법으로 5장째 이후를 추가해도 표시되지 않는 것을 알고 있습니다.
그리고 역시 모바일 버전이 대응하지 않는 것이 가장 아프네요 ....

이상, Embed의 복수장 화상 표시에 관한 작은 재료였습니다!