Rails: Tawk.to 聊天插件和 Turbolinks 问题
Rails: Tawk.to chat plugin and Turbolinks issue
您好,我想将聊天插件 Tawk.to 集成到我的 rails 应用程序中,但是按照他们提供的方式添加脚本不适用于 Turbolinks,我还尝试将脚本添加到一个函数并在 .ready 和 page:load 上调用它但是它不起作用,这是原始脚本:
var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
(function(){
var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=true;
s1.src='https://embed.tawk.to/API_KEY/default';
s1.charset='UTF-8';
s1.setAttribute('crossorigin','*');
s0.parentNode.insertBefore(s1,s0);
})();
我在 application.js 文件中尝试了以下内容:
function tawk_chat(){
var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
(function(){
var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=true;
s1.src='https://embed.tawk.to/API_KEY/default';
s1.charset='UTF-8';
s1.setAttribute('crossorigin','*');
s0.parentNode.insertBefore(s1,s0);
})();
}
$(document).on("ready page:load", function() {
tawk_chat();
});
以上方法无效。如何在启用 Turbolinks 的情况下使上述脚本工作?
有一个名为 Tawk-rails 的 Ruby gem,但是我安装并测试了它,它与 Turbolinks 有同样的问题,所以我开始尝试解决这个问题。
实际上修复 Tawk 脚本使其与 Turbolinks 一起工作非常容易,您只需将 $_Tawk
变量设置为未定义,因此生成的脚本将是:
<script type="text/javascript”>
window.$_Tawk = undefined;
var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
(function(){
var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=true;
s1.src='https://embed.tawk.to/#{Tawk_account_id}/default';
s1.charset='UTF-8’;
s1.setAttribute('crossorigin','*’);
s0.parentNode.insertBefore(s1,s0);
})();
</script>
您可以将上述脚本直接添加到您的 application.js 函数中,然后在 .ready 上调用它,或者您可以安装 this 分叉版本的 Tawk-rails gem 我在哪里解决这个问题
我已经对原始 gem 进行了拉取请求,所以一旦他们合并它,我将更新答案。
更新
现在 pull request 合并到原来的 gem,现在你可以安装 tawk-rails gem,Tawk.to 将按预期工作,即使已启用 Turbolinks
您好,我想将聊天插件 Tawk.to 集成到我的 rails 应用程序中,但是按照他们提供的方式添加脚本不适用于 Turbolinks,我还尝试将脚本添加到一个函数并在 .ready 和 page:load 上调用它但是它不起作用,这是原始脚本:
var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
(function(){
var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=true;
s1.src='https://embed.tawk.to/API_KEY/default';
s1.charset='UTF-8';
s1.setAttribute('crossorigin','*');
s0.parentNode.insertBefore(s1,s0);
})();
我在 application.js 文件中尝试了以下内容:
function tawk_chat(){
var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
(function(){
var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=true;
s1.src='https://embed.tawk.to/API_KEY/default';
s1.charset='UTF-8';
s1.setAttribute('crossorigin','*');
s0.parentNode.insertBefore(s1,s0);
})();
}
$(document).on("ready page:load", function() {
tawk_chat();
});
以上方法无效。如何在启用 Turbolinks 的情况下使上述脚本工作?
有一个名为 Tawk-rails 的 Ruby gem,但是我安装并测试了它,它与 Turbolinks 有同样的问题,所以我开始尝试解决这个问题。
实际上修复 Tawk 脚本使其与 Turbolinks 一起工作非常容易,您只需将 $_Tawk
变量设置为未定义,因此生成的脚本将是:
<script type="text/javascript”>
window.$_Tawk = undefined;
var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
(function(){
var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=true;
s1.src='https://embed.tawk.to/#{Tawk_account_id}/default';
s1.charset='UTF-8’;
s1.setAttribute('crossorigin','*’);
s0.parentNode.insertBefore(s1,s0);
})();
</script>
您可以将上述脚本直接添加到您的 application.js 函数中,然后在 .ready 上调用它,或者您可以安装 this 分叉版本的 Tawk-rails gem 我在哪里解决这个问题
我已经对原始 gem 进行了拉取请求,所以一旦他们合并它,我将更新答案。
更新
现在 pull request 合并到原来的 gem,现在你可以安装 tawk-rails gem,Tawk.to 将按预期工作,即使已启用 Turbolinks