এই পৃষ্ঠাটি Cloud Translation API অনুবাদ করেছে।

পূর্বরূপ লিঙ্ক

ব্যবহারকারীরা যখন Google Chat-এ একটি লিঙ্ক শেয়ার করেন তখন প্রসঙ্গ পরিবর্তন রোধ করতে, আপনার Chat অ্যাপ তাদের মেসেজের সাথে একটি কার্ড সংযুক্ত করে লিঙ্কটির পূর্বরূপ দেখতে পারে যা আরও তথ্য দেয় এবং লোকেদের সরাসরি Google Chat থেকে পদক্ষেপ নিতে দেয়।

উদাহরণস্বরূপ, একটি Google চ্যাট স্পেস কল্পনা করুন যাতে একটি কোম্পানির সমস্ত গ্রাহক পরিষেবা এজেন্ট এবং Case-y নামে একটি চ্যাট অ্যাপ অন্তর্ভুক্ত থাকে। এজেন্টরা প্রায়শই চ্যাট স্পেসে কাস্টমার সার্ভিস কেসের লিঙ্ক শেয়ার করে এবং প্রতিবারই তাদের সহকর্মীদের কেস লিংক খুলতে হবে যাতে অ্যাসাইনি, স্ট্যাটাস এবং বিষয়ের মতো বিশদ বিবরণ দেখতে হয়। একইভাবে, কেউ যদি কোনও মামলার মালিকানা নিতে বা স্ট্যাটাস পরিবর্তন করতে চান তবে তাদের লিঙ্কটি খুলতে হবে।

লিংক প্রিভিউ করার মাধ্যমে স্পেসের রেসিডেন্ট চ্যাট অ্যাপ, কেস-ওয়াই, যখনই কেউ একটি কেস লিঙ্ক শেয়ার করে তখন অ্যাসাইনি, স্ট্যাটাস এবং বিষয় দেখানো একটি কার্ড সংযুক্ত করতে সক্ষম করে। কার্ডের বোতামগুলি এজেন্টদের কেসের মালিকানা নিতে এবং চ্যাট স্ট্রীম থেকে সরাসরি স্থিতি পরিবর্তন করতে দেয়।

কিভাবে লিঙ্ক প্রিভিউ কাজ করে

যখন কেউ তাদের বার্তায় একটি লিঙ্ক যোগ করে, তখন একটি চিপ উপস্থিত হয় যা তাদের জানতে দেয় যে একটি চ্যাট অ্যাপ লিঙ্কটির পূর্বরূপ দেখতে পারে।

চিপ ইঙ্গিত করে যে একটি চ্যাট অ্যাপ একটি লিঙ্কের পূর্বরূপ দেখতে পারে

বার্তা পাঠানোর পরে, লিঙ্কটি চ্যাট অ্যাপে পাঠানো হয়, যা তারপর ব্যবহারকারীর বার্তায় কার্ড তৈরি করে এবং সংযুক্ত করে।

চ্যাট অ্যাপ মেসেজের সাথে একটি কার্ড সংযুক্ত করে একটি লিঙ্কের প্রিভিউ করছে

লিঙ্কের পাশাপাশি, কার্ডটি বোতামের মতো ইন্টারেক্টিভ উপাদান সহ লিঙ্ক সম্পর্কে অতিরিক্ত তথ্য প্রদান করে। আপনার চ্যাট অ্যাপ ব্যবহারকারীর ইন্টারঅ্যাকশনের প্রতিক্রিয়া হিসেবে সংযুক্ত কার্ড আপডেট করতে পারে, যেমন বোতামে ক্লিক করা।

যদি কেউ চান না যে চ্যাট অ্যাপ তাদের বার্তার সাথে একটি কার্ড সংযুক্ত করে তাদের লিঙ্কের পূর্বরূপ দেখুক, তারা প্রিভিউ চিপে ক্লিক করে প্রিভিউ করা প্রতিরোধ করতে পারে। ব্যবহারকারীরা যেকোন সময় রিমুভ প্রিভিউ এ ক্লিক করে সংযুক্ত কার্ডটি সরাতে পারেন।

পূর্বশর্ত

Node.js

একটি Google চ্যাট অ্যাপ যা ইন্টারেক্টিভ বৈশিষ্ট্যের জন্য সক্ষম। একটি HTTP পরিষেবা ব্যবহার করে একটি ইন্টারেক্টিভ চ্যাট অ্যাপ তৈরি করতে, এই কুইকস্টার্টটি সম্পূর্ণ করুন।

পাইথন

জাভা

অ্যাপস স্ক্রিপ্ট

একটি Google চ্যাট অ্যাপ যা ইন্টারেক্টিভ বৈশিষ্ট্যের জন্য সক্ষম। Apps Script-এ একটি ইন্টারেক্টিভ চ্যাট অ্যাপ তৈরি করতে, এই কুইকস্টার্টটি সম্পূর্ণ করুন।

লিঙ্ক প্রিভিউ কনফিগার করুন

Google ক্লাউড কনসোলে আপনার চ্যাট অ্যাপের কনফিগারেশন পৃষ্ঠায় URL প্যাটার্ন হিসাবে example.com , support.example.com , এবং support.example.com/cases/ মতো নির্দিষ্ট লিঙ্কগুলি নিবন্ধন করুন যাতে আপনার চ্যাট অ্যাপ তাদের পূর্বরূপ দেখতে পারে।

লিঙ্ক পূর্বরূপ কনফিগারেশন মেনু

গুগল ক্লাউড কনসোল খুলুন।
"Google ক্লাউড"-এর পাশে, নিচের তীর ক্লিক করুন এবং আপনার চ্যাট অ্যাপের প্রোজেক্ট খুলুন।
অনুসন্ধান ক্ষেত্রে, Google Chat API টাইপ করুন এবং Google Chat API-এ ক্লিক করুন।
পরিচালনা > কনফিগারেশন ক্লিক করুন।
লিঙ্ক পূর্বরূপের অধীনে, একটি URL প্যাটার্ন যোগ করুন বা সম্পাদনা করুন।
1. একটি নতুন URL প্যাটার্নের জন্য লিঙ্কের পূর্বরূপ কনফিগার করতে, URL প্যাটার্ন যোগ করুন ক্লিক করুন।
2. একটি বিদ্যমান URL প্যাটার্নের জন্য কনফিগারেশন সম্পাদনা করতে, নিচের তীর ক্লিক করুন।
হোস্ট প্যাটার্ন ক্ষেত্রে, URL প্যাটার্নের ডোমেন লিখুন। চ্যাট অ্যাপ এই ডোমেনের লিঙ্কগুলির পূর্বরূপ দেখাবে।
একটি নির্দিষ্ট সাবডোমেনের জন্য চ্যাট অ্যাপ প্রিভিউ লিঙ্ক পেতে, যেমন subdomain.example.com , সাবডোমেন অন্তর্ভুক্ত করুন।
পুরো ডোমেনের জন্য চ্যাট অ্যাপের প্রিভিউ লিঙ্ক পেতে, সাবডোমেন হিসেবে তারকাচিহ্ন (*) সহ একটি ওয়াইল্ডকার্ড অক্ষর উল্লেখ করুন। উদাহরণস্বরূপ, *.example.com subdomain.example.com এবং any.number.of.subdomains.example.com সাথে মেলে।
পথ উপসর্গ ক্ষেত্রে, হোস্ট প্যাটার্ন ডোমেনে যুক্ত করার জন্য একটি পাথ লিখুন।
হোস্ট প্যাটার্ন ডোমেনে সমস্ত ইউআরএল মেলানোর জন্য, পাথ উপসর্গ খালি রাখুন।
উদাহরণস্বরূপ, যদি হোস্ট প্যাটার্ন হয় support.example.com , তাহলে support.example.com/cases/ এ হোস্ট করা ক্ষেত্রে URL-এর সাথে মিল রাখতে, cases/ লিখুন।
সম্পন্ন ক্লিক করুন.
Save এ ক্লিক করুন।

এখন, যখনই কেউ একটি লিঙ্ক অন্তর্ভুক্ত করে যা একটি লিঙ্ক প্রিভিউ URL প্যাটার্নের সাথে মেলে এমন একটি চ্যাট স্পেসের একটি বার্তার সাথে যার মধ্যে আপনার চ্যাট অ্যাপ রয়েছে, আপনার অ্যাপ লিঙ্কটির পূর্বরূপ দেখায়।

একটি লিঙ্ক পূর্বরূপ

আপনি একটি প্রদত্ত লিঙ্কের জন্য লিঙ্ক প্রিভিউ কনফিগার করার পরে, আপনার চ্যাট অ্যাপ এটিতে আরও তথ্য সংযুক্ত করে লিঙ্কটিকে চিনতে এবং পূর্বরূপ দেখতে পারে।

চ্যাট স্পেসগুলির ভিতরে যা আপনার চ্যাট অ্যাপকে অন্তর্ভুক্ত করে, যখন কারও বার্তায় একটি লিঙ্ক থাকে যা লিঙ্কের পূর্বরূপ URL প্যাটার্নের সাথে মেলে, তখন আপনার চ্যাট অ্যাপ একটি MESSAGE ইন্টারঅ্যাকশন ইভেন্ট পায়। ইন্টারঅ্যাকশন ইভেন্টের জন্য JSON পেলোডে matchedUrl ক্ষেত্র রয়েছে:

JSON

message: {
  matchedUrl: {
    url: "https://support.example.com/cases/case123"
  },
  ... // other message attributes redacted
}

MESSAGE ইভেন্ট পেলোডে matchedUrl ফিল্ডের উপস্থিতি পরীক্ষা করে, আপনার চ্যাট অ্যাপটি প্রিভিউ করা লিঙ্ক সহ মেসেজে তথ্য যোগ করতে পারে। আপনার চ্যাট অ্যাপটি হয় একটি মৌলিক পাঠ্য বার্তার সাথে উত্তর দিতে পারে বা একটি কার্ড সংযুক্ত করতে পারে।

একটি পাঠ্য বার্তা দিয়ে উত্তর দিন

প্রাথমিক প্রতিক্রিয়াগুলির জন্য, আপনার চ্যাট অ্যাপ একটি লিঙ্কে একটি সাধারণ পাঠ্য বার্তার সাথে উত্তর দিয়ে একটি লিঙ্কের পূর্বরূপ দেখতে পারে। এই উদাহরণটি এমন একটি বার্তা সংযুক্ত করে যা লিঙ্কের URLটির পুনরাবৃত্তি করে যা একটি লিঙ্কের পূর্বরূপ URL প্যাটার্নের সাথে মেলে।

Node.js

node/preview-link/index.js

GitHub এ দেখুন

// Reply with a text message for URLs of the subdomain "text"
if (event.message.matchedUrl.url.includes("text.example.com")) {
  return {
    text: 'event.message.matchedUrl.url: ' + event.message.matchedUrl.url
  };
}

পাইথন

python/preview-link/main.py

GitHub এ দেখুন

# Reply with a text message for URLs of the subdomain "text"
if 'text.example.com' in event.get('message').get('matchedUrl').get('url'):
  return {
    'text': 'event.message.matchedUrl.url: ' +
            event.get('message').get('matchedUrl').get('url')
  }

জাভা

java/preview-link/src/main/java/com/google/chat/preview/App.java

GitHub এ দেখুন

// Reply with a text message for URLs of the subdomain "text"
if (event.at("/message/matchedUrl/url").asText().contains("text.example.com")) {
  return new Message().setText("event.message.matchedUrl.url: " +
    event.at("/message/matchedUrl/url").asText());
}

অ্যাপস স্ক্রিপ্ট

apps-script/preview-link/preview-link.gs

GitHub এ দেখুন

// Reply with a text message for URLs of the subdomain "text"
if (event.message.matchedUrl.url.includes("text.example.com")) {
  return {
    text: 'event.message.matchedUrl.url: ' + event.message.matchedUrl.url
  };
}

একটি কার্ড সংযুক্ত করুন যা লিঙ্কটির পূর্বরূপ দেখায়

একটি পূর্বরূপ লিঙ্কে একটি কার্ড সংযুক্ত করতে, UPDATE_USER_MESSAGE_CARDS টাইপের একটি ActionResponse ফেরত দিন। এই উদাহরণটি একটি মৌলিক কার্ড সংযুক্ত করে।

চ্যাট অ্যাপ মেসেজের সাথে একটি কার্ড সংযুক্ত করে একটি লিঙ্কের প্রিভিউ করছে

Node.js

node/preview-link/index.js

GitHub এ দেখুন

// Attach a card to the message for URLs of the subdomain "support"
if (event.message.matchedUrl.url.includes("support.example.com")) {
  // A hard-coded card is used in this example. In a real-life scenario,
  // the case information would be fetched and used to build the card.
  return {
    actionResponse: { type: 'UPDATE_USER_MESSAGE_CARDS' },
    cardsV2: [{
      cardId: 'attachCard',
      card: {
        header: {
          title: 'Example Customer Service Case',
          subtitle: 'Case basics',
        },
        sections: [{ widgets: [
          { decoratedText: { topLabel: 'Case ID', text: 'case123'}},
          { decoratedText: { topLabel: 'Assignee', text: 'Charlie'}},
          { decoratedText: { topLabel: 'Status', text: 'Open'}},
          { decoratedText: { topLabel: 'Subject', text: 'It won\'t turn on...' }},
          { buttonList: { buttons: [{
            text: 'OPEN CASE',
            onClick: { openLink: {
              url: 'https://support.example.com/orders/case123'
            }},
          }, {
            text: 'RESOLVE CASE',
            onClick: { openLink: {
              url: 'https://support.example.com/orders/case123?resolved=y',
            }},
          }, {
            text: 'ASSIGN TO ME',
            onClick: { action: { function: 'assign'}}
          }]}}
        ]}]
      }
    }]
  };
}

পাইথন

python/preview-link/main.py

GitHub এ দেখুন

# Attach a card to the message for URLs of the subdomain "support"
if 'support.example.com' in event.get('message').get('matchedUrl').get('url'):
  # A hard-coded card is used in this example. In a real-life scenario,
  # the case information would be fetched and used to build the card.
  return {
    'actionResponse': { 'type': 'UPDATE_USER_MESSAGE_CARDS' },
    'cardsV2': [{
      'cardId': 'attachCard',
      'card': {
        'header': {
          'title': 'Example Customer Service Case',
          'subtitle': 'Case basics',
        },
        'sections': [{ 'widgets': [
          { 'decoratedText': { 'topLabel': 'Case ID', 'text': 'case123'}},
          { 'decoratedText': { 'topLabel': 'Assignee', 'text': 'Charlie'}},
          { 'decoratedText': { 'topLabel': 'Status', 'text': 'Open'}},
          { 'decoratedText': { 'topLabel': 'Subject', 'text': 'It won\'t turn on...' }},
          { 'buttonList': { 'buttons': [{
            'text': 'OPEN CASE',
            'onClick': { 'openLink': {
              'url': 'https://support.example.com/orders/case123'
            }},
          }, {
            'text': 'RESOLVE CASE',
            'onClick': { 'openLink': {
              'url': 'https://support.example.com/orders/case123?resolved=y',
            }},
          }, {
            'text': 'ASSIGN TO ME',
            'onClick': { 'action': { 'function': 'assign'}}
          }]}}
        ]}]
      }
    }]
  }

জাভা

java/preview-link/src/main/java/com/google/chat/preview/App.java

GitHub এ দেখুন

// Attach a card to the message for URLs of the subdomain "support"
if (event.at("/message/matchedUrl/url").asText().contains("support.example.com")) {
  // A hard-coded card is used in this example. In a real-life scenario,
  // the case information would be fetched and used to build the card.
  GoogleAppsCardV1CardHeader header = new GoogleAppsCardV1CardHeader();
  header.setTitle("Example Customer Service Case");
  header.setSubtitle("Case basics");

  GoogleAppsCardV1DecoratedText caseIdDecoratedText = new GoogleAppsCardV1DecoratedText();
  caseIdDecoratedText.setTopLabel("Case ID");
  caseIdDecoratedText.setText("case123");

  GoogleAppsCardV1Widget caseIdWidget = new GoogleAppsCardV1Widget();
  caseIdWidget.setDecoratedText(caseIdDecoratedText);

  GoogleAppsCardV1DecoratedText assigneeDecoratedText = new GoogleAppsCardV1DecoratedText();
  assigneeDecoratedText.setTopLabel("Assignee");
  assigneeDecoratedText.setText("Charlie");

  GoogleAppsCardV1Widget assigneeWidget = new GoogleAppsCardV1Widget();
  assigneeWidget.setDecoratedText(assigneeDecoratedText);

  GoogleAppsCardV1DecoratedText statusDecoratedText = new GoogleAppsCardV1DecoratedText();
  statusDecoratedText.setTopLabel("Status");
  statusDecoratedText.setText("Open");

  GoogleAppsCardV1Widget statusWidget = new GoogleAppsCardV1Widget();
  statusWidget.setDecoratedText(statusDecoratedText);

  GoogleAppsCardV1DecoratedText subjectDecoratedText = new GoogleAppsCardV1DecoratedText();
  subjectDecoratedText.setTopLabel("Subject");
  subjectDecoratedText.setText("It won't turn on...");

  GoogleAppsCardV1Widget subjectWidget = new GoogleAppsCardV1Widget();
  subjectWidget.setDecoratedText(subjectDecoratedText);

  GoogleAppsCardV1OpenLink openOpenLink = new GoogleAppsCardV1OpenLink();
  openOpenLink.setUrl("https://support.example.com/orders/case123");

  GoogleAppsCardV1OnClick openOnClick = new GoogleAppsCardV1OnClick();
  openOnClick.setOpenLink(openOpenLink);

  GoogleAppsCardV1Button openButton = new GoogleAppsCardV1Button();
  openButton.setText("OPEN CASE");
  openButton.setOnClick(openOnClick);

  GoogleAppsCardV1OpenLink resolveOpenLink = new GoogleAppsCardV1OpenLink();
  resolveOpenLink.setUrl("https://support.example.com/orders/case123?resolved=y");

  GoogleAppsCardV1OnClick resolveOnClick = new GoogleAppsCardV1OnClick();
  resolveOnClick.setOpenLink(resolveOpenLink);

  GoogleAppsCardV1Button resolveButton = new GoogleAppsCardV1Button();
  resolveButton.setText("RESOLVE CASE");
  resolveButton.setOnClick(resolveOnClick);

  GoogleAppsCardV1Action assignAction = new GoogleAppsCardV1Action();
  assignAction.setFunction("assign");

  GoogleAppsCardV1OnClick assignOnClick = new GoogleAppsCardV1OnClick();
  assignOnClick.setAction(assignAction);

  GoogleAppsCardV1Button assignButton = new GoogleAppsCardV1Button();
  assignButton.setText("ASSIGN TO ME");
  assignButton.setOnClick(assignOnClick);

  GoogleAppsCardV1ButtonList buttonList = new GoogleAppsCardV1ButtonList();
  buttonList.setButtons(List.of(openButton, resolveButton, assignButton));

  GoogleAppsCardV1Widget buttonListWidget = new GoogleAppsCardV1Widget();
  buttonListWidget.setButtonList(buttonList);

  GoogleAppsCardV1Section section = new GoogleAppsCardV1Section();
  section.setWidgets(List.of(caseIdWidget, assigneeWidget, statusWidget, subjectWidget, buttonListWidget));

  GoogleAppsCardV1Card card = new GoogleAppsCardV1Card();
  card.setHeader(header);
  card.setSections(List.of(section));

  GenericJson cardV2 = new GenericJson();
  cardV2.set("cardId", "attachCard");
  cardV2.set("card", card);

  GenericJson actionResponse = new GenericJson();
  actionResponse.set("type", "UPDATE_USER_MESSAGE_CARDS");

  GenericJson response = new GenericJson();
  response.set("actionResponse", actionResponse);
  response.set("cardsV2", List.of(cardV2));
  return response;
}

অ্যাপস স্ক্রিপ্ট

এই উদাহরণ কার্ড JSON ফেরত দিয়ে একটি কার্ড বার্তা পাঠায়। আপনি Apps স্ক্রিপ্ট কার্ড পরিষেবাও ব্যবহার করতে পারেন৷

apps-script/preview-link/preview-link.gs

GitHub এ দেখুন

// Attach a card to the message for URLs of the subdomain "support"
if (event.message.matchedUrl.url.includes("support.example.com")) {
  // A hard-coded card is used in this example. In a real-life scenario,
  // the case information would be fetched and used to build the card.
  return {
    actionResponse: { type: 'UPDATE_USER_MESSAGE_CARDS' },
    cardsV2: [{
      cardId: 'attachCard',
      card: {
        header: {
          title: 'Example Customer Service Case',
          subtitle: 'Case basics',
        },
        sections: [{ widgets: [
          { decoratedText: { topLabel: 'Case ID', text: 'case123'}},
          { decoratedText: { topLabel: 'Assignee', text: 'Charlie'}},
          { decoratedText: { topLabel: 'Status', text: 'Open'}},
          { decoratedText: { topLabel: 'Subject', text: 'It won\'t turn on...' }},
          { buttonList: { buttons: [{
            text: 'OPEN CASE',
            onClick: { openLink: {
              url: 'https://support.example.com/orders/case123'
            }},
          }, {
            text: 'RESOLVE CASE',
            onClick: { openLink: {
              url: 'https://support.example.com/orders/case123?resolved=y',
            }},
          }, {
            text: 'ASSIGN TO ME',
            onClick: { action: { function: 'assign'}}
          }]}}
        ]}]
      }
    }]
  };
}

একটি লিঙ্ক প্রিভিউ কার্ড আপডেট করুন

আপনার চ্যাট অ্যাপ একটি লিঙ্ক প্রিভিউ কার্ড আপডেট করতে পারে যখন ব্যবহারকারীরা এটির সাথে ইন্টারঅ্যাক্ট করেন, যেমন কার্ডের একটি বোতামে ক্লিক করা।

কার্ডটি আপডেট করার জন্য, আপনার চ্যাট অ্যাপটিকে অবশ্যই CARD_CLICKED ইন্টারঅ্যাকশন ইভেন্ট পরিচালনা করতে হবে এবং লিঙ্কের পূর্বরূপ ধারণ করে কে বার্তা পাঠিয়েছে তার ভিত্তিতে একটি actionResponse ফেরত দিতে হবে:

যদি কোনো ব্যবহারকারী বার্তা পাঠিয়ে থাকেন, actionResponse.type সেট করুন UPDATE_USER_MESSAGE_CARDS ।
যদি চ্যাট অ্যাপ বার্তাটি পাঠিয়ে থাকে, তাহলে actionResponse.type কে UPDATE_MESSAGE এ সেট করুন।

কে বার্তা পাঠিয়েছে তা নির্ধারণ করতে, আপনি প্রেরক একজন HUMAN ব্যবহারকারী বা BOT কিনা তা দেখতে ইন্টারঅ্যাকশন ইভেন্টের message.sender.type ক্ষেত্রটি ব্যবহার করতে পারেন।

নিম্নলিখিত উদাহরণটি দেখায় যে কীভাবে একটি চ্যাট অ্যাপ একটি লিঙ্ক প্রিভিউ আপডেট করে যখনই একজন ব্যবহারকারী কার্ডের অ্যাসাইনি ফিল্ড আপডেট করে এবং বোতামটি নিষ্ক্রিয় করে আমাকে অ্যাসাইন বোতামে ক্লিক করেন।

চ্যাট অ্যাপ একটি বার্তার সাথে সংযুক্ত একটি কার্ডের একটি আপডেট সংস্করণ সহ একটি লিঙ্কের পূর্বরূপ দেখায়৷

Node.js

node/preview-link/index.js

GitHub এ দেখুন

/**
 * Updates a card that was attached to a message with a previewed link.
 *
 * @param {Object} event The event object from Chat.
 *
 * @return {Object} Response from the Chat app. Either a new card attached to
 * the message with the previewed link, or an update to an existing card.
 */
function onCardClick(event) {
  // To respond to the correct button, checks the button's actionMethodName.
  if (event.action.actionMethodName === 'assign') {
    // A hard-coded card is used in this example. In a real-life scenario,
    // an actual assign action would be performed before building the card.

    // Checks whether the message event originated from a human or a Chat app
    // and sets actionResponse.type to "UPDATE_USER_MESSAGE_CARDS if human or
    // "UPDATE_MESSAGE" if Chat app.
    const actionResponseType = event.message.sender.type === 'HUMAN' ?
      'UPDATE_USER_MESSAGE_CARDS' :
      'UPDATE_MESSAGE';

    // Returns the updated card that displays "You" for the assignee
    // and that disables the button.
    return {
      actionResponse: { type: actionResponseType },
      cardsV2: [{
        cardId: 'attachCard',
        card: {
          header: {
            title: 'Example Customer Service Case',
            subtitle: 'Case basics',
          },
          sections: [{ widgets: [
            { decoratedText: { topLabel: 'Case ID', text: 'case123'}},
            // The assignee is now "You"
            { decoratedText: { topLabel: 'Assignee', text: 'You'}},
            { decoratedText: { topLabel: 'Status', text: 'Open'}},
            { decoratedText: { topLabel: 'Subject', text: 'It won\'t turn on...' }},
            { buttonList: { buttons: [{
              text: 'OPEN CASE',
              onClick: { openLink: {
                url: 'https://support.example.com/orders/case123'
              }},
            }, {
              text: 'RESOLVE CASE',
              onClick: { openLink: {
                url: 'https://support.example.com/orders/case123?resolved=y',
              }},
            }, {
              text: 'ASSIGN TO ME',
              // The button is now disabled
              disabled: true,
              onClick: { action: { function: 'assign'}}
            }]}}
          ]}]
        }
      }]
    };
  }
}

পাইথন

python/preview-link/main.py

GitHub এ দেখুন

def on_card_click(event: dict) -> dict:
  """Updates a card that was attached to a message with a previewed link."""
  # To respond to the correct button, checks the button's actionMethodName.
  if 'assign' == event.get('action').get('actionMethodName'):
    # A hard-coded card is used in this example. In a real-life scenario,
    # an actual assign action would be performed before building the card.

    # Checks whether the message event originated from a human or a Chat app
    # and sets actionResponse.type to "UPDATE_USER_MESSAGE_CARDS if human or
    # "UPDATE_MESSAGE" if Chat app.
    actionResponseType = 'UPDATE_USER_MESSAGE_CARDS' if \
      event.get('message').get('sender').get('type') == 'HUMAN' else \
      'UPDATE_MESSAGE'

    # Returns the updated card that displays "You" for the assignee
    # and that disables the button.
    return {
      'actionResponse': { 'type': actionResponseType },
      'cardsV2': [{
        'cardId': 'attachCard',
        'card': {
          'header': {
            'title': 'Example Customer Service Case',
            'subtitle': 'Case basics',
          },
          'sections': [{ 'widgets': [
            { 'decoratedText': { 'topLabel': 'Case ID', 'text': 'case123'}},
            # The assignee is now "You"
            { 'decoratedText': { 'topLabel': 'Assignee', 'text': 'You'}},
            { 'decoratedText': { 'topLabel': 'Status', 'text': 'Open'}},
            { 'decoratedText': { 'topLabel': 'Subject', 'text': 'It won\'t turn on...' }},
            { 'buttonList': { 'buttons': [{
              'text': 'OPEN CASE',
              'onClick': { 'openLink': {
                'url': 'https://support.example.com/orders/case123'
              }},
            }, {
              'text': 'RESOLVE CASE',
              'onClick': { 'openLink': {
                'url': 'https://support.example.com/orders/case123?resolved=y',
              }},
            }, {
              'text': 'ASSIGN TO ME',
              # The button is now disabled
              'disabled': True,
              'onClick': { 'action': { 'function': 'assign'}}
            }]}}
          ]}]
        }
      }]
    }

জাভা

java/preview-link/src/main/java/com/google/chat/preview/App.java

GitHub এ দেখুন

// Updates a card that was attached to a message with a previewed link.
GenericJson onCardClick(JsonNode event) {
  // To respond to the correct button, checks the button's actionMethodName.
  if (event.at("/action/actionMethodName").asText().equals("assign")) {
    // A hard-coded card is used in this example. In a real-life scenario,
    // an actual assign action would be performed before building the card.

    // Checks whether the message event originated from a human or a Chat app
    // and sets actionResponse.type to "UPDATE_USER_MESSAGE_CARDS if human or
    // "UPDATE_MESSAGE" if Chat app.
    String actionResponseType =
      event.at("/message/sender/type").asText().equals("HUMAN")
      ? "UPDATE_USER_MESSAGE_CARDS" : "UPDATE_MESSAGE";

    // Returns the updated card that displays "You" for the assignee
    // and that disables the button.
    GoogleAppsCardV1CardHeader header = new GoogleAppsCardV1CardHeader();
    header.setTitle("Example Customer Service Case");
    header.setSubtitle("Case basics");

    GoogleAppsCardV1DecoratedText caseIdDecoratedText = new GoogleAppsCardV1DecoratedText();
    caseIdDecoratedText.setTopLabel("Case ID");
    caseIdDecoratedText.setText("case123");

    GoogleAppsCardV1Widget caseIdWidget = new GoogleAppsCardV1Widget();
    caseIdWidget.setDecoratedText(caseIdDecoratedText);

    GoogleAppsCardV1DecoratedText assigneeDecoratedText = new GoogleAppsCardV1DecoratedText();
    assigneeDecoratedText.setTopLabel("Assignee");
    // The assignee is now "You"
    assigneeDecoratedText.setText("You");

    GoogleAppsCardV1Widget assigneeWidget = new GoogleAppsCardV1Widget();
    assigneeWidget.setDecoratedText(assigneeDecoratedText);

    GoogleAppsCardV1DecoratedText statusDecoratedText = new GoogleAppsCardV1DecoratedText();
    statusDecoratedText.setTopLabel("Status");
    statusDecoratedText.setText("Open");

    GoogleAppsCardV1Widget statusWidget = new GoogleAppsCardV1Widget();
    statusWidget.setDecoratedText(statusDecoratedText);

    GoogleAppsCardV1DecoratedText subjectDecoratedText = new GoogleAppsCardV1DecoratedText();
    subjectDecoratedText.setTopLabel("Subject");
    subjectDecoratedText.setText("It won't turn on...");

    GoogleAppsCardV1Widget subjectWidget = new GoogleAppsCardV1Widget();
    subjectWidget.setDecoratedText(subjectDecoratedText);

    GoogleAppsCardV1OpenLink openOpenLink = new GoogleAppsCardV1OpenLink();
    openOpenLink.setUrl("https://support.example.com/orders/case123");

    GoogleAppsCardV1OnClick openOnClick = new GoogleAppsCardV1OnClick();
    openOnClick.setOpenLink(openOpenLink);

    GoogleAppsCardV1Button openButton = new GoogleAppsCardV1Button();
    openButton.setText("OPEN CASE");
    openButton.setOnClick(openOnClick);

    GoogleAppsCardV1OpenLink resolveOpenLink = new GoogleAppsCardV1OpenLink();
    resolveOpenLink.setUrl("https://support.example.com/orders/case123?resolved=y");

    GoogleAppsCardV1OnClick resolveOnClick = new GoogleAppsCardV1OnClick();
    resolveOnClick.setOpenLink(resolveOpenLink);

    GoogleAppsCardV1Button resolveButton = new GoogleAppsCardV1Button();
    resolveButton.setText("RESOLVE CASE");
    resolveButton.setOnClick(resolveOnClick);

    GoogleAppsCardV1Action assignAction = new GoogleAppsCardV1Action();
    assignAction.setFunction("assign");

    GoogleAppsCardV1OnClick assignOnClick = new GoogleAppsCardV1OnClick();
    assignOnClick.setAction(assignAction);

    GoogleAppsCardV1Button assignButton = new GoogleAppsCardV1Button();
    assignButton.setText("ASSIGN TO ME");
    // The button is now disabled
    assignButton.setDisabled(true);
    assignButton.setOnClick(assignOnClick);

    GoogleAppsCardV1ButtonList buttonList = new GoogleAppsCardV1ButtonList();
    buttonList.setButtons(List.of(openButton, resolveButton, assignButton));

    GoogleAppsCardV1Widget buttonListWidget = new GoogleAppsCardV1Widget();
    buttonListWidget.setButtonList(buttonList);

    GoogleAppsCardV1Section section = new GoogleAppsCardV1Section();
    section.setWidgets(List.of(caseIdWidget, assigneeWidget, statusWidget, subjectWidget, buttonListWidget));

    GoogleAppsCardV1Card card = new GoogleAppsCardV1Card();
    card.setHeader(header);
    card.setSections(List.of(section));

    GenericJson cardV2 = new GenericJson();
    cardV2.set("cardId", "attachCard");
    cardV2.set("card", card);

    GenericJson actionResponse = new GenericJson();
    actionResponse.set("type", actionResponseType);

    GenericJson response = new GenericJson();
    response.set("actionResponse", actionResponse);
    response.set("cardsV2", List.of(cardV2));
    return response;
  }
  return new GenericJson();
}

অ্যাপস স্ক্রিপ্ট

apps-script/preview-link/preview-link.gs

GitHub এ দেখুন

/**
 * Updates a card that was attached to a message with a previewed link.
 *
 * @param {Object} event The event object from Chat.
 *
 * @return {Object} Response from the Chat app. Either a new card attached to
 * the message with the previewed link, or an update to an existing card.
 */
function onCardClick(event) {
  // To respond to the correct button, checks the button's actionMethodName.
  if (event.action.actionMethodName === 'assign') {
    // A hard-coded card is used in this example. In a real-life scenario,
    // an actual assign action would be performed before building the card.

    // Checks whether the message event originated from a human or a Chat app
    // and sets actionResponse.type to "UPDATE_USER_MESSAGE_CARDS if human or
    // "UPDATE_MESSAGE" if Chat app.
    const actionResponseType = event.message.sender.type === 'HUMAN' ?
      'UPDATE_USER_MESSAGE_CARDS' :
      'UPDATE_MESSAGE';

    // Returns the updated card that displays "You" for the assignee
    // and that disables the button.
    return {
      actionResponse: { type: actionResponseType },
      cardsV2: [{
        cardId: 'attachCard',
        card: {
          header: {
            title: 'Example Customer Service Case',
            subtitle: 'Case basics',
          },
          sections: [{ widgets: [
            { decoratedText: { topLabel: 'Case ID', text: 'case123'}},
            // The assignee is now "You"
            { decoratedText: { topLabel: 'Assignee', text: 'You'}},
            { decoratedText: { topLabel: 'Status', text: 'Open'}},
            { decoratedText: { topLabel: 'Subject', text: 'It won\'t turn on...' }},
            { buttonList: { buttons: [{
              text: 'OPEN CASE',
              onClick: { openLink: {
                url: 'https://support.example.com/orders/case123'
              }},
            }, {
              text: 'RESOLVE CASE',
              onClick: { openLink: {
                url: 'https://support.example.com/orders/case123?resolved=y',
              }},
            }, {
              text: 'ASSIGN TO ME',
              // The button is now disabled
              disabled: true,
              onClick: { action: { function: 'assign'}}
            }]}}
          ]}]
        }
      }]
    };
  }
}

সীমা এবং বিবেচনা

আপনি আপনার চ্যাট অ্যাপের জন্য লিঙ্ক প্রিভিউ কনফিগার করার সময়, এই সীমা এবং বিবেচনাগুলি নোট করুন:

প্রতিটি চ্যাট অ্যাপ 5টি পর্যন্ত URL প্যাটার্নের জন্য লিঙ্ক প্রিভিউ সমর্থন করে।
চ্যাট অ্যাপস প্রতি বার্তা প্রতি একটি লিঙ্কের পূর্বরূপ। যদি একাধিক পূর্বদর্শনযোগ্য লিঙ্ক একটি একক বার্তায় উপস্থিত থাকে, তবে শুধুমাত্র প্রথম পূর্বদর্শনযোগ্য লিঙ্কের পূর্বরূপ।
চ্যাট অ্যাপগুলি শুধুমাত্র https:// দিয়ে শুরু হওয়া লিঙ্কগুলির পূর্বরূপ দেখায়, তাই https://support.example.com/cases/ previews, কিন্তু support.example.com/cases/ করে না৷
স্ল্যাশ কমান্ডের মতো চ্যাট অ্যাপে পাঠানো অন্যান্য তথ্য বার্তাটিতে না থাকলে, শুধুমাত্র লিঙ্কের ইউআরএলটি চ্যাট অ্যাপে লিঙ্ক প্রিভিউ দ্বারা পাঠানো হয়।
যদি কোনও ব্যবহারকারী লিঙ্কটি পোস্ট করেন, একটি চ্যাট অ্যাপ শুধুমাত্র লিঙ্ক প্রিভিউ কার্ড আপডেট করতে পারে যদি ব্যবহারকারীরা কার্ডের সাথে ইন্টারঅ্যাক্ট করেন, যেমন একটি বোতামে ক্লিক করে। ব্যবহারকারীর বার্তা অ্যাসিঙ্ক্রোনাসভাবে আপডেট করার জন্য আপনি Message সংস্থানে চ্যাট API-এর update() পদ্ধতিতে কল করতে পারবেন না।
চ্যাট অ্যাপ্লিকেশানগুলিকে অবশ্যই স্থানের প্রত্যেকের জন্য লিঙ্কগুলির পূর্বরূপ দেখতে হবে, তাই বার্তাটি অবশ্যই privateMessageViewer ক্ষেত্রটি বাদ দিতে হবে৷

ডিবাগ লিঙ্ক প্রিভিউ

আপনি লিঙ্ক প্রিভিউ প্রয়োগ করার সময়, আপনাকে অ্যাপের লগ পড়ে আপনার চ্যাট অ্যাপ ডিবাগ করতে হতে পারে। লগগুলি পড়তে, Google ক্লাউড কনসোলে লগ এক্সপ্লোরারে যান৷