Dialogflow'da Keşfedin
Dialogflow'daki Yanıt örneğimizi içe aktarmak için Devam'ı tıklayın. Ardından örneği dağıtmak ve test etmek için aşağıdaki adımları uygulayın:
- Bir aracı adı girin ve örnek için yeni bir Dialogflow aracısı oluşturun.
- Temsilcinin içe aktarımı tamamlandıktan sonra Temsilciye git'i tıklayın.
- Ana gezinme menüsünden Karşılama'ya gidin.
- Satır içi düzenleyiciyi etkinleştirin ve ardından Dağıt'ı tıklayın. Düzenleyici, örnek kodu içerir.
- Ana gezinme menüsünden Entegrasyonlar'a gidin ve Google Asistan'ı tıklayın.
- Görünen mod penceresinde Değişiklikleri otomatik önizle'yi etkinleştirin ve Test et'i tıklayarak Actions simülatörünü açın.
- Simülatörde, örneği test etmek için
Talk to my test appyazın.
İşleminizle kullanıcı etkileşimlerini iyileştirmek için görsel öğeler görüntülemek istiyorsanız zengin yanıt kullanın. Bu görsel öğeler, görüşmeye nasıl devam edileceğine dair ipuçları sağlayabilir.
Zengin yanıtlar yalnızca ekran veya ses ve ekran deneyimlerinde görünebilir. Aşağıdaki bileşenleri içerebilir:
- Bir veya iki basit yanıt (sohbet balonları).
- İsteğe bağlı bir temel kart.
- İsteğe bağlı öneri çipleri.
- İsteğe bağlı bağlantı çipi.
Bu görsel öğeleri İşleminize nasıl ekleyeceğinizi öğrenmek için görüşme tasarımı yönergelerimizi de inceleyebilirsiniz.
Özellikler
Zengin yanıtlar aşağıdaki gereksinimleri ve yapılandırabileceğiniz isteğe bağlı özellikleri içerir:
actions.capability.SCREEN_OUTPUTözelliği olan yüzeylerde desteklenir.- Zengin yanıttaki ilk öğe, basit bir yanıt olmalıdır.
- En fazla iki basit yanıt.
- En fazla bir temel kart veya
StructuredResponse. - En fazla 8 öneri çipi.
FinalResponseiçinde öneri çiplerine izin verilmez- Akıllı ekranlardan web'e bağlantı şu anda desteklenmiyor.
Aşağıdaki bölümlerde, farklı türde zengin yanıtları nasıl oluşturacağınız gösterilmektedir.
Temel kart
Temel kart aşağıdakileri içerebilir bilgileri gösterir:
- Resim
- Başlık
- Alt başlık
- Metin gövdesi
- Bağlan Düğmesi
- Sınır
Temel kartları sadece görüntüleme amaçlı olarak kullanın. Bunlar, kullanıcılara kısa ve öz bilgiler sunmak, ayrıca tercih ettiğiniz takdirde (bir web bağlantısı kullanarak) kullanıcıların daha fazla bilgi edinmesini sağlamak için kısa ve öz olacak şekilde tasarlanmıştır.
Çoğu durumda görüşmeyi devam ettirmek veya özetlemek için kartların altına öneri çipleri eklemeniz gerekir.
Kart balonundaki bilgilerde sohbet balonunun hiçbir ücret ödemeden tekrarlanmasını önleyin.
Özellikler
Temel kart yanıtı türünde yapılandırabileceğiniz aşağıdaki koşullar ve isteğe bağlı özellikler vardır:
actions.capability.SCREEN_OUTPUTözelliği olan yüzeylerde desteklenir.- Biçimlendirilmiş metin (resim yoksa gereklidir)
- Varsayılan olarak düz metindir.
- Bağlantı içermemelidir.
- Resim içeren 10 satır sınırı ve resimsiz 15 satır sınırı. Yaklaşık 500 (resimli) veya 750 (resimsiz) karakterden oluşur. Küçük ekranlı telefonlar da metinleri daha büyük ekranlı telefonlardan daha önce kısaltır. Metin çok fazla satır içeriyorsa sonuncu kelime sonunda üç nokta ile kısaltılır.
- Markdown'ın sınırlı bir alt kümesi desteklenir:
- Çift satırlı yeni satır ve ardından \n
**bold***italics*
- Resim (biçimlendirilmiş metin yoksa gereklidir)
- Tüm resimler 192 dp yüksekliğinde olmaya zorlandı.
- En boy oranı ekrandan farklıysa resim dikey veya yatay kenarlarda gri çubuklarla ortalanır.
- Resim kaynağı bir URL.
- Hareketli GIF'lere izin verilir.
İsteğe bağlı
- Başlık
- Düz metin.
- Sabit yazı tipi ve boyut.
- En fazla bir satır; fazladan karakterler kesilir.
- Başlık belirtilmezse kart yüksekliği daraltılır.
- Alt başlık
- Düz metin.
- Sabit yazı tipi ve yazı tipi boyutu.
- En fazla bir satır; fazladan karakterler kesilir.
- Altyazı belirtilmediyse kart yüksekliği daraltılır.
- Bağlantı düğmesi
- Bağlantı başlığı gerekli
- En fazla bir bağlantı
- Geliştiricinin alanı dışındaki sitelere yönlendiren bağlantılara izin verilir.
- Bağlantı metni yanıltıcı olamaz. Bu işlem, onay işleminde kontrol edilir.
- Temel kartlarda, bağlantı olmadan etkileşim özellikleri yoktur. Bağlantıya dokunulduğunda kullanıcıya bağlantı gönderilir ve kartın ana gövdesi devre dışı kalır.
- Kenarlık
- Kart ile resim kapsayıcısı arasındaki kenarlık, temel kartınızın sunumunu özelleştirmek için ayarlanabilir.
- JSON dizesi özelliğinin ayarlanmasıyla yapılandırılır
imageDisplayOptions
Örnek kod
Node.js
app.intent('Basic Card', (conv) => {
if (!conv.screen) {
conv.ask('Sorry, try this on a screen device or select the ' +
'phone surface in the simulator.');
conv.ask('Which response would you like to see next?');
return;
}
conv.ask(`Here's an example of a basic card.`);
conv.ask(new BasicCard({
text: `This is a basic card. Text in a basic card can include "quotes" and
most other unicode characters including emojis. Basic cards also support
some markdown formatting like *emphasis* or _italics_, **strong** or
__bold__, and ***bold itallic*** or ___strong emphasis___ as well as other
things like line \nbreaks`, // Note the two spaces before '\n' required for
// a line break to be rendered in the card.
subtitle: 'This is a subtitle',
title: 'Title: this is a title',
buttons: new Button({
title: 'This is a button',
url: 'https://assistant.google.com/',
}),
image: new Image({
url: 'https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png',
alt: 'Image alternate text',
}),
display: 'CROPPED',
}));
conv.ask('Which response would you like to see next?');
});
Java
@ForIntent("Basic Card")
public ActionResponse basicCard(ActionRequest request) {
ResponseBuilder responseBuilder = getResponseBuilder(request);
if (!request.hasCapability(Capability.SCREEN_OUTPUT.getValue())) {
return responseBuilder
.add("Sorry, try ths on a screen device or select the phone surface in the simulator.")
.add("Which response would you like to see next?")
.build();
}
// Prepare formatted text for card
String text =
"This is a basic card. Text in a basic card can include \"quotes\" and\n"
+ " most other unicode characters including emoji \uD83D\uDCF1. Basic cards also support\n"
+ " some markdown formatting like *emphasis* or _italics_, **strong** or\n"
+ " __bold__, and ***bold itallic*** or ___strong emphasis___ as well as other\n"
+ " things like line \\nbreaks"; // Note the two spaces before '\n' required for
// a line break to be rendered in the card.
responseBuilder
.add("Here's an example of a basic card.")
.add(
new BasicCard()
.setTitle("Title: this is a title")
.setSubtitle("This is a subtitle")
.setFormattedText(text)
.setImage(
new Image()
.setUrl(
"https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png")
.setAccessibilityText("Image alternate text"))
.setImageDisplayOptions("CROPPED")
.setButtons(
new ArrayList<Button>(
Arrays.asList(
new Button()
.setTitle("This is a Button")
.setOpenUrlAction(
new OpenUrlAction().setUrl("https://assistant.google.com"))))))
.add("Which response would you like to see next?");
return responseBuilder.build();
}
Node.js
if (!conv.screen) {
conv.ask('Sorry, try this on a screen device or select the ' +
'phone surface in the simulator.');
conv.ask('Which response would you like to see next?');
return;
}
conv.ask(`Here's an example of a basic card.`);
conv.ask(new BasicCard({
text: `This is a basic card. Text in a basic card can include "quotes" and
most other unicode characters including emojis. Basic cards also support
some markdown formatting like *emphasis* or _italics_, **strong** or
__bold__, and ***bold itallic*** or ___strong emphasis___ as well as other
things like line \nbreaks`, // Note the two spaces before '\n' required for
// a line break to be rendered in the card.
subtitle: 'This is a subtitle',
title: 'Title: this is a title',
buttons: new Button({
title: 'This is a button',
url: 'https://assistant.google.com/',
}),
image: new Image({
url: 'https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png',
alt: 'Image alternate text',
}),
display: 'CROPPED',
}));
conv.ask('Which response would you like to see next?');
Java
ResponseBuilder responseBuilder = getResponseBuilder(request);
if (!request.hasCapability(Capability.SCREEN_OUTPUT.getValue())) {
return responseBuilder
.add("Sorry, try ths on a screen device or select the phone surface in the simulator.")
.add("Which response would you like to see next?")
.build();
}
// Prepare formatted text for card
String text =
"This is a basic card. Text in a basic card can include \"quotes\" and\n"
+ " most other unicode characters including emoji \uD83D\uDCF1. Basic cards also support\n"
+ " some markdown formatting like *emphasis* or _italics_, **strong** or\n"
+ " __bold__, and ***bold itallic*** or ___strong emphasis___ as well as other\n"
+ " things like line \\nbreaks"; // Note the two spaces before '\n' required for
// a line break to be rendered in the card.
responseBuilder
.add("Here's an example of a basic card.")
.add(
new BasicCard()
.setTitle("Title: this is a title")
.setSubtitle("This is a subtitle")
.setFormattedText(text)
.setImage(
new Image()
.setUrl(
"https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png")
.setAccessibilityText("Image alternate text"))
.setImageDisplayOptions("CROPPED")
.setButtons(
new ArrayList<Button>(
Arrays.asList(
new Button()
.setTitle("This is a Button")
.setOpenUrlAction(
new OpenUrlAction().setUrl("https://assistant.google.com"))))))
.add("Which response would you like to see next?");
return responseBuilder.build();
JSON
Aşağıdaki JSON'in bir webhook yanıtını açıkladığını unutmayın.
{
"payload": {
"google": {
"expectUserResponse": true,
"richResponse": {
"items": [
{
"simpleResponse": {
"textToSpeech": "Here's an example of a basic card."
}
},
{
"basicCard": {
"title": "Title: this is a title",
"subtitle": "This is a subtitle",
"formattedText": "This is a basic card. Text in a basic card can include \"quotes\" and\n most other unicode characters including emojis. Basic cards also support\n some markdown formatting like *emphasis* or _italics_, **strong** or\n __bold__, and ***bold itallic*** or ___strong emphasis___ as well as other\n things like line \nbreaks",
"image": {
"url": "https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png",
"accessibilityText": "Image alternate text"
},
"buttons": [
{
"title": "This is a button",
"openUrlAction": {
"url": "https://assistant.google.com/"
}
}
],
"imageDisplayOptions": "CROPPED"
}
},
{
"simpleResponse": {
"textToSpeech": "Which response would you like to see next?"
}
}
]
}
}
}
}
JSON
Aşağıdaki JSON'in bir webhook yanıtını açıkladığını unutmayın.
{
"expectUserResponse": true,
"expectedInputs": [
{
"possibleIntents": [
{
"intent": "actions.intent.TEXT"
}
],
"inputPrompt": {
"richInitialPrompt": {
"items": [
{
"simpleResponse": {
"textToSpeech": "Here's an example of a basic card."
}
},
{
"basicCard": {
"title": "Title: this is a title",
"subtitle": "This is a subtitle",
"formattedText": "This is a basic card. Text in a basic card can include \"quotes\" and\n most other unicode characters including emojis. Basic cards also support\n some markdown formatting like *emphasis* or _italics_, **strong** or\n __bold__, and ***bold itallic*** or ___strong emphasis___ as well as other\n things like line \nbreaks",
"image": {
"url": "https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png",
"accessibilityText": "Image alternate text"
},
"buttons": [
{
"title": "This is a button",
"openUrlAction": {
"url": "https://assistant.google.com/"
}
}
],
"imageDisplayOptions": "CROPPED"
}
},
{
"simpleResponse": {
"textToSpeech": "Which response would you like to see next?"
}
}
]
}
}
}
]
}
Göz atma bandı
Göz atma bandı, kullanıcıların bir koleksiyonu dikey olarak kaydırmasına ve kartlar seçmesine olanak tanıyan zengin bir yanıttır. Göz atma bantları, seçilen bloku bir web tarayıcısında (veya tüm kutular AMP özelliklise bir AMP tarayıcıda) açarak web içeriği için özel olarak tasarlanmıştır. Göz atma bandı, daha sonra göz atmak için kullanıcının Asistan yüzeyinde de kalır.
Özellikler
Tarama bandı yanıt türünün yapılandırabileceği aşağıdaki koşullar ve isteğe bağlı özellikler vardır:
- Hem
actions.capability.SCREEN_OUTPUThem deactions.capability.WEB_BROWSERözelliğine sahip yüzeylerde desteklenir. Bu yanıt türü şu anda akıllı ekranlarda kullanılamıyor. - Göz atma bandı
- En fazla on karo.
- En az iki karo.
- Banttaki tüm parçalar web içeriğine bağlantı vermelidir (AMP içeriği önerilir).
- Kullanıcının AMP görüntüleyiciye götürülebilmesi için AMP içerik bloklarındaki
urlHintType"AMP_CONTENT" olarak ayarlanmalıdır.
- Kullanıcının AMP görüntüleyiciye götürülebilmesi için AMP içerik bloklarındaki
- Bant karolarına göz atma
- Karo tutarlılığı (gerekli):
- Göz atma bandındaki tüm karolar aynı bileşenlere sahip olmalıdır. Örneğin, bir karoda resim alanı varsa banttaki diğer karolarda da resim alanları olmalıdır.
- Göz atma bandındaki tüm kutular AMP özellikli içeriğe bağlantı verirse kullanıcı, ek işlevlere sahip bir AMP tarayıcısına yönlendirilir. Herhangi bir kutu AMP olmayan içeriğe bağlantı veriyorsa tüm öğeler kullanıcıları bir web tarayıcısına yönlendirir.
- Resim (isteğe bağlı)
- Resim 128 dp yüksekliğinde ve 232 dp genişliğinde olmalıdır.
- Resmin en boy oranı resim sınırlayıcı kutusuyla eşleşmiyorsa resim her iki tarafta da çubuklarla ortalanır. Akıllı telefonlarda resim, köşeleri yuvarlatılmış şekilde ortalanır.
- Bir resim bağlantısı bozuksa bunun yerine bir yer tutucu resim kullanılır.
- Resimlerde alternatif metin kullanımı zorunludur.
- Başlık (zorunlu)
- Temel metin kartıyla aynı biçimlendirme seçenekleri.
- Başlıklar benzersiz olmalıdır (ses seçimini desteklemek için).
- En fazla iki satır metin.
- Yazı tipi boyutu 16 sp.
- Açıklama (isteğe bağlı)
- Temel metin kartıyla aynı biçimlendirme seçenekleri.
- En fazla dört satır metin.
- Üç nokta ile kısaltılır (...)
- Yazı tipi boyutu 14 sp, gri renk.
- Altbilgi (isteğe bağlı)
- Sabit yazı tipi ve yazı tipi boyutu.
- Bir metin satırı en fazla olabilir.
- Üç nokta ile kısaltılır (...)
- Alta sabitlenir. Böylece, daha az gövde metni içeren kutular, alt metnin üzerinde beyaz alan içerebilir.
- Yazı tipi boyutu 14 sp, gri renk.
- Karo tutarlılığı (gerekli):
- Etkileşim
- Kullanıcı, öğeleri görüntülemek için ekranı dikey olarak kaydırabilir.
- Dokunma kartı: Bir öğeye dokunulduğunda, kullanıcı bir sayfaya yönlendirilir ve bağlantılı sayfayı görüntüler.
- Ses girişi
- Mikrofon davranışı
- Kullanıcıya göz atma bandı gönderildiğinde mikrofon yeniden açılmaz.
- Kullanıcı, mikrofona tekrar dokunarak veya Asistan'ı ("Ok Google") çağırarak mikrofonu yeniden açabilir.
- Mikrofon davranışı
Yönerge
Göz atma bandı gönderildikten sonra mikrofon varsayılan olarak kapalı kalır. Görüşmeye daha sonra devam etmek isterseniz bandın altına öneri çipleri eklemenizi önemle tavsiye ederiz.
Listede gösterilen seçenekleri hiçbir zaman öneri çipi olarak belirtme. Bu bağlamdaki çipler, görüşmeyi yönlendirmek için kullanılır (seçim seçimi için değil).
Listelerde olduğu gibi, bant bandına eşlik eden sohbet balonu da sesin bir alt kümesidir (TTS/SSML). Buradaki ses (TTS/SSML), banttaki ilk parçayı entegre eder. Ayrıca, banttaki tüm öğelerin okunmasını kesinlikle önermeyiz. İlk öğeyi ve neden burada olduğunu (örneğin, en popüler, en son satın alınan, en çok konuşulan) bahsetmek en iyisidir.
Örnek kod
Node.js
app.intent('Browsing Carousel', (conv) => {
if (!conv.screen
|| !conv.surface.capabilities.has('actions.capability.WEB_BROWSER')) {
conv.ask('Sorry, try this on a phone or select the ' +
'phone surface in the simulator.');
conv.ask('Which response would you like to see next?');
return;
}
conv.ask(`Here's an example of a browsing carousel.`);
conv.ask(new BrowseCarousel({
items: [
new BrowseCarouselItem({
title: 'Title of item 1',
url: 'https://example.com',
description: 'Description of item 1',
image: new Image({
url: 'https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png',
alt: 'Image alternate text',
}),
footer: 'Item 1 footer',
}),
new BrowseCarouselItem({
title: 'Title of item 2',
url: 'https://example.com',
description: 'Description of item 2',
image: new Image({
url: 'https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png',
alt: 'Image alternate text',
}),
footer: 'Item 2 footer',
}),
],
}));
});
Java
@ForIntent("Browsing Carousel")
public ActionResponse browseCarousel(ActionRequest request) {
ResponseBuilder responseBuilder = getResponseBuilder(request);
if (!request.hasCapability(Capability.SCREEN_OUTPUT.getValue())
|| !request.hasCapability(Capability.WEB_BROWSER.getValue())) {
return responseBuilder
.add("Sorry, try this on a phone or select the phone surface in the simulator.")
.add("Which response would you like to see next?")
.build();
}
responseBuilder
.add("Here's an example of a browsing carousel.")
.add(
new CarouselBrowse()
.setItems(
new ArrayList<CarouselBrowseItem>(
Arrays.asList(
new CarouselBrowseItem()
.setTitle("Title of item 1")
.setDescription("Description of item 1")
.setOpenUrlAction(new OpenUrlAction().setUrl("https://example.com"))
.setImage(
new Image()
.setUrl(
"https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png")
.setAccessibilityText("Image alternate text"))
.setFooter("Item 1 footer"),
new CarouselBrowseItem()
.setTitle("Title of item 2")
.setDescription("Description of item 2")
.setOpenUrlAction(new OpenUrlAction().setUrl("https://example.com"))
.setImage(
new Image()
.setUrl(
"https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png")
.setAccessibilityText("Image alternate text"))
.setFooter("Item 2 footer")))));
return responseBuilder.build();
}
Node.js
if (!conv.screen
|| !conv.surface.capabilities.has('actions.capability.WEB_BROWSER')) {
conv.ask('Sorry, try this on a phone or select the ' +
'phone surface in the simulator.');
conv.ask('Which response would you like to see next?');
return;
}
conv.ask(`Here's an example of a browsing carousel.`);
conv.ask(new BrowseCarousel({
items: [
new BrowseCarouselItem({
title: 'Title of item 1',
url: 'https://example.com',
description: 'Description of item 1',
image: new Image({
url: 'https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png',
alt: 'Image alternate text',
}),
footer: 'Item 1 footer',
}),
new BrowseCarouselItem({
title: 'Title of item 2',
url: 'https://example.com',
description: 'Description of item 2',
image: new Image({
url: 'https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png',
alt: 'Image alternate text',
}),
footer: 'Item 2 footer',
}),
],
}));
Java
ResponseBuilder responseBuilder = getResponseBuilder(request);
if (!request.hasCapability(Capability.SCREEN_OUTPUT.getValue())
|| !request.hasCapability(Capability.WEB_BROWSER.getValue())) {
return responseBuilder
.add("Sorry, try this on a phone or select the phone surface in the simulator.")
.add("Which response would you like to see next?")
.build();
}
responseBuilder
.add("Here's an example of a browsing carousel.")
.add(
new CarouselBrowse()
.setItems(
new ArrayList<CarouselBrowseItem>(
Arrays.asList(
new CarouselBrowseItem()
.setTitle("Title of item 1")
.setDescription("Description of item 1")
.setOpenUrlAction(new OpenUrlAction().setUrl("https://example.com"))
.setImage(
new Image()
.setUrl(
"https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png")
.setAccessibilityText("Image alternate text"))
.setFooter("Item 1 footer"),
new CarouselBrowseItem()
.setTitle("Title of item 2")
.setDescription("Description of item 2")
.setOpenUrlAction(new OpenUrlAction().setUrl("https://example.com"))
.setImage(
new Image()
.setUrl(
"https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png")
.setAccessibilityText("Image alternate text"))
.setFooter("Item 2 footer")))));
return responseBuilder.build();
JSON
Aşağıdaki JSON'in bir webhook yanıtını açıkladığını unutmayın.
{
"payload": {
"google": {
"expectUserResponse": true,
"richResponse": {
"items": [
{
"simpleResponse": {
"textToSpeech": "Here's an example of a browsing carousel."
}
},
{
"carouselBrowse": {
"items": [
{
"title": "Title of item 1",
"openUrlAction": {
"url": "https://example.com"
},
"description": "Description of item 1",
"footer": "Item 1 footer",
"image": {
"url": "https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png",
"accessibilityText": "Image alternate text"
}
},
{
"title": "Title of item 2",
"openUrlAction": {
"url": "https://example.com"
},
"description": "Description of item 2",
"footer": "Item 2 footer",
"image": {
"url": "https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png",
"accessibilityText": "Image alternate text"
}
}
]
}
}
]
}
}
}
}
JSON
Aşağıdaki JSON'in bir webhook yanıtını açıkladığını unutmayın.
{
"expectUserResponse": true,
"expectedInputs": [
{
"inputPrompt": {
"richInitialPrompt": {
"items": [
{
"simpleResponse": {
"textToSpeech": "Here's an example of a browsing carousel."
}
},
{
"carouselBrowse": {
"items": [
{
"description": "Description of item 1",
"footer": "Item 1 footer",
"image": {
"accessibilityText": "Image alternate text",
"url": "https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png"
},
"openUrlAction": {
"url": "https://example.com"
},
"title": "Title of item 1"
},
{
"description": "Description of item 2",
"footer": "Item 2 footer",
"image": {
"accessibilityText": "Image alternate text",
"url": "https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png"
},
"openUrlAction": {
"url": "https://example.com"
},
"title": "Title of item 2"
}
]
}
}
]
}
},
"possibleIntents": [
{
"intent": "actions.intent.TEXT"
}
]
}
]
}
Seçili öğe işleniyor
Bant, tarayıcının aktarımını hallettiği için göz atma bandı öğeleriyle kullanıcı etkileşimleri için takip zorunluluğunun karşılanması gerekmez. Kullanıcı bir bant bandıyla etkileşimde bulunduktan sonra mikrofonun yeniden açılmayacağını unutmayın. Bu nedenle, yukarıdaki talimatlara göre görüşmeyi sonlandırmanız veya yanıtınıza öneri çiplerini eklemeniz gerekir.
Öneri çipleri
Görüşmeye devam etmek veya görüşmenin yönünü değiştirmek için öneri çiplerini kullanabilirsiniz. Görüşme sırasında birincil harekete geçirici mesaj varsa bunu ilk öneri çipi olarak listeleyin.
Mümkün olduğunda, sohbet balonunun bir parçası olarak tek bir temel öneri eklemeniz gerekir ancak bunu, yalnızca yanıt veya sohbetteki konuşmanın doğal olduğu durumlarda yapmalısınız.
Özellikler
Öneri çipleri, yapılandırabileceğiniz aşağıdaki şartlara ve isteğe bağlı özelliklere sahiptir:
actions.capability.SCREEN_OUTPUTözelliği olan yüzeylerde desteklenir.- Öneri çiplerini web'e bağlamak için yüzeylerin
actions.capability.WEB_BROWSERözelliği de olmalıdır. Bu özellik şu anda akıllı ekranlarda kullanılamıyor. - En fazla sekiz çip.
- Maksimum 25 karakter uzunluğunda metin.
Yalnızca düz metin desteklenir.
Örnek kod
Node.js
app.intent('Suggestion Chips', (conv) => {
if (!conv.screen) {
conv.ask('Chips can be demonstrated on screen devices.');
conv.ask('Which response would you like to see next?');
return;
}
conv.ask('These are suggestion chips.');
conv.ask(new Suggestions('Suggestion 1'));
conv.ask(new Suggestions(['Suggestion 2', 'Suggestion 3']));
conv.ask(new LinkOutSuggestion({
name: 'Suggestion Link',
url: 'https://assistant.google.com/',
}));
conv.ask('Which type of response would you like to see next?'); ;
});
Java
@ForIntent("Suggestion Chips")
public ActionResponse suggestionChips(ActionRequest request) {
ResponseBuilder responseBuilder = getResponseBuilder(request);
if (!request.hasCapability(Capability.SCREEN_OUTPUT.getValue())) {
return responseBuilder
.add("Sorry, try ths on a screen device or select the phone surface in the simulator.")
.add("Which response would you like to see next?")
.build();
}
responseBuilder
.add("These are suggestion chips.")
.addSuggestions(new String[] {"Suggestion 1", "Suggestion 2", "Suggestion 3"})
.add(
new LinkOutSuggestion()
.setDestinationName("Suggestion Link")
.setUrl("https://assistant.google.com/"))
.add("Which type of response would you like to see next?");
return responseBuilder.build();
}
Node.js
if (!conv.screen) {
conv.ask('Chips can be demonstrated on screen devices.');
conv.ask('Which response would you like to see next?');
return;
}
conv.ask('These are suggestion chips.');
conv.ask(new Suggestions('Suggestion 1'));
conv.ask(new Suggestions(['Suggestion 2', 'Suggestion 3']));
conv.ask(new LinkOutSuggestion({
name: 'Suggestion Link',
url: 'https://assistant.google.com/',
}));
conv.ask('Which type of response would you like to see next?');
Java
ResponseBuilder responseBuilder = getResponseBuilder(request);
if (!request.hasCapability(Capability.SCREEN_OUTPUT.getValue())) {
return responseBuilder
.add("Sorry, try ths on a screen device or select the phone surface in the simulator.")
.add("Which response would you like to see next?")
.build();
}
responseBuilder
.add("These are suggestion chips.")
.addSuggestions(new String[] {"Suggestion 1", "Suggestion 2", "Suggestion 3"})
.add(
new LinkOutSuggestion()
.setDestinationName("Suggestion Link")
.setUrl("https://assistant.google.com/"))
.add("Which type of response would you like to see next?");
return responseBuilder.build();
JSON
Aşağıdaki JSON'in bir webhook yanıtını açıkladığını unutmayın.
{
"payload": {
"google": {
"expectUserResponse": true,
"richResponse": {
"items": [
{
"simpleResponse": {
"textToSpeech": "These are suggestion chips."
}
},
{
"simpleResponse": {
"textToSpeech": "Which type of response would you like to see next?"
}
}
],
"suggestions": [
{
"title": "Suggestion 1"
},
{
"title": "Suggestion 2"
},
{
"title": "Suggestion 3"
}
],
"linkOutSuggestion": {
"destinationName": "Suggestion Link",
"url": "https://assistant.google.com/"
}
}
}
}
}
JSON
Aşağıdaki JSON'in bir webhook yanıtını açıkladığını unutmayın.
{
"expectUserResponse": true,
"expectedInputs": [
{
"possibleIntents": [
{
"intent": "actions.intent.TEXT"
}
],
"inputPrompt": {
"richInitialPrompt": {
"items": [
{
"simpleResponse": {
"textToSpeech": "These are suggestion chips."
}
},
{
"simpleResponse": {
"textToSpeech": "Which type of response would you like to see next?"
}
}
],
"suggestions": [
{
"title": "Suggestion 1"
},
{
"title": "Suggestion 2"
},
{
"title": "Suggestion 3"
}
],
"linkOutSuggestion": {
"destinationName": "Suggestion Link",
"url": "https://assistant.google.com/"
}
}
}
}
]
}
Medya yanıtları
Medya yanıtları, Actions'ın 240 saniyelik SSML sınırından daha uzun bir oynatma süresine sahip ses içeriği oynatmasına olanak tanır. Bir medya yanıtının birincil bileşeni, tek parçalı karttır. Kart, kullanıcının şu işlemleri gerçekleştirmesine olanak tanır:
- Son 10 saniyeyi tekrar oynat.
- 30 saniye boyunca ileri atla.
- Medya içeriğinin toplam uzunluğunu görüntüleyin.
- Ses çalma için ilerleme durumu göstergesini görüntüleyin.
- Geçen oynatma süresini görüntüleyin.
Medya yanıtları, sesli etkileşim için aşağıdaki ses kontrollerini destekler:
- "Ok Google, oyna."
- "Ok Google, duraklat."
- "Ok Google, durdur."
- "Ok Google, baştan başla."
Ayrıca kullanıcılar, "Ok Google, sesi aç." veya "Ok Google, ses seviyesini yüzde 50'ye ayarla" gibi ifadeler kullanarak ses seviyesini de kontrol edebilir. İşleminizdeki amaçlar, benzer eğitim ifadelerini ele alırsa öncelikli olur. İşleminizin belirli bir nedeni yoksa Asistan'ın bu kullanıcı isteklerini işlemesine izin verin.
Özellikler
Medya yanıtları, aşağıdaki gereksinimleri ve yapılandırabileceğiniz isteğe bağlı özellikleri içerir:
actions.capability.MEDIA_RESPONSE_AUDIOözelliğine sahip yüzeylerde desteklenir.- Çalma sesinin doğru biçimlendirilmiş bir
.mp3dosyası olması gerekir. Canlı yayın desteklenmez. - Oynatmaya ilişkin medya dosyası bir HTTPS URL'si olarak belirtilmelidir.
- Resim (isteğe bağlı)
- İsteğe bağlı olarak bir simge veya resim ekleyebilirsiniz.
- Simge
- Simgeniz, medya oynatıcı kartının sağında kenarlıksız bir küçük resim olarak görünür.
- Boyut 36 x 36 dp olmalıdır. Daha büyük boyutlu resimler sığacak şekilde yeniden boyutlandırılır.
- Resim
- Görüntü kapsayıcısının yüksekliği 192 dp olur.
- Resminiz, medya oynatıcı kartının üst kısmında görünür ve kartın tüm genişliğini kapsar. Çoğu resim, üst veya yan taraflarda çubuklarla görünür.
- Hareketli GIF'lere izin verilir.
- Resim kaynağını URL olarak belirtmeniz gerekir.
- Tüm resimlerde alternatif metin gereklidir.
Yüzeylerdeki davranış
Medya yanıtları, Android telefonlarda ve Google Home'da desteklenir. Medya yanıtlarının davranışı, kullanıcıların İşlemlerinizle etkileşimde bulunduğu yüzeye bağlıdır.
Android telefonlarda, kullanıcılar aşağıdaki koşullardan herhangi biri karşılandığında medya yanıtlarını görebilir:
- Google Asistan ön planda ve telefon ekranı açık.
- Kullanıcı, ses çalarken Google Asistan'dan çıkar ve oynatıldıktan 10 dakika sonra Google Asistan'a döner. Google Asistan'a döndüğünde kullanıcı, medya kartını ve öneri çiplerini görür.
- Asistan, "sesi artır" veya "ses seviyesini yüzde 50'ye ayarla" gibi şeyler söyleyerek kullanıcıların konuşma etkinliğinizdeki cihaz ses seviyesini kontrol etmelerine olanak tanır. Benzer eğitim ifadelerini yöneten niyetleriniz varsa amaçlarınız öncelikli olur. İşleminizin belirli bir nedeni yoksa Asistan'ın bu kullanıcı isteklerini işlemesine izin vermenizi öneririz.
Medya denetimleri, telefon kilitliyken kullanılabilir. Android'de kontroller, bildirim alanında da görünür.
Örnek kod
Aşağıdaki kod örneğinde, rich media'nızı medya içerecek şekilde nasıl güncelleyebileceğinizi görebilirsiniz.
Node.js
app.intent('Media Response', (conv) => {
if (!conv.surface.capabilities
.has('actions.capability.MEDIA_RESPONSE_AUDIO')) {
conv.ask('Sorry, this device does not support audio playback.');
conv.ask('Which response would you like to see next?');
return;
}
conv.ask('This is a media response example.');
conv.ask(new MediaObject({
name: 'Jazz in Paris',
url: 'https://storage.googleapis.com/automotive-media/Jazz_In_Paris.mp3',
description: 'A funky Jazz tune',
icon: new Image({
url: 'https://storage.googleapis.com/automotive-media/album_art.jpg',
alt: 'Album cover of an ocean view',
}),
}));
conv.ask(new Suggestions(['Basic Card', 'List',
'Carousel', 'Browsing Carousel']));
});
Java
@ForIntent("Media Response")
public ActionResponse mediaResponse(ActionRequest request) {
ResponseBuilder responseBuilder = getResponseBuilder(request);
if (!request.hasCapability(Capability.MEDIA_RESPONSE_AUDIO.getValue())) {
return responseBuilder
.add("Sorry, this device does not support audio playback.")
.add("Which response would you like to see next?")
.build();
}
responseBuilder
.add("This is a media response example.")
.add(
new MediaResponse()
.setMediaObjects(
new ArrayList<MediaObject>(
Arrays.asList(
new MediaObject()
.setName("Jazz in Paris")
.setDescription("A funky Jazz tune")
.setContentUrl(
"https://storage.googleapis.com/automotive-media/Jazz_In_Paris.mp3")
.setIcon(
new Image()
.setUrl(
"https://storage.googleapis.com/automotive-media/album_art.jpg")
.setAccessibilityText("Album cover of an ocean view")))))
.setMediaType("AUDIO"))
.addSuggestions(new String[] {"Basic Card", "List", "Carousel", "Browsing Carousel"});
return responseBuilder.build();
}
Node.js
if (!conv.surface.capabilities
.has('actions.capability.MEDIA_RESPONSE_AUDIO')) {
conv.ask('Sorry, this device does not support audio playback.');
conv.ask('Which response would you like to see next?');
return;
}
conv.ask('This is a media response example.');
conv.ask(new MediaObject({
name: 'Jazz in Paris',
url: 'https://storage.googleapis.com/automotive-media/Jazz_In_Paris.mp3',
description: 'A funky Jazz tune',
icon: new Image({
url: 'https://storage.googleapis.com/automotive-media/album_art.jpg',
alt: 'Album cover of an ocean view',
}),
}));
conv.ask(new Suggestions(['Basic Card', 'List',
'Carousel', 'Browsing Carousel']));
Java
ResponseBuilder responseBuilder = getResponseBuilder(request);
if (!request.hasCapability(Capability.MEDIA_RESPONSE_AUDIO.getValue())) {
return responseBuilder
.add("Sorry, this device does not support audio playback.")
.add("Which response would you like to see next?")
.build();
}
responseBuilder
.add("This is a media response example.")
.add(
new MediaResponse()
.setMediaObjects(
new ArrayList<MediaObject>(
Arrays.asList(
new MediaObject()
.setName("Jazz in Paris")
.setDescription("A funky Jazz tune")
.setContentUrl(
"https://storage.googleapis.com/automotive-media/Jazz_In_Paris.mp3")
.setIcon(
new Image()
.setUrl(
"https://storage.googleapis.com/automotive-media/album_art.jpg")
.setAccessibilityText("Album cover of an ocean view")))))
.setMediaType("AUDIO"))
.addSuggestions(new String[] {"Basic Card", "List", "Carousel", "Browsing Carousel"});
return responseBuilder.build();
JSON
Aşağıdaki JSON'in bir webhook yanıtını açıkladığını unutmayın.
{
"payload": {
"google": {
"expectUserResponse": true,
"richResponse": {
"items": [
{
"simpleResponse": {
"textToSpeech": "This is a media response example."
}
},
{
"mediaResponse": {
"mediaType": "AUDIO",
"mediaObjects": [
{
"contentUrl": "https://storage.googleapis.com/automotive-media/Jazz_In_Paris.mp3",
"description": "A funky Jazz tune",
"icon": {
"url": "https://storage.googleapis.com/automotive-media/album_art.jpg",
"accessibilityText": "Album cover of an ocean view"
},
"name": "Jazz in Paris"
}
]
}
}
],
"suggestions": [
{
"title": "Basic Card"
},
{
"title": "List"
},
{
"title": "Carousel"
},
{
"title": "Browsing Carousel"
}
]
}
}
}
}
JSON
Aşağıdaki JSON'in bir webhook yanıtını açıkladığını unutmayın.
{
"expectUserResponse": true,
"expectedInputs": [
{
"possibleIntents": [
{
"intent": "actions.intent.TEXT"
}
],
"inputPrompt": {
"richInitialPrompt": {
"items": [
{
"simpleResponse": {
"textToSpeech": "This is a media response example."
}
},
{
"mediaResponse": {
"mediaType": "AUDIO",
"mediaObjects": [
{
"contentUrl": "https://storage.googleapis.com/automotive-media/Jazz_In_Paris.mp3",
"description": "A funky Jazz tune",
"icon": {
"url": "https://storage.googleapis.com/automotive-media/album_art.jpg",
"accessibilityText": "Album cover of an ocean view"
},
"name": "Jazz in Paris"
}
]
}
}
],
"suggestions": [
{
"title": "Basic Card"
},
{
"title": "List"
},
{
"title": "Carousel"
},
{
"title": "Browsing Carousel"
}
]
}
}
}
]
}
Yönerge
Yanıtınız AUDIO değeri ve mediaType olan bir mediaResponse ve zengin yanıtın öğe dizisinde bir mediaObject içermelidir. Medya yanıtı, tek bir medya nesnesini destekler. Bir medya nesnesi, ses dosyasının içerik URL'sini içermelidir. Bir medya nesnesi isteğe bağlı olarak bir ad, alt metin (açıklama) ve bir simge ya da resim URL'si içerebilir.
Telefonlarda ve Google Home'da, İşleminiz ses çalmayı tamamladığında
Google Asistan, medya yanıtının FinalResponse olup olmadığını kontrol eder.
İzin verilmezse istek karşılamanıza geri arama yapılır ve böylece kullanıcıya yanıt verebilirsiniz.
Yanıt bir FinalResponse değilse İşleminiz öneri çipleri içermelidir.
Oynatma tamamlandıktan sonra geri çağırmayı işleme
İşleminiz, kullanıcıyı takip (örneğin, başka bir şarkı çalma) istemek için actions.intent.MEDIA_STATUS niyetini işlemelidir. İşleminiz medya oynatma tamamlandığında
bu geri çağırmayı alır. Geri çağırmada MEDIA_STATUS bağımsız değişkeni, mevcut medya ile ilgili durum bilgilerini içerir. Durum değeri FINISHED veya STATUS_UNSPECIFIED olur.
Dialogflow'u Kullanma
Dialogflow'da konuşma dili dallandırması gerçekleştirmek istiyorsanız yalnızca medya yanıtını destekleyen yüzeylerde tetiklendiğinden emin olmak için niyette actions_capability_media_response_audio giriş bağlamı ayarlamanız gerekir.
Sipariş karşılama
Aşağıdaki kod snippet'i, İşleminiz için sipariş karşılama kodunu nasıl yazabileceğinizi gösterir. Dialogflow kullanıyorsanız actions.intent.MEDIA_STATUS öğesini, actions_intent_MEDIA_STATUS etkinliğini alan niyette belirtilen işlem adıyla değiştirin (ör. "media.status.update").
Node.js
app.intent('Media Status', (conv) => {
const mediaStatus = conv.arguments.get('MEDIA_STATUS');
let response = 'Unknown media status received.';
if (mediaStatus && mediaStatus.status === 'FINISHED') {
response = 'Hope you enjoyed the tune!';
}
conv.ask(response);
conv.ask('Which response would you like to see next?');
});
Java
@ForIntent("Media Status")
public ActionResponse mediaStatus(ActionRequest request) {
ResponseBuilder responseBuilder = getResponseBuilder(request);
String mediaStatus = request.getMediaStatus();
String response = "Unknown media status received.";
if (mediaStatus != null && mediaStatus.equals("FINISHED")) {
response = "Hope you enjoyed the tune!";
}
responseBuilder.add(response);
responseBuilder.add("Which response would you like to see next?");
return responseBuilder.build();
}
Node.js
app.intent('actions.intent.MEDIA_STATUS', (conv) => {
const mediaStatus = conv.arguments.get('MEDIA_STATUS');
let response = 'Unknown media status received.';
if (mediaStatus && mediaStatus.status === 'FINISHED') {
response = 'Hope you enjoyed the tune!';
}
conv.ask(response);
conv.ask('Which response would you like to see next?');
});
Java
@ForIntent("actions.intent.MEDIA_STATUS")
public ActionResponse mediaStatus(ActionRequest request) {
ResponseBuilder responseBuilder = getResponseBuilder(request);
String mediaStatus = request.getMediaStatus();
String response = "Unknown media status received.";
if (mediaStatus != null && mediaStatus.equals("FINISHED")) {
response = "Hope you enjoyed the tune!";
}
responseBuilder.add(response);
responseBuilder.add("Which response would you like to see next?");
return responseBuilder.build();
}
JSON
Aşağıdaki JSON'in bir webhook isteğini tanımladığını unutmayın.
{
"responseId": "151b68df-98de-41fb-94b5-caeace90a7e9-21947381",
"queryResult": {
"queryText": "actions_intent_MEDIA_STATUS",
"parameters": {},
"allRequiredParamsPresent": true,
"fulfillmentText": "Webhook failed for intent: Media Status",
"fulfillmentMessages": [
{
"text": {
"text": [
"Webhook failed for intent: Media Status"
]
}
}
],
"outputContexts": [
{
"name": "projects/df-responses-kohler/agent/sessions/ABwppHHsebncupHK11oKhsCTgyH96GRNYH-xpeeMTqb-cvOxbd67QenbRlZM4bGAIB8_KXdTfI7-7lYVKN1ovAhCaA/contexts/actions_capability_media_response_audio"
},
{
"name": "projects/df-responses-kohler/agent/sessions/ABwppHHsebncupHK11oKhsCTgyH96GRNYH-xpeeMTqb-cvOxbd67QenbRlZM4bGAIB8_KXdTfI7-7lYVKN1ovAhCaA/contexts/actions_capability_account_linking"
},
{
"name": "projects/df-responses-kohler/agent/sessions/ABwppHHsebncupHK11oKhsCTgyH96GRNYH-xpeeMTqb-cvOxbd67QenbRlZM4bGAIB8_KXdTfI7-7lYVKN1ovAhCaA/contexts/actions_capability_web_browser"
},
{
"name": "projects/df-responses-kohler/agent/sessions/ABwppHHsebncupHK11oKhsCTgyH96GRNYH-xpeeMTqb-cvOxbd67QenbRlZM4bGAIB8_KXdTfI7-7lYVKN1ovAhCaA/contexts/actions_capability_screen_output"
},
{
"name": "projects/df-responses-kohler/agent/sessions/ABwppHHsebncupHK11oKhsCTgyH96GRNYH-xpeeMTqb-cvOxbd67QenbRlZM4bGAIB8_KXdTfI7-7lYVKN1ovAhCaA/contexts/actions_capability_audio_output"
},
{
"name": "projects/df-responses-kohler/agent/sessions/ABwppHHsebncupHK11oKhsCTgyH96GRNYH-xpeeMTqb-cvOxbd67QenbRlZM4bGAIB8_KXdTfI7-7lYVKN1ovAhCaA/contexts/google_assistant_input_type_voice"
},
{
"name": "projects/df-responses-kohler/agent/sessions/ABwppHHsebncupHK11oKhsCTgyH96GRNYH-xpeeMTqb-cvOxbd67QenbRlZM4bGAIB8_KXdTfI7-7lYVKN1ovAhCaA/contexts/actions_intent_media_status",
"parameters": {
"MEDIA_STATUS": {
"@type": "type.googleapis.com/google.actions.v2.MediaStatus",
"status": "FINISHED"
}
}
}
],
"intent": {
"name": "projects/df-responses-kohler/agent/intents/068b27d3-c148-4044-bfab-dfa37eebd90d",
"displayName": "Media Status"
},
"intentDetectionConfidence": 1,
"languageCode": "en"
},
"originalDetectIntentRequest": {
"source": "google",
"version": "2",
"payload": {
"user": {
"locale": "en-US",
"lastSeen": "2019-08-04T23:57:15Z",
"userVerificationStatus": "VERIFIED"
},
"conversation": {
"conversationId": "ABwppHHsebncupHK11oKhsCTgyH96GRNYH-xpeeMTqb-cvOxbd67QenbRlZM4bGAIB8_KXdTfI7-7lYVKN1ovAhCaA",
"type": "ACTIVE",
"conversationToken": "[]"
},
"inputs": [
{
"intent": "actions.intent.MEDIA_STATUS",
"rawInputs": [
{
"inputType": "VOICE"
}
],
"arguments": [
{
"name": "MEDIA_STATUS",
"extension": {
"@type": "type.googleapis.com/google.actions.v2.MediaStatus",
"status": "FINISHED"
}
}
]
}
],
"surface": {
"capabilities": [
{
"name": "actions.capability.MEDIA_RESPONSE_AUDIO"
},
{
"name": "actions.capability.ACCOUNT_LINKING"
},
{
"name": "actions.capability.WEB_BROWSER"
},
{
"name": "actions.capability.SCREEN_OUTPUT"
},
{
"name": "actions.capability.AUDIO_OUTPUT"
}
]
},
"isInSandbox": true,
"availableSurfaces": [
{
"capabilities": [
{
"name": "actions.capability.WEB_BROWSER"
},
{
"name": "actions.capability.AUDIO_OUTPUT"
},
{
"name": "actions.capability.SCREEN_OUTPUT"
}
]
}
],
"requestType": "SIMULATOR"
}
},
"session": "projects/df-responses-kohler/agent/sessions/ABwppHHsebncupHK11oKhsCTgyH96GRNYH-xpeeMTqb-cvOxbd67QenbRlZM4bGAIB8_KXdTfI7-7lYVKN1ovAhCaA"
}
JSON
Aşağıdaki JSON'in bir webhook isteğini tanımladığını unutmayın.
{
"user": {
"locale": "en-US",
"lastSeen": "2019-08-06T07:38:40Z",
"userVerificationStatus": "VERIFIED"
},
"conversation": {
"conversationId": "ABwppHGcqunXh1M6IE0lu2sVqXdpJfdpC5FWMkMSXQskK1nzb4IkSUSRqQzoEr0Ly0z_G3mwyZlk5rFtd1w",
"type": "NEW"
},
"inputs": [
{
"intent": "actions.intent.MEDIA_STATUS",
"rawInputs": [
{
"inputType": "VOICE"
}
],
"arguments": [
{
"name": "MEDIA_STATUS",
"extension": {
"@type": "type.googleapis.com/google.actions.v2.MediaStatus",
"status": "FINISHED"
}
}
]
}
],
"surface": {
"capabilities": [
{
"name": "actions.capability.SCREEN_OUTPUT"
},
{
"name": "actions.capability.WEB_BROWSER"
},
{
"name": "actions.capability.AUDIO_OUTPUT"
},
{
"name": "actions.capability.MEDIA_RESPONSE_AUDIO"
},
{
"name": "actions.capability.ACCOUNT_LINKING"
}
]
},
"isInSandbox": true,
"availableSurfaces": [
{
"capabilities": [
{
"name": "actions.capability.WEB_BROWSER"
},
{
"name": "actions.capability.AUDIO_OUTPUT"
},
{
"name": "actions.capability.SCREEN_OUTPUT"
}
]
}
],
"requestType": "SIMULATOR"
}
Tablo kartları
Tablo kartları, yanıtınızda tablo biçiminde veriler (örneğin, puan durumları, seçim sonuçları ve uçuşlar) görüntüleyebilmenizi sağlar. Asistan'ın tablo kartınızda göstermesi gereken sütunları ve satırları (her biri en fazla 3 adet) tanımlayabilirsiniz. Ayrıca, önceliklendirmeyle birlikte ek sütunlar ve satırlar da tanımlayabilirsiniz.
Tablolar, statik veriler gösterdiğinden ve liste öğeleri gibi etkileşimde bulunamadığından dikey listelerden farklıdır.
Özellikler
Tablo kartları, yapılandırabileceğiniz aşağıdaki şartlara ve isteğe bağlı özelliklere sahiptir:
actions.capability.SCREEN_OUTPUTözelliği olan yüzeylerde desteklenir.
Aşağıdaki bölümde, bir tablo kartındaki öğeleri nasıl özelleştirebileceğiniz özetlenmiştir.
| Ad | İsteğe Bağlı | Özelleştirilebilir | Özelleştirme Notları |
|---|---|---|---|
title |
Evet | Evet | Tablonun genel başlığı. Alt başlık ayarlanmışsa ayarlanmalıdır. Yazı tipi ailesini ve rengini özelleştirebilirsiniz. |
subtitle |
Evet | Hayır | Tablonun alt başlığı. |
image |
Evet | Evet | Tabloyla ilişkilendirilen resim. |
Row |
Hayır | Evet |
Tablonun satır verileri. Bir dizi İlk 3 satırın gösterilmesi garanti edilir ancak diğerleri belirli yüzeylerde görünmeyebilir. Belirli bir yüzeyde hangi satırların gösterildiğini görmek için lütfen simülasyon aracıyla test yapın. |
ColumnProperties |
Evet | Evet | Bir sütunun başlığı ve hizalaması. Bir header mülkünden (bir sütunun başlık metnini temsil eden) ve bir horizontal_alignment özelliğinden (HorizontalAlignment türünde) oluşur. |
Cell |
Hayır | Evet | Bir satırdaki bir hücreyi açıklar. Her hücrede bir metin değerini temsil eden bir dize bulunur. Hücredeki metni özelleştirebilirsiniz. |
Button |
Evet | Evet | Genellikle kartın alt kısmında görünen düğme düğmesi. Tablo kartında yalnızca 1 düğme olabilir. Düğme rengini özelleştirebilirsiniz. |
HorizontalAlignment |
Evet | Evet | Hücredeki içeriğin yatay hizalaması. Değerler LEADING, CENTER veya TRAILING olabilir. Belirtilmemesi halinde içerik, hücrenin ön kenarına hizalanır. |
Örnek kod
Aşağıdaki snippet'lerde basit bir tablo kartının nasıl uygulanacağı gösterilmiştir:
Node.js
app.intent('Simple Table Card', (conv) => {
if (!conv.screen) {
conv.ask('Sorry, try this on a screen device or select the ' +
'phone surface in the simulator.');
conv.ask('Which response would you like to see next?');
return;
}
conv.ask('This is a simple table example.');
conv.ask(new Table({
dividers: true,
columns: ['header 1', 'header 2', 'header 3'],
rows: [
['row 1 item 1', 'row 1 item 2', 'row 1 item 3'],
['row 2 item 1', 'row 2 item 2', 'row 2 item 3'],
],
}));
conv.ask('Which response would you like to see next?');
});
Java
@ForIntent("Simple Table Card")
public ActionResponse simpleTable(ActionRequest request) {
ResponseBuilder responseBuilder = getResponseBuilder(request);
if (!request.hasCapability(Capability.SCREEN_OUTPUT.getValue())) {
return responseBuilder
.add("Sorry, try ths on a screen device or select the phone surface in the simulator.")
.add("Which response would you like to see next?")
.build();
}
responseBuilder
.add("This is a simple table example.")
.add(
new TableCard()
.setColumnProperties(
Arrays.asList(
new TableCardColumnProperties().setHeader("header 1"),
new TableCardColumnProperties().setHeader("header 2"),
new TableCardColumnProperties().setHeader("header 3")))
.setRows(
Arrays.asList(
new TableCardRow()
.setCells(
Arrays.asList(
new TableCardCell().setText("row 1 item 1"),
new TableCardCell().setText("row 1 item 2"),
new TableCardCell().setText("row 1 item 3"))),
new TableCardRow()
.setCells(
Arrays.asList(
new TableCardCell().setText("row 2 item 1"),
new TableCardCell().setText("row 2 item 2"),
new TableCardCell().setText("row 2 item 3"))))));
return responseBuilder.build();
}
Node.js
if (!conv.screen) {
conv.ask('Sorry, try this on a screen device or select the ' +
'phone surface in the simulator.');
conv.ask('Which response would you like to see next?');
return;
}
conv.ask('This is a simple table example.');
conv.ask(new Table({
dividers: true,
columns: ['header 1', 'header 2', 'header 3'],
rows: [
['row 1 item 1', 'row 1 item 2', 'row 1 item 3'],
['row 2 item 1', 'row 2 item 2', 'row 2 item 3'],
],
}));
conv.ask('Which response would you like to see next?');
Java
ResponseBuilder responseBuilder = getResponseBuilder(request);
if (!request.hasCapability(Capability.SCREEN_OUTPUT.getValue())) {
return responseBuilder
.add("Sorry, try ths on a screen device or select the phone surface in the simulator.")
.add("Which response would you like to see next?")
.build();
}
responseBuilder
.add("This is a simple table example.")
.add(
new TableCard()
.setColumnProperties(
Arrays.asList(
new TableCardColumnProperties().setHeader("header 1"),
new TableCardColumnProperties().setHeader("header 2"),
new TableCardColumnProperties().setHeader("header 3")))
.setRows(
Arrays.asList(
new TableCardRow()
.setCells(
Arrays.asList(
new TableCardCell().setText("row 1 item 1"),
new TableCardCell().setText("row 1 item 2"),
new TableCardCell().setText("row 1 item 3"))),
new TableCardRow()
.setCells(
Arrays.asList(
new TableCardCell().setText("row 2 item 1"),
new TableCardCell().setText("row 2 item 2"),
new TableCardCell().setText("row 2 item 3"))))));
return responseBuilder.build();
JSON
Aşağıdaki JSON'in bir webhook yanıtını açıkladığını unutmayın.
{
"payload": {
"google": {
"expectUserResponse": true,
"richResponse": {
"items": [
{
"simpleResponse": {
"textToSpeech": "This is a simple table example."
}
},
{
"tableCard": {
"rows": [
{
"cells": [
{
"text": "row 1 item 1"
},
{
"text": "row 1 item 2"
},
{
"text": "row 1 item 3"
}
],
"dividerAfter": true
},
{
"cells": [
{
"text": "row 2 item 1"
},
{
"text": "row 2 item 2"
},
{
"text": "row 2 item 3"
}
],
"dividerAfter": true
}
],
"columnProperties": [
{
"header": "header 1"
},
{
"header": "header 2"
},
{
"header": "header 3"
}
]
}
},
{
"simpleResponse": {
"textToSpeech": "Which response would you like to see next?"
}
}
]
}
}
}
}
JSON
Aşağıdaki JSON'in bir webhook yanıtını açıkladığını unutmayın.
{
"expectUserResponse": true,
"expectedInputs": [
{
"inputPrompt": {
"richInitialPrompt": {
"items": [
{
"simpleResponse": {
"textToSpeech": "This is a simple table example."
}
},
{
"tableCard": {
"columnProperties": [
{
"header": "header 1"
},
{
"header": "header 2"
},
{
"header": "header 3"
}
],
"rows": [
{
"cells": [
{
"text": "row 1 item 1"
},
{
"text": "row 1 item 2"
},
{
"text": "row 1 item 3"
}
],
"dividerAfter": true
},
{
"cells": [
{
"text": "row 2 item 1"
},
{
"text": "row 2 item 2"
},
{
"text": "row 2 item 3"
}
],
"dividerAfter": true
}
]
}
},
{
"simpleResponse": {
"textToSpeech": "Which response would you like to see next?"
}
}
]
}
},
"possibleIntents": [
{
"intent": "actions.intent.TEXT"
}
]
}
]
}
Aşağıdaki snippet'ler, karmaşık bir tablo kartının nasıl uygulanacağını göstermektedir:
Node.js
app.intent('Advanced Table Card', (conv) => {
if (!conv.screen) {
conv.ask('Sorry, try this on a screen device or select the ' +
'phone surface in the simulator.');
conv.ask('Which response would you like to see next?');
return;
}
conv.ask('This is a table with all the possible fields.');
conv.ask(new Table({
title: 'Table Title',
subtitle: 'Table Subtitle',
image: new Image({
url: 'https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png',
alt: 'Alt Text',
}),
columns: [
{
header: 'header 1',
align: 'CENTER',
},
{
header: 'header 2',
align: 'LEADING',
},
{
header: 'header 3',
align: 'TRAILING',
},
],
rows: [
{
cells: ['row 1 item 1', 'row 1 item 2', 'row 1 item 3'],
dividerAfter: false,
},
{
cells: ['row 2 item 1', 'row 2 item 2', 'row 2 item 3'],
dividerAfter: true,
},
{
cells: ['row 3 item 1', 'row 3 item 2', 'row 3 item 3'],
},
],
buttons: new Button({
title: 'Button Text',
url: 'https://assistant.google.com',
}),
}));
conv.ask('Which response would you like to see next?');
});
Java
@ForIntent("Advanced Table Card")
public ActionResponse advancedTable(ActionRequest request) {
ResponseBuilder responseBuilder = getResponseBuilder(request);
if (!request.hasCapability(Capability.SCREEN_OUTPUT.getValue())) {
return responseBuilder
.add("Sorry, try ths on a screen device or select the phone surface in the simulator.")
.add("Which response would you like to see next?")
.build();
}
responseBuilder
.add("This is a table with all the possible fields.")
.add(
new TableCard()
.setTitle("Table Title")
.setSubtitle("Table Subtitle")
.setImage(
new Image()
.setUrl(
"https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png")
.setAccessibilityText("Alt text"))
.setButtons(
Arrays.asList(
new Button()
.setTitle("Button Text")
.setOpenUrlAction(
new OpenUrlAction().setUrl("https://assistant.google.com"))))
.setColumnProperties(
Arrays.asList(
new TableCardColumnProperties()
.setHeader("header 1")
.setHorizontalAlignment("CENTER"),
new TableCardColumnProperties()
.setHeader("header 2")
.setHorizontalAlignment("LEADING"),
new TableCardColumnProperties()
.setHeader("header 3")
.setHorizontalAlignment("TRAILING")))
.setRows(
Arrays.asList(
new TableCardRow()
.setCells(
Arrays.asList(
new TableCardCell().setText("row 1 item 1"),
new TableCardCell().setText("row 1 item 2"),
new TableCardCell().setText("row 1 item 3")))
.setDividerAfter(false),
new TableCardRow()
.setCells(
Arrays.asList(
new TableCardCell().setText("row 2 item 1"),
new TableCardCell().setText("row 2 item 2"),
new TableCardCell().setText("row 2 item 3")))
.setDividerAfter(true),
new TableCardRow()
.setCells(
Arrays.asList(
new TableCardCell().setText("row 2 item 1"),
new TableCardCell().setText("row 2 item 2"),
new TableCardCell().setText("row 2 item 3"))))));
return responseBuilder.build();
}
Node.js
if (!conv.screen) {
conv.ask('Sorry, try this on a screen device or select the ' +
'phone surface in the simulator.');
conv.ask('Which response would you like to see next?');
return;
}
conv.ask('This is a table with all the possible fields.');
conv.ask(new Table({
title: 'Table Title',
subtitle: 'Table Subtitle',
image: new Image({
url: 'https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png',
alt: 'Alt Text',
}),
columns: [
{
header: 'header 1',
align: 'CENTER',
},
{
header: 'header 2',
align: 'LEADING',
},
{
header: 'header 3',
align: 'TRAILING',
},
],
rows: [
{
cells: ['row 1 item 1', 'row 1 item 2', 'row 1 item 3'],
dividerAfter: false,
},
{
cells: ['row 2 item 1', 'row 2 item 2', 'row 2 item 3'],
dividerAfter: true,
},
{
cells: ['row 3 item 1', 'row 3 item 2', 'row 3 item 3'],
},
],
buttons: new Button({
title: 'Button Text',
url: 'https://assistant.google.com',
}),
}));
conv.ask('Which response would you like to see next?');
Java
ResponseBuilder responseBuilder = getResponseBuilder(request);
if (!request.hasCapability(Capability.SCREEN_OUTPUT.getValue())) {
return responseBuilder
.add("Sorry, try ths on a screen device or select the phone surface in the simulator.")
.add("Which response would you like to see next?")
.build();
}
responseBuilder
.add("This is a table with all the possible fields.")
.add(
new TableCard()
.setTitle("Table Title")
.setSubtitle("Table Subtitle")
.setImage(
new Image()
.setUrl(
"https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png")
.setAccessibilityText("Alt text"))
.setButtons(
Arrays.asList(
new Button()
.setTitle("Button Text")
.setOpenUrlAction(
new OpenUrlAction().setUrl("https://assistant.google.com"))))
.setColumnProperties(
Arrays.asList(
new TableCardColumnProperties()
.setHeader("header 1")
.setHorizontalAlignment("CENTER"),
new TableCardColumnProperties()
.setHeader("header 2")
.setHorizontalAlignment("LEADING"),
new TableCardColumnProperties()
.setHeader("header 3")
.setHorizontalAlignment("TRAILING")))
.setRows(
Arrays.asList(
new TableCardRow()
.setCells(
Arrays.asList(
new TableCardCell().setText("row 1 item 1"),
new TableCardCell().setText("row 1 item 2"),
new TableCardCell().setText("row 1 item 3")))
.setDividerAfter(false),
new TableCardRow()
.setCells(
Arrays.asList(
new TableCardCell().setText("row 2 item 1"),
new TableCardCell().setText("row 2 item 2"),
new TableCardCell().setText("row 2 item 3")))
.setDividerAfter(true),
new TableCardRow()
.setCells(
Arrays.asList(
new TableCardCell().setText("row 2 item 1"),
new TableCardCell().setText("row 2 item 2"),
new TableCardCell().setText("row 2 item 3"))))));
return responseBuilder.build();
JSON
Aşağıdaki JSON'in bir webhook yanıtını açıkladığını unutmayın.
{
"payload": {
"google": {
"expectUserResponse": true,
"richResponse": {
"items": [
{
"simpleResponse": {
"textToSpeech": "This is a table with all the possible fields."
}
},
{
"tableCard": {
"title": "Table Title",
"subtitle": "Table Subtitle",
"image": {
"url": "https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png",
"accessibilityText": "Alt Text"
},
"rows": [
{
"cells": [
{
"text": "row 1 item 1"
},
{
"text": "row 1 item 2"
},
{
"text": "row 1 item 3"
}
],
"dividerAfter": false
},
{
"cells": [
{
"text": "row 2 item 1"
},
{
"text": "row 2 item 2"
},
{
"text": "row 2 item 3"
}
],
"dividerAfter": true
},
{
"cells": [
{
"text": "row 3 item 1"
},
{
"text": "row 3 item 2"
},
{
"text": "row 3 item 3"
}
]
}
],
"columnProperties": [
{
"header": "header 1",
"horizontalAlignment": "CENTER"
},
{
"header": "header 2",
"horizontalAlignment": "LEADING"
},
{
"header": "header 3",
"horizontalAlignment": "TRAILING"
}
],
"buttons": [
{
"title": "Button Text",
"openUrlAction": {
"url": "https://assistant.google.com"
}
}
]
}
},
{
"simpleResponse": {
"textToSpeech": "Which response would you like to see next?"
}
}
]
}
}
}
}
JSON
Aşağıdaki JSON'in bir webhook yanıtını açıkladığını unutmayın.
{
"expectUserResponse": true,
"expectedInputs": [
{
"possibleIntents": [
{
"intent": "actions.intent.TEXT"
}
],
"inputPrompt": {
"richInitialPrompt": {
"items": [
{
"simpleResponse": {
"textToSpeech": "This is a table with all the possible fields."
}
},
{
"tableCard": {
"title": "Table Title",
"subtitle": "Table Subtitle",
"image": {
"url": "https://storage.googleapis.com/actionsresources/logo_assistant_2x_64dp.png",
"accessibilityText": "Alt Text"
},
"rows": [
{
"cells": [
{
"text": "row 1 item 1"
},
{
"text": "row 1 item 2"
},
{
"text": "row 1 item 3"
}
],
"dividerAfter": false
},
{
"cells": [
{
"text": "row 2 item 1"
},
{
"text": "row 2 item 2"
},
{
"text": "row 2 item 3"
}
],
"dividerAfter": true
},
{
"cells": [
{
"text": "row 3 item 1"
},
{
"text": "row 3 item 2"
},
{
"text": "row 3 item 3"
}
]
}
],
"columnProperties": [
{
"header": "header 1",
"horizontalAlignment": "CENTER"
},
{
"header": "header 2",
"horizontalAlignment": "LEADING"
},
{
"header": "header 3",
"horizontalAlignment": "TRAILING"
}
],
"buttons": [
{
"title": "Button Text",
"openUrlAction": {
"url": "https://assistant.google.com"
}
}
]
}
},
{
"simpleResponse": {
"textToSpeech": "Which response would you like to see next?"
}
}
]
}
}
}
]
}
Yanıtlarınızı özelleştirme
Özel bir tema oluşturarak zengin yanıtlarınızın görünümünü değiştirebilirsiniz. İşlemler projeniz için bir tema tanımlarsanız projenizin İşlemler bölümündeki zengin yanıtlar, temanıza göre şekillendirilir. Bu özel marka bilinci oluşturma öğesi, kullanıcılar Actions'ı bir yüzeyde ekranla çağırdığında görüşmede benzersiz bir görünüm ve tarz tanımlamak için faydalı olabilir.
Özel bir yanıt teması ayarlamak için aşağıdakileri yapın:
- İşlemler konsolunda, Geliştirme > Tema özelleştirme'ye gidin.
- Aşağıdakilerden birini veya tümünü belirleyin:
- Kartlarınızın arka planı olarak kullanılacak arka plan rengi. Genel olarak, arka plan için açık bir renk kullanmanız gerekir. Böylece kart içeriği kolayca okunur.
- Birincil renk, kartlarınızın başlık metinleri ve kullanıcı arayüzü öğelerinin ana rengidir. Genel olarak, arka planla kontrast oluşturmak için daha koyu bir birincil renk kullanmanız gerekir.
- Yazı tipi ailesi, başlıklar ve diğer belirgin metin öğeleri için kullanılan yazı tipinin türünü açıklar.
- Resim köşesi stili, kartlarınızın köşelerinin görünümünü değiştirebilir.
- Arka plan resmi, arka plan rengi yerine özel bir resim kullanır. Yüzey cihaz sırasıyla yatay veya dikey moddayken iki farklı görüntü sağlamanız gerekir. Arka plan resmi kullanıyorsanız birincil rengin beyaz olarak ayarlandığını unutmayın.
- Kaydet'i tıklayın.
