我正在尝试实现自定义 Google Hangouts 应用,但在尝试将 Hangouts ID 从 Hangouts 应用传递到我自己的应用时遇到困难。环聊在 Google 的服务器上运行,因此我认为这是一个跨域问题。
我的自定义环聊应用正文中有以下代码,该代码加载到整个环聊窗口的 iframe 中:
<body>
<script>
var postHangoutId = function(hangoutId) {
console.log("in function(hangoutId)");
$.post({
url: "https://www.myserver.com",
crossDomain: true,
dataType: "json",
data: {
"hangouts_id" : hangoutId
},
success: function( response ) {
console.log( response ); // server response
}
});
}
gapi.hangout.onApiReady.add(function() {
console.log("gapi.hangout.onApiReady.add");
postHangoutId(gapi.hangout.getHangoutUrl().split('/').pop());
});
window.onload = function() {
console.log("hangouts load");
console.log("onload getURL" + gapi.hangout.getHangoutUrl());
}
</script>
我的应用程序
主要目标是获取环聊 ID 并将其发布到我的服务器。似乎什么也没发生,所以我在代码中散布了 console.log
语句。显示标题“我的应用程序”,因此至少我知道自定义应用程序正在运行。
但是,当我在打开的环聊窗口中打开 Chrome 开发者工具并转到“控制台”选项卡时,我看到的就是以下内容:
我已删除 AJAX 调用并重新运行应用程序以确保这些错误仍然存在,因此它们与 AJAX 调用无关。正如你所看到的,我的日志都不在这里。我做错了什么?
最佳答案
您需要在 jQuery Ajax 跨域请求中使用 JSONP 作为 dataType
Javascript 安全性阻止代码中的请求
$.post({
url: "https://www.myserver.com",
crossDomain: true,
dataType: "jsonp",
data: {
"hangouts_id" : hangoutId
},
success: function( response ) {
console.log( response ); // server response
},error : function(err){console.log(err)}
});
关于JavaScript/AJAX 调试,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24442558/