```
## 八、応用的な使用テクニック
### 1. 動的な設定更新
```jsx
// テーマカラーを動的に更新
function updateTheme(color) {
// 注意：反映させるには再初期化が必要です
window.maiagentChatbotConfig.primaryColor = color
initializeChatbot()
// SDK を再読み込みするか、ページを再読み込み
}
```
### 2. エラー処理
```jsx
// SDK が利用可能かを確認
function checkSDKAvailability() {
if (typeof MaiAgent === 'undefined') {
console.error('MaiAgent SDK が読み込まれていません')
return false
}
if (!MaiAgent.control) {
console.error('MaiAgent SDK が完全に初期化されていません')
return false
}
return true
}
// 安全に SDK を使用
function safeOpenChat() {
if (checkSDKAvailability()) {
MaiAgent.control.open()
}
else {
alert('チャットサービスは一時的にご利用いただけません。しばらくしてから再度お試しください')
}
}
```
### 3. 他のシステムとの統合
```jsx
// Google Analytics との統合
MaiAgent.events.on('messageReply', (data) => {
// チャットのインタラクションイベントを記録
if (typeof gtag !== 'undefined') {
gtag('event', 'chat_interaction', {
event_category: 'engagement',
event_label: 'bot_reply',
value: 1
})
}
})
```
## 九、トラブルシューティング
### 1. よくある問題
1. **SDK が読み込まれない**
* `maiagentChatbotConfig` が SDK スクリプトより前に定義されているか確認してください
* ネットワーク接続とスクリプト URL が正しいか確認してください
2. **チャットウィンドウが開かない**
* `webChatId` と `baseUrl` の設定が正しいか確認してください
* ブラウザのコンソールにエラーメッセージがないか確認してください
3. **イベントリスナーが機能しない**
* DOM の読み込み完了後にイベントリスナーを登録しているか確認してください
* イベント名が正しいか確認してください
4. **ボタンの位置が異常**
* CSS の競合を確認してください
* 位置パラメータの形式が正しいか確認してください
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:
```
GET https://docs.maiagent.ai/tech/maiagent-tech-ja/api-integration/web-chat-sdk.md?ask=&goal=
```
`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.