I'm building a simple Slack integration. I've got a web app running on a public URL that is returning json like so when my slash command is called:
{
"text": "<http://lorempixel.com/image_output/animals-q-c-640-480-4.jpg>"
}
If I paste that JSON in to their format testing tool, it shows the image as expected. But, when I actually test the slash command in Slack, where my web app returns the exact same JSON, Slack shows the image url as a link, but doesn't show the image.
Thoughts?
I got it to work with having the image in the text AND attachment:
{
"parse": "full",
"response_type": "in_channel",
"text": "<http://lorempixel.com/image_output/animals-q-c-640-480-4.jpg>",
"attachments": [
{
"image_url": "http://lorempixel.com/image_output/animals-q-c-640-480-4.jpg"
}
],
"unfurl_media": true,
"unfurl_links": true
}
This doesn't appear to jive with the documentation and other examples I've seen, but at least it's working now!
Related
I wrote a task a while back that would run a collect flow and collect an image using the model on the docs for doing so (https://www.twilio.com/docs/autopilot/actions/collect#questions). It ran flawlessly, and I tested it to make sure it ran as expected.
I made a new account using the company email to migrate my work over, and continue implementing the code, and eventually reached the portion where I needed to integrate that media collection. I used the same code, but it didn't work. The collect flow keeps on triggering the validate portion and telling me that it isn't an accepted type. I have tried it using the exact code from before as well as the exact image, but it still isn't working. The only thing I can think of is if the phone number was set up differently somehow. The message logs show the image as sent and looks fine and I can't find any differences other than that.
Is there anything that might be causing this? Here is the code for reference
{
"actions": [
{
"collect": {
"name": "image_collect",
"questions": [
{
"question": "Please upload an image",
"name": "image",
"type": "Twilio.MEDIA",
"validate": {
"on_failure": {
"messages": [
{
"say": "We do not accept this format. Please send another image."
}
]
},
"allowed_types": {
"list": [
"image/jpeg",
"image/gif",
"image/png",
"image/bmp",
"application/pdf"
]
}
}
}
],
"on_complete": {
"redirect": "https://4894-100-33-3-193.ngrok.io/image_processing"
}
}
}
]
}
Generally, media size causes this issue, just make sure the file size is within the limits.
For more info - https://www.twilio.com/docs/sms/accepted-mime-types
I'm using the link_shared events to unfurl links in my workspace, trying to generate a template that is as close to Slack's unfurling template as possible, but I have several issues -
Blocks have very large spacing between them, causing my 3 blocks to take a lot of space
I'm unable to have an image inlined with the text for the title, unless I'm using context, but this is causing the text to be very small.
Taking Slack's example of how link unfurling should look like and trying to mimic it with blocks should explain the differences. This is the blocks message, and here you can see the result as an image
So my main question is - does Slack use some internal blocks formatting not available in the API, or is it possible to achieve the same result?
Thanks a lot!
{
"blocks": [
{
"type": "section",
"text": {
"type": "mrkdwn",
"text": ":pager: *Slack*"
}
},
{
"type": "section",
"text": {
"type": "mrkdwn",
"text": "*<https://slack.com/features|Features>*"
}
},
{
"type": "image",
"title": {
"type": "plain_text",
"text": "Slack is where work flows. It's where the people you need, the information you share, and the tool you use come together to get things done.",
"emoji": true
},
"image_url": "https://a.slack-edge.com/13f94ee/marketing/img/homepage/self-serve-campaign/unfurl/img-unfurl-ss-campaign.jpg",
"alt_text": "Slack"
}
]
}
That example is not using the Slack block unfurl - it's an example of how a generic link would be displayed using the page's meta tags to display some additional information, using the favicon image.
If you wanted to create something similar you could use use a markdown block and an image block (like this) - but the file size would be displayed on a new line rather than after the text.
It took a bit of playing around, but I realized Slack is actually using message attachments (the legacy version of message formatting) in order to generate their link unfurls.
For example, if you want to unfurl a GitHub repository link, this is the payload you should send, and it'll generate an almost identical unfurling to what Slack is generating (a small Added by {app-name} will be added to the footer) -
unfurls["https://github.com/slackapi/bolt-js/"] = {
author_name: "GitHub",
author_icon: "https://a.slack-edge.com/80588/img/unfurl_icons/github.png",
title: "GitHub - slackapi/bolt-js: A framework to build Slack apps using JavaScript",
title_link: "https://github.com/slackapi/bolt-js/",
text: "A framework to build Slack apps using JavaScript. Contribute to slackapi/bolt-js development by creating an account on GitHub.",
image_url: "https://opengraph.githubassets.com/3e06f7eee96f05a53cd4905af3b296dfe333be7a902bb3e6a095770e87fd17fe/slackapi/bolt-js"
}
I have created an outgoing webhook in MS Teams. At mentioning the name specified in the outgoing webhook, it will successfully cause an API call in my app - all fine and good.
According to the documentation, my app is required to respond to that request with a response message. But I absolutely can't find any documentation of the format that is accepted in this response.
The only reference, I can find is this one:
https://learn.microsoft.com/en-us/microsoftteams/platform/webhooks-and-connectors/how-to/add-outgoing-webhook
Unfortunately, it does not go into detail of what such a message can look like. It only gives an example that this would be acceptable:
{
"type": "message",
"text": "This is a reply!"
}
I would however not like to respond with a simple message, but much rather with something more rich formatted like a card or - in some cases a reaction instead of a message.
Is that possible? Is there any documentation, what other responses are acceptable? Are there other types than just "message" that can be returned?
Alright, here's a quick and dirty way to handle things for teams. For some reason this is not documented very clearly, but what teams requires is for the "Card" to be created as an attachment, instead of just getting the response directly.
What I've done is capture the boilerplate required to house the card first:
string TeamsAdaptiveCardBoilerplate =
#"
{
""type"":""message"",
""attachments"":[
{
""contentType"":""application/vnd.microsoft.card.adaptive"",
""contentUrl"":null,
""content"":{
""$schema"":""http://adaptivecards.io/schemas/adaptive-card.json"",
""type"":""AdaptiveCard"",
""version"":""1.2"",
""body"":[
##BODY##
]
}
}
]
}
";
Then, I build the body (usually, this would not be static text, but it serves well as an example)
string AdaptiveCardBody =
#"
{
""type"": ""TextBlock"",
""text"": ""Here is a ninja cat""
},
{
""type"": ""Image"",
""url"": ""http://adaptivecards.io/content/cats/1.png""
}
";
Next I simple swap out the placeholder with the real body:
var jsonPayload1 = TeamsAdaptiveCardBoilerplate.Replace("##BODY##", AdaptiveCardBody);
And finally, return the assembled payload (converted back into an object so the correct response headers get set):
var payload1 = JsonConvert.DeserializeObject(jsonPayload1);
return (ActionResult)new OkObjectResult(payload1);
From there, you should be good to go.
Note:
For convenience, the entirety of the "content" (and not "body") block is what you'd copy/paste into the adaptivecards.io designer. You might refactor the above to reflect that reality if it was important to you.
Could you please try this sample json { "$schema": "adaptivecards.io/schemas/adaptive-card.json", "type": "AdaptiveCard", "version": "1.2", "body": [ { "type": "Image", "url": "c.s-microsoft.com/en-us/CMSImages/…" }, { "type": "TextBlock", "text": "Sample image for Adaptive Card..", "wrap": true } ] }
I searched high and low but couldn't find a solution for this...
I'm designing a basic slack message with link buttons and found that the button will not show in the message when the host contains an 'underscore'...
You can try below example here: https://api.slack.com/docs/messages/builder
{
"text": "some text here...",
"attachments": [
{
"title": "TITLE",
"actions": [
{
"type": "button",
"text": "Link button",
"url": "https://www.some-site.com"
}
]
}
]
}
When you change www.some-site.com to www.some_site.com, the button disappears ...
Any suggestions on how to format the url so that the button shows up? According to the documentation, only the &, < and > characters need to be escaped, correct? I also tried encoding the URL, that didn't help either ... help?
This is a valid response from Slack, since www.some_site.com is not a valid URL.
You can not use underscores in hostnames, where hostname in your example is some-site. You can however use underscores in the label of a URL, so e.g. www_super.some-site.com should work.
Sources:
- https://en.wikipedia.org/wiki/Hostname#Restrictions_on_valid_host_names
- http://domainkeys.sourceforge.net/underscore.html
I am sending the users a slack message with a button through a Slack App. On every click of the button, I generate a new URL.
At the moment, I am able to return the URL back as a message. The user clicks on the message to open the URL in the browser.
Instead of the sending a message back, I want to open the URL directly in the browser using slack API.
How can I accomplish it? I can't seem to find anything in the documentation that does that.
Thanks
PS: Google Drive integration does that already.
It appears Slack introduced this feature recently.
As documented in https://api.slack.com/docs/message-attachments#link_buttons
"actions": [
{
"type": "button",
"text": "Book flights 🛫",
"url": "https://flights.example.com/book/r123456"
}
It's possible to preview in Slack's interactive message builder
Unfortunately slack does not support opening urls from message buttons.
You can monitor what slack is planning on releasing here though: https://trello.com/b/ZnTQyumQ/slack-platform-roadmap-for-developers :)
According to Slack, message attachments is the "old way" of composing messages, which will be deprecated in favour of the new Block Kit API.
I found this example on how to do button links on their docs, using the actions object in the message payload.
I haven't implemented it yet, but you can send the message to a channel in your workspace straight from the docs and try it, and it does open the link in the browser as expected.
Update 04/2022
{
"blocks": [
{
"type": "actions",
"elements": [
{
"type": "button",
"text": {
"type": "plain_text",
"text": "View",
"emoji": true
},
"style": "primary",
"url": "https://flights.example.com/book/r123456"
}
]
}
]
}
Test on Slack Blockit Builder: Link