Integrasi chat Salesforce

Integrasi chat ini menggunakan Komponen Web Lightning (LWC) Salesforce untuk berintegrasi dengan modul UI Agent Assist untuk percakapan chat.

Berikut ringkasan umum integrasi chat:

Arsitektur untuk integrasi chat Agent Assist dengan Salesforce

Sebelum memulai

Untuk mengintegrasikan modul UI Agent Assist dengan Salesforce, Anda memerlukan akses ke resource berikut:

  • Node.js: Ikuti petunjuk penginstalan yang direkomendasikan untuk sistem operasi Anda.

  • Salesforce CLI: Ikuti petunjuk penginstalan yang direkomendasikan untuk sistem operasi Anda.

  • Google Cloud CLI: Instal perintah gcloud seperti yang diinstruksikan dan lakukan autentikasi menggunakan gcloud auth login.

  • Salesforce: Login di URL instance Anda atau halaman login Salesforce dan perhatikan hal berikut:

    • URL Domain Saya Salesforce Anda. Ikuti langkah-langkah berikut untuk menemukan Domain Saya URL:
      1. Buka menu bar > menu Penyiapan.
      2. Klik Penyiapan.
      3. Di kotak Quick Find, masukkan My Domain. Nama domain dalam format berikut: MY-DOMAIN-NAME.develop.my.salesforce.com.
    • ID organisasi Salesforce Anda. Ikuti langkah-langkah berikut untuk menemukan ID organisasi:
      1. Buka menu bar > menu Penyiapan.
      2. Klik Penyiapan.
      3. Di kotak Quick Find, masukkan Company Information.

  • Backend integrasi Agent Assist:

    1. Ikuti petunjuk untuk menyiapkan integrasi.
    2. Sebelum menjalankan skrip deployment, konfigurasikan variabel lingkungan berikut dengan deploy.sh atau dalam file .env di root project:
      • AUTH_OPTION: Tetapkan nilai ini ke SalesforceLWC.
      • SALESFORCE_DOMAIN: Nama domain yang mirip dengan YOUR_SUBDOMAIN.develop.lightning.force.com. Anda mencatat nilai ini dalam prasyarat Salesforce. Perhatikan bahwa Anda tidak boleh menyertakan https://.
      • SALESFORCE_ORGANIZATION_ID: Anda mencatat nilai ini dalam prasyarat Salesforce.

Langkah 1: Menyiapkan project pengembangan Salesforce

Untuk mulai mengintegrasikan modul UI Agent Assist, ikuti langkah-langkah berikut.

  1. Jalankan kode berikut untuk meng-clone repositori integrasi Agent Assist dan membuka project Anda:

    git clone https://github.com/GoogleCloudPlatform/agent-assist-integrations
cd salesforce/aa-lwc

  2. Jalankan perintah berikut untuk mendownload file JavaScript modul UI yang akan Anda deploy nanti sebagai Static Resources. Salesforce memerlukan resource statis untuk memuat JavaScript pihak ketiga. Salesforce juga menerapkan batas 5 MB untuk file resource statis, sehingga file JavaScript diupload sebagai file zip.

    npm run generate-static-resources
npm install

Langkah 2: Menyiapkan lingkungan Salesforce

Anda dapat mengintegrasikan modul UI Agent Assist di lingkungan tertentu, seperti produksi atau pengembangan. Salesforce menyebut lingkungan ini sebagai organisasi (org).

Mengonfigurasi org di konsol Salesforce

Dalam konsol Salesforce, ikuti langkah-langkah berikut untuk mengonfigurasi org Anda untuk integrasi Agent Assist.

  1. Buka menu bar > menu Penyiapan, lalu klik Penyiapan. Di kotak Quick Find, masukkan Omni-Channel Settings, lalu klik Omni-Channel Settings.
    1. Pilih Enable Omni-Channel.
    2. Pilih Automatically log agents into Omni-Channel in the new window or tab.
    3. Klik Simpan.
  2. Buka menu bar > menu Penyiapan, lalu klik Penyiapan. Di kotak Quick Find, masukkan Communities, lalu klik Digital Experiences > Settings.
    1. Pilih Enable Experience Workspaces.
    2. Klik Simpan.

Mengonfigurasi org dengan Salesforce CLI

Ikuti langkah-langkah berikut untuk menggunakan Salesforce CLI guna mengonfigurasi org Anda untuk integrasi Agent Assist.

  1. Jalankan kode berikut dan autentikasi CLI menggunakan detail login Salesforce yang biasanya Anda gunakan.

    npm run login

  2. Jalankan kode berikut untuk men-deploy LWC ke org.

    npm run deploy

Langkah 3: Membuat aplikasi klien eksternal

Salesforce LWC menggunakan alur OAuth 2.0 kredensial klien untuk mengautentikasi Anda. Aplikasi klien eksternal memungkinkan alur kredensial klien. Gunakan kunci pengguna dan rahasia pengguna aplikasi untuk mengonfigurasi Salesforce LWC guna mengautentikasi pengguna dengan Salesforce.

  1. Buka menu bar > menu Penyiapan, lalu klik Penyiapan. Di kotak Quick Find, masukkan External Client App Manager.
    1. Klik External Client App Manager > New External Client App > Create, lalu masukkan informasi berikut.
      • External Client App Name: lwc auth
      • API Name: lwc_auth
      • Contact Email: your_email@example.com
      • API (Enable OAuth Settings) > Enable OAuth: Selected
      • API (Enable OAuth Settings) > Callback URL: https://login.salesforce.com/services/oauth2/callback
      • API (Enable OAuth Settings) > Selected OAuth Scopes: Access the identity URL service
      • API (Enable OAuth Settings) > Enable Client Credentials Flow: Selected
    2. Klik Buat.
  2. Buka menu bar > menu Penyiapan, lalu klik Penyiapan. Di kotak Quick Find, masukkan External Client App Manager.
    1. Klik nama aplikasi klien eksternal Anda > Edit.
    2. Buka OAuth Policies > OAuth Flows and External Client App Enhancements.
    3. Pastikan Enable Client Credentials Flow dipilih.
    4. Untuk Run As, masukkan nama pengguna login Anda.
    5. Klik Simpan.
  3. Buka menu bar > menu Penyiapan, lalu klik Penyiapan. Di kotak Quick Find, masukkan External Client App Manager.
    1. Klik nama aplikasi klien eksternal Anda > Edit.
    2. Buka OAuth Settings > App Settings > Consumer Key and Secret.
    3. Masukkan kode verifikasi yang dikirim ke email Anda.
    4. Salin kunci pengguna dan rahasia pengguna ke tempat yang aman. Anda akan memerlukannya untuk langkah selanjutnya.

Menetapkan kebijakan keamanan konten dan CORS

  1. Buka menu bar > menu Penyiapan, lalu klik Penyiapan.
  2. Di kotak Quick Find, masukkan CORS, lalu klik Edit.
    1. Pilih Enable CORS for OAuth endpoints.
    2. Klik Simpan.
  3. Buka menu bar > menu Penyiapan, lalu klik Penyiapan.
  4. Di kotak Quick Find, masukkan Trusted URLs, lalu klik New Trusted URL.
  5. Masukkan informasi berikut:
    • API Name: ui_connector
    • URL: Masukkan URL endpoint layanan Cloud Run konektor UI yang Anda deploy dengan backend integrasi Agent Assist. Anda dapat menemukan URL ini di konsol Cloud Run. Misalnya: https://UI_CONNECTOR_SUBDOMAIN.GCP_REGION.run.app.
    • CSP Directives: Pilih semua kotak centang.
    • Klik Save &New.
  6. Masukkan informasi berikut:
    • API Name: ui_connector_wss
    • URL: Masukkan URL Secure WebSockets untuk endpoint layanan Konektor UI Anda: wss://UI_CONNECTOR_SUBDOMAIN.GCP_REGION.run.app.
    • CSP Directives: Pilih semua kotak centang.
    • Klik Save &New.
  7. Masukkan informasi berikut:
    • API Name: salesforce_domain
    • URL: Masukkan URL Domain Salesforce Anda dengan format berikut: https://YOUR_SUBDOMAIN.my.salesforce.com.
    • CSP Directives: Pilih semua kotak centang.
    • Klik Simpan.

Langkah 4: Mengonfigurasi klien chat

Untuk menggunakan modul UI Agent Assist dengan Salesforce, Anda memerlukan klien chat di desktop agen.

Mengonfigurasi Chat yang Disempurnakan

Ikuti langkah-langkah berikut untuk mengonfigurasi messenger Anda.

  1. Buka menu bar > menu Penyiapan, lalu klik Penyiapan. Masukkan penelusuran Quick Find untuk Queues, lalu klik New.
    1. Masukkan informasi berikut:
      • Label: Messaging Queue
      • Queue Name: Messaging_Queue
      • Routing Configuration: Messaging_Routing_Configuration
    2. Klik Supported Objects, lalu tambahkan Messaging User dan Messaging Session.
    3. Klik Queue Members, lalu tambahkan User: Your Login User.
    4. Klik Simpan.
  2. Buka menu bar > menu Penyiapan, lalu klik Penyiapan. Di kotak Quick Find, masukkan Permission Sets.
    1. Klik Messaging Agents Permission Set.
    2. Klik Service Presence Statuses Access > Edit.
    3. Pilih status Busy dan Online - Messaging.
    4. Klik Add > Save.
  3. Buka menu bar > menu Penyiapan, lalu klik Penyiapan. Di kotak Quick Find, masukkan Users, lalu klik Users.
    1. Klik nama pengguna Anda dan pastikan Service Cloud User diaktifkan.
    2. Temukan Permission Set License Assignments di halaman.
    3. Klik Edit Assignments, lalu pilih Enhanced Chat User.
    4. Klik Simpan.
    5. Temukan Permission Set Assignments di halaman.
    6. Klik Edit Assignments, lalu pilih Messaging Agent Permission Set.
    7. Klik Add > Save.
  4. Buka menu bar > menu Penyiapan, lalu klik Penyiapan. Di kotak Quick Find, masukkan Messaging Settings, lalu klik New Channel.
    1. Pilih Enhanced Chat.
    2. Masukkan Name: Messaging Channel.
    3. Klik Simpan.
    4. Tetapkan Routing Type ke Omni-Queue dan Queue ke Messaging Queue.
    5. Klik Simpan dan buka Messaging Settings.
    6. Klik nama channel pesan Anda, lalu klik Activate.
    7. Setelah membaca, setujui Terms and Conditions.
  5. Buka menu bar > menu Penyiapan, lalu klik Penyiapan. Di kotak Quick Find, masukkan Embedded Service Deployments, lalu klik New Deployment.
    1. Klik Enhanced Chat > Next > Web > Next.
    2. Isi detail berikut:
      • Name: Messaging Embedded Service Deployment
      • Developer Name: Messaging_Embedded_Service_Deployment
      • Domain: example.com
      • Channel: Messaging Channel
    3. Klik Simpan. Tunggu hingga deployment selesai.
    4. Di setelan Embedded Service Deployment, klik Publish.
    5. Klik Refresh, lalu Test Messaging.

Menguji Chat yang Disempurnakan

Ikuti langkah-langkah berikut untuk menguji messenger Anda.

  1. Klik Test Messaging.
  2. Setelah tab baru dimuat, klik balon ucapan untuk memulai percakapan pengujian baru.
  3. Kirim pesan, seperti Test.
  4. Buka tab browser Salesforce.
  5. Di toolbar Setup, klik menu App Launcher, lalu pilih Service Console.
  6. Klik Omni-Channel di toolbar utilitas.
  7. Tetapkan status Anda ke Online - Messaging.
  8. Terima pesan masuk. Tindakan ini akan membuka tab baru di Service Console untuk percakapan. Anda tidak dapat melihat transkrip chat.
  9. Buka menu bar > menu Penyiapan.
  10. Klik Edit Page.
  11. Dari menu Components, tarik komponen Enhanced Conversation ke panel Conversation.
  12. Klik Save > Activate > Assign as Org Default > Desktop > Back .
  13. Muat ulang halaman.
  14. Klik Omni-Channel di toolbar utilitas.
  15. Tetapkan status Anda ke Online - Messaging.
  16. Balas pesan Test untuk memvalidasi bahwa pesan berfungsi.

Jika Anda mengalami masalah dan memerlukan informasi lebih lanjut, lihat Panduan Penyiapan Chat yang Disempurnakan Salesforce yang komprehensif .

Langkah 5: Menginstal Komponen Web Lightning Salesforce

Ikuti langkah-langkah berikut untuk menambahkan Salesforce LWC ke halaman sesi pesan menggunakan the Lightning Experience Editor. Lanjutkan percakapan pengujian dari Langkah 4.

  1. Buka menu bar > menu Penyiapan, lalu klik Edit Page.

  2. Dari sidebar Components, pindahkan agentAssistContainerModule ke sidebar.

  3. Klik komponen yang Anda tempatkan pada langkah sebelumnya.

  4. Isi kolom formulir sebagai berikut untuk menambahkan detail konfigurasi.

    • endpoint: URL konektor UI Backend Integrasi Agen Anda, seperti URL dari konsol Cloud Run, seperti: https://UI_CONNECTOR_ENDPOINT.GCP_REGION.run.app
    • channel: Tunjukkan bahwa channel adalah chat.
    • platform: Tunjukkan bahwa platform adalah messaging.
    • conversationProfile: Nama resource profil percakapan Agent Assist Anda (contoh:projects/GCP_PROJECT_ID/locations/GCP_REGION/conversationProfiles/CONVERSATION_PROFILE_ID)
    • consumerKey: Kunci pengguna aplikasi klien eksternal dari Langkah 3.
    • consumerSecret: Rahasia pengguna aplikasi klien eksternal dari Langkah 3.
    • containerHeight: Tinggi penampung Agent Assist.