Send MiniProgram in proper format

[treeguard]

Is your feature request related to a problem? Please describe.

1. when sending mini-program, the description is not respected on iPhone but it can be shown on Android phones.
2. How to generate the thumbnail url and thumbnail key for an image?

Describe the solution you'd like

I hope both 1 & 2 can be fixed.

Describe alternatives you've considered A clear and concise description of any alternative solutions or features you've considered.

Additional context Add any other context or screenshots about the feature request here.

[enhancement]

[su-chang]

Thanks for your issue.

For question 1:

Sorry to say that it is not supported now.

For question 2:

Let the bot send a picture which you want to set into mini-program, and then you will get the thumbnailUrl and thumbnailKey when the bot received this picture message in its payload.

So you could set preview image for mini-program as you want.

[treeguard]

Sorry to say that it is not supported now.

Let me know if I can help here!

Let the bot send a picture which you want to set into mini-program, and then you will get the thumbnailUrl and thumbnailKey when the bot received this picture message in its payload.

great idea here! I tried it but failed, I send an image to filehelper and a chatroom using FileBox, but the payload didn't contain the thumbnail, see one example below:

 {"_events":{},"_eventsCount":0,"id":"6580173835062423131","payload":{"filename":"90fa2703db1d5cbc6a41d0b23844eba5.jpg","fromId":"***","id":"6580173835062423131","mentionIdList":[],"roomId":"26210907426@chatroom","text":"<msg><img length=\"404426\" hdlength=\"0\" /><commenturl></commenturl></msg>","timestamp":1597216407000,"toId":"","type":6}}

Code for send image:

const fileBox = FileBox.fromUrl(path)
await room.say(fileBox)

besides I saw "查看原图" option for the message.

However, if I send the image through the phone, I can see the thumbnail, see

{"_events":{},"_eventsCount":0,"id":"3346889900785868509","payload":{"filename":"94fe2e0f18390c4156cc7a3b3b06c1eb.jpg","fromId":"***","id":"3346889900785868509","mentionIdList":[],"roomId":"","text":"<?xml version=\"1.0\"?>\n<msg>\n\t<img aeskey=\"fba58326a8a3c018e199bfdbd76c7062\" encryver=\"0\" cdnthumbaeskey=\"fba58326a8a3c018e199bfdbd76c7062\" cdnthumburl=\"3053020100044c304a0201000204965bfe5402030f5e94020455e0333102045f3396d10425617570696d675f636362666234653962656137383662615f313539373231363436343433380204010c18020201000400\" cdnthumblength=\"5869\" cdnthumbheight=\"120\" cdnthumbwidth=\"80\" cdnmidheight=\"0\" cdnmidwidth=\"0\" cdnhdheight=\"0\" cdnhdwidth=\"0\" cdnmidimgurl=\"3053020100044c304a0201000204965bfe5402030f5e94020455e0333102045f3396d10425617570696d675f636362666234653962656137383662615f313539373231363436343433380204010c18020201000400\" length=\"88871\" md5=\"7289818ceaaf80030d7ccef16c416f3d\" />\n</msg>\n","timestamp":1597216465000,"toId":"filehelper","type":6}}

For this one, I didn't see "查看原图" option.

[su-chang]

Let the bot send a picture

Something wrong here, you can try to send a picture to the bot, I think it's the right way.

[treeguard]

you can try to send a picture to the bot, I think it's the right way.

I already did that. I sent a picture to the bot and I can see the payload with thumbnail info. However, I want to automate the whole process that's why I let the bot send the image to itself. Any idea, why it doesn't work in this way?

[su-chang]

We can not get the cdn data when the bot send picture by api.

So it can not be automated.

[treeguard]

We can not get the cdn data when the bot send picture by api.

I think I finally get the cdn data when sending the image from one bot to the other. However, the thumbnail size is too small for mini-program. The thumbnail length for normal miniprogram is 142285, with 720 width and 577 height. However the cdn I get when sending image is 5177 with 120 height and 80 width. This leads to very blurring image shown on mini-program. Any idea to improve?

[treeguard]

Sorry to say that it is not supported now.

Do we need to add param: sourcedisplayname to support this?

[xiaogua00]

How to generate the thumbnail url and thumbnail key for an image?

message: {"_events":{},"_eventsCount":0,"id":"1012700","payload":{"filename":"","fromId":"7881300500930338","id":"1012700","mentionIdList":[],"roomId":"","text":"","timestamp":1605410456000,"toId":"1688853541504066","type":9}} message: {"_events":{},"_eventsCount":0,"id":"1012703","payload":{"filename":"","fromId":"7881300500930338","id":"1012703","mentionIdList":[],"roomId":"","text":"","timestamp":1605410468000,"toId":"1688853541504066","type":6}}

[su-chang]

@xiaogua00

Step 1

You must received one MiniProgram message which you want to share to others.

Example

if (message.type() === MessageType.MiniProgram) {
  const miniProgramPayload = await message.toMiniProgram()
  console.log(`mini program payload: ${JSON.stringify(miniProgramPayload)}`)
}

Now you can get the thumbKey and thumbUrl.

Step 2

Generate your MiniProgram object, and send it to who you want.

Example

const miniProgram = new MiniProgram({
  appid: "wx2c348cf579062e56",
  description: "美团外卖",
  pagePath: "pages/web-view/web-view.html?redirectUrl=https%3A%2F%2Fi.meituan.com%2Fawp%2Fhfe%2Fblock%2Fa945391288b790d558b7%2F78716%2Findex.html%3Fappkey%3Da144a9fa40a42c55af00214bb4bb3993971%3A4324dingdanxia22880091159T1028133445&sid=4324dingdanxiawaimai",
  thumbKey: "b7eb8c9341b38115b6afe408ea7b05d3",
  iconUrl: "http://mmbiz.qpic.cn/mmbiz_png/IXJic6HOb8QT02PwzH5wCUicpuGmIagaUJLxzGRKtoY8PLQqBR1UDHwK5DpsyRJnQ0OHAFGaA8jweXGUh8RsJpCA/640?wx_fmt=png&wxfrom=200",
  thumbUrl: "3051020100044a304802010002048352ab8802032f56c30204d2570d7002045f4f7f770423777875706c6f61645f796a623633323731353137393734335f313539393034353439350204010400030201000400",
  title: "【美团外卖】第2个领取的人红包最大！",
  username: "gh_72a4eb2d4324@app",
})
message.say(miniProgram)

[treeguard]

@su-chang padplus is not supported anymore, do you think we can prioritize the feature 1 for donut?

feature1: when sending mini-program, the description is not respected on iPhone but it can be shown on Android phones.