Intercom

Intercom 是 SaaS 产品，接入分两步：先在后台开启 Messenger，再在前端装 SDK 或代码片段。

1. 注册后进入 Settings > Channels > Messenger > Install，选择 Install for web，并打开「Enable connection to messenger」开关；未开启时所有请求都会失败
2. 记下 Workspace ID（也叫 App ID）：登录后地址栏中 apps/ 后面那串字符，例如 https://app.intercom.com/a/apps/ecahpwf5/home 里的 ecahpwf5
3. 前端安装官方 SDK：
```bash
npm install @intercom/messenger-js-sdk
```
或
```bash
yarn add @intercom/messenger-js-sdk
```
4. 也可以不用 npm：直接把后台生成的 JavaScript 代码片段贴到每个页面的 </body> 之前，该片段已预填好你的 Workspace ID
5. Rails 项目可用官方 gem：Gemfile 中加 gem "intercom-rails"，执行 bundle install，再运行 rails generate intercom:config <YOUR APP ID>
6. 其他方式：WordPress 插件（需 WordPress 4.2.0 以上）、Google Tag Manager、Shopify 应用、Segment 目标
7. 装好后在后台点 Check installation 验证是否成功

React 中初始化（官方 SDK 用法）：
```js
import Intercom from "@intercom/messenger-js-sdk";

export default MyPage = () => {
  Intercom({
    app_id: constants.intercom_app_id,
    user_id: user.id,
    name: user.name,
    email: user.email,
    created_at: user.createdAt,
  });
};
```
Remix 项目需改用具名导出：import { Intercom } from "@intercom/messenger-js-sdk";

常用方法（都要在 Intercom({...}) 初始化之后调用）：
```js
import { show, hide, update, shutdown, showSpace } from '@intercom/messenger-js-sdk';

show();                             // 打开 Messenger
hide();                             // 收起面板，不隐藏启动器
update({ name: 'Inigo Montoya' });  // 更新用户属性并拉取新消息
showSpace('help');                  // 另支持 home/messages/news/tasks/tickets
shutdown();                         // 用户登出时清除会话
```

不用 npm 时，原生片段的核心是先设置 window.intercomSettings 再异步加载 widget：
```js
window.intercomSettings = {
  api_base: "https://api-iam.intercom.io",
  app_id: APP_ID,
};
```
数据中心不同 api_base 不同：美国 https://api-iam.intercom.io，欧盟 https://api-iam.eu.intercom.io，澳大利亚 https://api-iam.au.intercom.io。

单页应用在路由或视图变化时调用 window.Intercom("update") 拉取最新消息。