Zendesk 配置 js 文件：如何在网站打开时不自动打开聊天

Question

我正在 Zendesk 上尝试一些功能，当我打开网站时，聊天似乎会自动打开。 我怎样才能使它保持关闭状态，直到我实际单击聊天按钮打开聊天窗口。 下面是我的 ZendeskConfig.js 文件：

import { Component } from "react";
import PropTypes from "prop-types";

const canUseDOM = () => {
  if (
    typeof window === "undefined" ||
    !window.document ||
    !window.document.createElement
  ) {
    return false;
  }
  return true;
};

export const ZendeskAPI = (...args) => {
  if (canUseDOM && window.zE) {
    window.zE.apply(null, args);
  } else {
    console.warn("Zendesk is not initialized yet");
  }
};

export default class Zendesk extends Component {
  constructor(props) {
    super(props);
    this.insertScript = this.insertScript.bind(this);
    this.onScriptLoaded = this.onScriptLoaded.bind(this);
  }

  onScriptLoaded() {
    if (typeof this.props.onLoaded === "function") {
      this.props.onLoaded();
    }
  }

  insertScript(zendeskKey, defer) {
    const script = document.createElement("script");
    if (defer) {
      script.defer = true;
    } else {
      script.async = true;
    }
    script.id = "ze-snippet";
    script.src = `https://static.zdassets.com/ekr/snippet.js?key=${zendeskKey}`;
    script.addEventListener("load", this.onScriptLoaded);
    // added this to solve double chat window problem
    if (document.getElementById("ze-snippet"))
      return
    document.body.appendChild(script);
  }

  componentDidMount() {
    if (canUseDOM && !window.zE) {
      const { defer, zendeskKey, ...other } = this.props;
      this.insertScript(zendeskKey, defer);
      window.zESettings = other;
    }

  }

  componentWillUnmount() {
    if (!canUseDOM || !window.zE) {
      return;
    }
    delete window.zE;
    delete window.zESettings;
  }

  render() {
    return null;
  }
}

Zendesk.propTypes = {
  zendeskKey: PropTypes.string.isRequired,
  defer: PropTypes.bool,
};

非常感谢你

尝试操作 DOM 但没有成功

Answer 1

Zendesk 文档包含“抑制”选项，该选项允许您阻止自动打开聊天。

要启用此功能，只需创建一个用于抑制控制的新变量并插入以下代码：

window.zESettings = {
    ...other,
    chat: {
      suppress: chatSuppressed,
    },
  };

Zendesk.propTypes = {
  zendeskKey: PropTypes.string.isRequired,
  defer: PropTypes.bool,
  chatSuppressed: PropTypes.bool, 
};