Skip to main content

Tích hợp AhaSpot với Vue.js

Để tích hợp AhaSpot với ứng dụng Vue.js, bạn cần dán đoạn mã script của tiện ích trò chuyện trực tiếp AhaSpot vào tệp index.html trong ứng dụng Vue.js của mình.

Dưới đây là cách thực hiện:

1. Lấy đoạn mã script​

Đoạn mã script bạn có thể tìm thấy trong cài đặt Hộp thư đến trên trang AhaSpot của bạn.

Đi tới Cài đặt → Hộp thư đến → Chọn tab Cấu hình → nhẫn vào nút Sao chép

Nếu bạn chưa tạo kênh website, bạn có thể tìm thấy hướng dẫn từng bước tại đây .

2. Dán đoạn mã script tại đây​

Mở dự án Vue của bạn và dán đaonj script vào tệp index.html, ngay trước thẻ </body>

<body>
  <noscript>
    <strong
      >We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work
      properly without JavaScript enabled. Please enable it to continue.</strong
    >
  </noscript>
  <div id="app"></div>
  <!-- built files will be auto injected -->

  <!-- Tập lệnh script AhaSpot tại đây -->  
    <script>
      (function(d,t) {
        var BASE_URL="https://app.ahaspot.com";
        var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
        g.src=BASE_URL+"/packs/js/sdk.js";
        g.defer = true;
        g.async = true;
        s.parentNode.insertBefore(g,s);
        g.onload=function(){
          window.chatwootSDK.run({
            websiteToken: 'PY6tJKgSFoYYdXHUSGtPD2MG',
            baseUrl: BASE_URL
          })
        }
      })(document,"script");
    </script>    
  <!-- Tập lệnh script AhaSpot tại đây -->
</body>

4. Kiểm tra!​

Bây giờ bạn có thể thấy tiện ích trò chuyện AhaSpot trên trang như thế này:

vuejs integration