如何将 Drift bot JS 代码与 static React NextJs 应用程序（登录页面）集成？
[英]How to integrate Drift bot JS code with a static React NextJs application(landing page)?
问题描述
I am new to ReactJS.
我是 ReactJS 的新手。 I developed a landing page/static website using ReactJS & NextJs.我使用 ReactJS 和 NextJs 开发了一个登录页面/静态网站。 Now I am trying to integrate a chatbot 'Drift'.现在我正在尝试集成一个聊天机器人“漂移”。 In the installation process they say that to install I have to insert JavaScript code in the <head> of HTML files.在安装过程中，他们说要安装，我必须在 HTML 文件的<head>中插入 JavaScript 代码。 I found the automatically created html files of my react app and inserted this code but nothing happened.我找到了我的反应应用程序的自动创建的 html 文件并插入了此代码，但没有任何反应。
<script>
"use strict";
!function() {
var t = window.driftt = window.drift = window.driftt || [];
if (!t.init) {
if (t.invoked) return void (window.console && console.error && console.error("Drift snippet included twice."));
t.invoked = !0, t.methods = [ "identify", "config", "track", "reset", "debug", "show", "ping", "page", "hide", "off", "on" ],
t.factory = function(e) {
return function() {
var n = Array.prototype.slice.call(arguments);
return n.unshift(e), t.push(n), t;
};
}, t.methods.forEach(function(e) {
t[e] = t.factory(e);
}), t.load = function(t) {
var e = 3e5, n = Math.ceil(new Date() / e) * e, o = document.createElement("script");
o.type = "text/javascript", o.async = !0, o.crossorigin = "anonymous", o.src = "https://js.driftt.com/include/" + n + "/" + t + ".js";
var i = document.getElementsByTagName("script")[0];
i.parentNode.insertBefore(o, i);
};
}
}();
drift.SNIPPET_VERSION = '0.3.1';
drift.load('xxxxxxxx');
</script>
<!-- End of Async Drift Code -->
When I inspected the landing page in localhost, I couldn't find this script in the <header>当我在 localhost 检查登录页面时，在<header>中找不到此脚本
1 个解决方案
解决方案1
3 2020-04-22 18:30:28
I solved the issue by using npm i react-drifts and then importing Drift into my react app.我通过使用npm i react-drifts解决了这个问题，然后将Drift导入到我的反应应用程序中。 Then I used <Drift appId='xxxx'/> .然后我使用<Drift appId='xxxx'/> 。 The appId is embedded in the the javascript script [ drift.load('xxxxxxxx') ] that drifts gives you to add in the <head/> appId 嵌入在 javascript 脚本 [ drift.load('xxxxxxxx') ] 中，drifts 让您可以在<head/>中添加
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.