デジタルエクスペリエンス エージェントのインストール

前提条件

エージェントのダウンロード

SixthSense エージェント "@sixthsense/sixthsense-de-agent": "^1.0.3" をプロジェクトの依存関係としてダウンロードします（この依存関係をアプリケーションの package.json ファイルに追加します）。

例:

"dependencies": {
"async": "^1.5.2",
"body-parser": "^1.15.1",
"cookie-parser": "^1.4.3",
"express": "^4.13.4",
"express-session": "^1.13.0",
"finalhandler": "^0.4.1",
"request": "^2.72.0",
"serve-static": "^1.10.2",
"prom-client": "^6.3.0",
"morgan": "^1.7.0",
"connect-redis": "^3.2.0",
"@sixthsense/sixthsense-de-agent": "^3.4.0"
}

エージェントの設定

エージェントの設定は、アプリケーションのエントリーポイントに追加されます。

React JS

SixthSense デジタルエクスペリエンス内容
サービス名アプリケーションの名称
api_hostカスタマーサポートチームから提供されるテナント URL
authorizationSixthSense ポータルよりアクセストークンを取得します。
// Index.js file
import sixthsenseDE from '@sixthsense/sixthsense-de-agent'
sixthsenseDE.init('#authorization','#service_name',{api_host:'#api_host', disable_session_recording: false, autocapture: false, capture_pageview: false})
// App.js
import { SixthsenseDE } from 'sixthsense-de-agent';
import {useLocation} from "react-router-dom";
const location = useLocation();
useEffect(() => {
SixthsenseDE.capture('$pageview');
}, [location]);

Vue JS

sixthsense-de.js プラグインを追加します。

import sixthsenseDE from '@sixthsense/sixthsense-de-agent';
export default {
install(Vue, options) {
Vue.prototype.$posthog = sixthsenseDE.init('#authorization','#service_name',{api_host:'#api_host', disable_session_recording: false, autocapture: false, capture_pageview: false})
},
};
// App.vue
import sixthsenseDE from '@sixthsense/sixthsense-de-agent';
watch: {
$route(to, from) {
sixthsenseDE.capture('$pageview');
},
},
//main.ts
import sixthsenseDe from './plugins/sixthsense-de';
Vue.use(sixthsenseDe);

SixthSense ポータルよりアクセストークンを取得

  1. SixthSenseポータルにログインします。
  2. 左側のペインにある [設定] に移動します。
  3. [アクセス トークン] に移動します。
  4. [アクセス トークンを表示] をクリックします。
  5. [コピー] をクリックしてアクセス トークンをコピーし、token_from_ui に追加します。

アプリケーションの実行

npm install コマンドを実行する前に、以下の各コマンドを1つずつ実行します。

npm config set "@sixthsense:registry" https://artifacts-observability.sixthsense.rakuten.com/api/v4/projects/46/packages/npm/
npm config set -- '//artifacts-observability.sixthsense.rakuten.com/api/v4/projects/46/packages/npm/:_authToken' "${PACKAGE_TOKEN}"`
  • PACKAGE_TOKEN (オンボーディングチームから提供されます)。
  • npm install コマンドを実行して、すべての依存関係をダウンロードします (npm i @sixthsense/sixthsense-de-agent) 。
  • start コマンドを実行して、アプリケーションを実行します。

Docker でのエージェント統合

エージェントの設定を参照してください。

Docker ファイルへの「依存関係の追加」と「構成のダウンロード」

  • SixthSense エージェントは、楽天のセルフホスト型プライベートパッケージマネージャーでホストされています。パッケージをダウンロードするには、認証のため追加の手順が必要です。
  • 以下のコード スニペットを、Docker ファイル内の NPM インストールコマンドの前に追加します。
npm config set "@sixthsense:registry" https://artifacts-observability.sixthsense.rakuten.com/api/v4/projects/46/packages/npm/ && \
npm config set -- '//artifacts-observability.sixthsense.rakuten.com/api/v4/projects/46/packages/npm/:_authToken' "${PACKAGE_TOKEN}"
  • この設定により、SixthSense パッケージレジストリを識別するための構成が設定され、依存関係にあるパッケージ .json ファイルで同じ名前で定義した URL からダウンロードするように指示されます。
  • https://artifacts-observability.sixthsense.rakuten.com/api/v4/projects/9/packages/npm/　（SixthSense パッケージマネージャーの URL）。
  • _authToken' "PACKAGE_TOKEN"– パッケージはプライベートパッケージマネージャーでホストされているため、ユーザーを識別するために認証が必要となります。この認証トークンは、オンボーディング中に定義されます。
  • 手続きの簡略化のため、認証トークンは Docker ファイルに配置されています。ただし、認証トークンを Docker ファイルに追加してバージョン管理リポジトリにプッシュされるのを希望しない場合は、環境変数を設定して Jenkins CI/CD からシークレットを渡すなど、認証管理に基づいてこの認証トークンを渡すことが可能です。
  • その後、docker build を使用してアプリケーションをビルドし、Docker イメージ/コンテナを実行します。 するとエージェントがアプリケーションに統合され、SixthSense ダッシュボードにメトリクスが表示されるようになります。

PACKAGE_TOKEN をビルド引数として渡します。

docker build --build-arg PACKAGE_TOKEN=${PACKAGE_TOKEN_VALUE} -t service:tag .

例： Docker 構成

FROM node:10-alpine
ENV NODE_ENV "production"
ENV PORT 8079
EXPOSE 8079
RUN addgroup mygroup && adduser -D -G mygroup myuser && mkdir -p /usr/src/app && chown -R myuser /usr/src/app
# Prepare app directory
WORKDIR /usr/src/app
COPY package.json /usr/src/app/
COPY yarn.lock /usr/src/app/
RUN chown myuser /usr/src/app/yarn.lock
USER myuser
RUN mkdir sixthsense-logs
ARG PAT
RUN npm config set "@sixthsense:registry" https://artifacts-observability.sixthsense.rakuten.com/api/v4/projects/46/packages/npm/ && \
npm config set -- '//artifacts-observability.sixthsense.rakuten.com/api/v4/projects/46/packages/npm/:_authToken' "${PAT}"
# RUN yarn add @sixthsense/sixthsense-de-agent
RUN yarn install
COPY . /usr/src/app
# Start the app
CMD ["/usr/local/bin/npm", "start"]