{"id":41,"type":"Article","title":"使用Chrome插件快速体验浩客","slug":"web-sdk-chrome","content":"在产品中使用浩客，需要由研发完成SDK的部署上线。在此之前，如果想在自己的产品中快速体验浩客问卷的能力，可参考本文，使用浩客Chrome浏览器插件（HowXM tools）完成。\r\n\r\n# 插件安装\r\n\r\n\r\n# 在线安装（可访问Chrome应用商店时使用）\r\n\r\n\r\n1. [点击这里](https://chrome.google.com/webstore/detail/howxm-tools/anhinnebdhplihakagdjmdpfdhnbnhhk?hl=zh-CN)，打开插件页面\r\n\r\n2. 点击**「添加至Chrome」**即可\r\n\r\n\r\n# 离线安装（当前仅支持Chrome 浏览器）\r\n\r\n\r\n[**点击这里**](https://static.howxm.com/howxm-chrome-extension-latest.zip)，下载zip文件，并解压缩\r\n\r\n打开扩展程序管理（方法：点击右上角-更多工具-扩展程序）\r\n\r\n![](https://help-assets.jinshuju.net/assets/file/493/1280X1280.png)\r\n\r\n\r\n打开页面顶部**【开发者模式】**(打开后建议刷新当前页面之后再进行下一步操作)\r\n\r\n\r\n![](https://help-assets.jinshuju.net/assets/file/495/1280X1280__1_.png)\r\n\r\n\r\n点击「加载已解压的扩展程序」，并选择第一步解压缩的文件夹即可（压缩包名称下的build文件夹）\r\n\r\n\r\n![](https://help-assets.jinshuju.net/assets/file/496/1280X1280__2_.png)\r\n\r\n\r\n完成后出现下面的页面代表安装成功\r\n\r\n\r\n![](https://help-assets.jinshuju.net/assets/file/501/1280X1280__3_.png)\r\n\r\n\r\n\r\n# 插件使用\r\n\r\n\r\n访问你的系统地址，页面内右键菜单会出现「HowXM Tooles」，并提供了两个菜单：\r\n\r\n- 弹出默认浩客问卷\r\n- 弹出自定义浩客问卷\r\n\r\n\r\n![](https://help-assets.jinshuju.net/assets/file/504/4824dded-d934-4246-ac1e-9ce8d3aa0579.png)\r\n\r\n\r\n# 弹出默认问卷\r\n\r\n\r\n浩客内置了一个问卷，可以支持在任一页面弹出，方便您快速体验，效果如下\r\n\r\n\r\n![](https://help-assets.jinshuju.net/assets/file/508/b06f0765-0dd3-470e-86f4-99c30ffbb295.png)\r\n\r\n\r\n\r\n# 弹出自定义问卷\r\n\r\n\r\n可以将自己浩客账户下创建的任意问卷，展示在网站上。例如在36氪主页展示自己的问卷\r\n\r\n\r\n![](https://help-assets.jinshuju.net/assets/file/519/4dc3dff3-cdeb-4f4e-bace-667f70b6aef4.png)\r\n\r\n\r\n\r\n**步骤1：在浩客内创建应用和问卷**\r\n\r\n在浩客创建**「网站/H5」**应用，获取appid。\r\n  1. 查看如何创建应用，请访问[快速上手浩客XM ](https://howxm.com/help/articles/quick-start)。\r\n  2. 应用的地址输入36氪的网址：https://36kr.com\r\n  3.  appid从追踪代码处获取，如下图\r\n\r\n\r\n\r\n![](https://help-assets.jinshuju.net/assets/file/1249/WeChatWorkScreenshot_969109a6-d516-437a-92ce-f274ddd0019a.png)\r\n\r\n\r\n如何获取问卷/评价ID？\r\n![](https://help-assets.jinshuju.net/assets/file/1379/%E4%BC%81%E4%B8%9A%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_7df06739-ade6-4e41-931a-355d9493c2cf.png)\r\n\r\n\r\n\r\n\r\n\r\n**步骤2：在插件中配置AppId和问卷ID**\r\n\r\n将插件固定在菜单栏\r\n\r\n\r\n\r\n![](https://help-assets.jinshuju.net/assets/file/542/b557fcde-f4ba-477d-85b8-7229d1f8d2aa.png)\r\n\r\n\r\n\r\n右键点击插件图标，再点击**「选项」**，进入配置页面，输入AppId和问卷ID\r\n    1. 此操作只用设置一次\r\n    2. 问卷ID为该网站下弹出的默认问卷，此处也可以不设置\r\n\r\n\r\n![](https://help-assets.jinshuju.net/assets/file/554/09c960d6-b613-47f2-b565-260683ad25bb.png)\r\n\r\n\r\n\r\n\r\n\r\n**步骤3：在网站上查看并填写**\r\n   \r\n打开 36氪的页面，点击右键选择「弹出自定义浩客问卷」，在弹出框中输入问卷ID\r\n    1. 此处会将设置页面的问卷ID默认带出\r\n    2. 也可在此处临时修改展示其他问卷\r\n\r\n\r\n![](https://help-assets.jinshuju.net/assets/file/567/c47cc004-df3a-4443-aa58-19355decae8d.png)\r\n\r\n![](https://help-assets.jinshuju.net/assets/file/580/dc300d82-e539-46dd-96ac-95984bd5e4f2.png)\r\n\r\n确定后，则等待问卷弹出。弹出问卷填写提交后，可以在后台查看对应数据\r\n\r\n\r\n![](https://help-assets.jinshuju.net/assets/file/613/77ca8589-9ec3-43e9-a333-1b066b5ea36a.png)\r\n\r\n\r\n\r\n# 注意事项\r\n\r\n- 此插件弹出的问卷使用浩客SDK提供的[open](https://howxm.com/help/articles/x-sdk-api)接口，忽略问卷的[免打扰规则](https://howxm.com/help/articles/distribution-strategy)\r\n- 此插件会将浩客的WebSDK插入在您操作的页面中\r\n  - 只在点击了菜单选项后，才会执行插入操作\r\n  - 当刷新页面后，该SDK会自动清除\r\n\r\n# 问卷为何未弹出？\r\n1. 已经集成浩客WebSDK的网站不能使用\r\n2. 对未集成网站，此插件大部门都适用，但是不同网站的有不同的安全设置规则，因此可能会出现不能弹出的情况。 此时请打开浏览器的开发者工具（右键点击打开对应菜单，或者按F12）查看，您也可以将控制台截图发送给我们进行确认。\r\n\r\n例如知乎无法弹出：\r\n\r\n![](https://help-assets.jinshuju.net/assets/file/595/30e4a25a-ff72-479f-8e34-3f4f8d4e1985.png)\r\n\r\n\r\n","featured":false,"category_id":3,"created_at":"2023-02-15T02:24:17.386Z","updated_at":"2023-05-06T09:33:58.589Z"}