HybridAuth不工作与阿贾克斯 [英] HybridAuth not working with ajax
问题描述
我想实现HybridAuth与阿贾克斯。
I'm trying to implement HybridAuth with ajax.
code：
PHP：（由AJAX调用）
PHP: (will be called by ajax)
<?php
header('Content-type: application/json');
$provider = $_GET["provider"];
$config = '../libaries/hybridauth/config.php';
require_once( "../libaries/hybridauth/Hybrid/Auth.php" );
try {
$hybridAuth = new Hybrid_Auth($config);
$adapter = $hybridAuth->authenticate($provider);
$userProfile = json_encode($adapter->getUserProfile());
echo $_GET['callback'] . '(' . "{$userProfile}" . ')';
} catch (Exception $e) {
echo "Ooophs, we got an error: " . $e;
}
?>
JavaScript的：
Javascript:
socialRegister: function () {
var self = this;
var val = 'provider=' + self.get("provider");
return $.ajax({
type: "GET",
url: path.urlRoot + 'ext/socialRegisterAndAuthentication.inc.php',
dataType: "jsonp",
data: val
});
}
不过，我总是得到以下错误：
But I always get following error:
XMLHtt prequest无法加载 https://api.twitter.com/oauth /验证？oauth_token = 123 。没有访问控制 - 允许 - 原产地标头的请求的资源present。原产地的http：//本地主机'。因此不会允许访问
XMLHttpRequest cannot load https://api.twitter.com/oauth/authenticate?oauth_token=123. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost' is therefore not allowed access.
我知道，这意味着，Twitter的服务器没有让我的出身。有没有解决办法？是一个单页注册使用Ajax可能吗？ （希望是 - 在quora.com它的工作原理;））
I know, that this means, that the Twitter Server is not allowing my origin. Is there a workaround? Is a "One-Page" signUp with ajax possible? (Hopefully yes - on quora.com it works ;) )
TWITTERSETTINGS：
TWITTERSETTINGS:
最佳 费边
推荐答案
首先 - HybridAuth和Ajax直接是行不通的。但我有一个令人满意的解决方案，现在，我想与大家分享。因此，这里是我是如何做的：
First of all - HybridAuth and ajax directly is not working. But i have a satisfying solution now and i want to share it with you. So here is how i did it:
JavaScript的：
JavaScript:
twitterRegister: function () {
var self = this;
self.popupWindow = window.socialPopupWindow = window.open(
path.urlRoot + 'ext/socialRegisterAndAUthentication.inc.php?provider=Twitter',
"hybridauth_social_sing_on",
"location=0,status=0,scrollbars=0,width=800,height=500"
);
var winTimer = setInterval(function ()
{
if (self.popupWindow.closed !== false)
{
// !== is required for compatibility with Opera
clearInterval(winTimer);
//Now twitter register from
require(["model/register"], function (registerModel) {
var registerM = new registerModel();
var ajaxRequest = registerM.socialRegister();
$.when(ajaxRequest).done(function (response) {
console.log(response);
self.slideOutRegister("Twitter");
self.twitterObject = response;
$('#reg_user').val(response.firstName);
});
$.when(ajaxRequest).fail(function () {
self.slideOutRegister("Email");
});
});
}
}, 200);
},
说明：该功能打开一个新的弹出窗口。该系统将提示用户授权的应用程序。该setInterval的捕获关闭事件（由窗口本身当它完成发射）。
Explanation: This function opens a new popup-window. The user will be prompted to authorize the app. The setInterval catches the close event (fired by the window itself when its done).
socialRegisterAndAUthentication.inc.php：
socialRegisterAndAUthentication.inc.php:
<?php
session_start();
header('Content-type: text/html');
$provider = $_GET["provider"];
$config = '../libaries/hybridauth/config.php';
require_once( "../libaries/hybridauth/Hybrid/Auth.php" );
try {
$hybridAuth = new Hybrid_Auth($config);
$adapter = $hybridAuth->authenticate($provider);
$_SESSION["userProfile"] = json_encode($adapter->getUserProfile());
echo "<script type='text/javascript'>";
echo "window.close();";
echo "</script>";
} catch (Exception $e) {
echo "Ooophs, we got an error: ";
}
?>
说明：关闭时，授权完成（这是来自HybridAuth的文档）的窗口。该数据被存储在一个会话，这样我可以每阿贾克斯以后检索。
Explanation: Closes the window when authorization is done (this is from the docs of HybridAuth). The data is stored in a session so that i can retrieve it later per ajax.
getSocialData.inc.php
getSocialData.inc.php
<?php
session_start();
header('Content-type: application/json');
echo $_GET['callback'] . '(' . "{$_SESSION["userProfile"]}" . ')';
?>
说明：返回存储USERPROFILE
Explanation: Returns the stored userProfile.
摘要：
打开一个弹出窗口的JavaScript，让用户授权的应用程序。存储在会话变量中的数据。抓住弹出窗口的关闭事件。然后进行Ajax调用来检索存储的数据（会话）。
Open a popup-window with javascript and let the user authorize the app. Store the data in a Session variable. Catch the close event of the popup-window. Then make an ajax call to retrieve the stored data (Session).
这篇关于HybridAuth不工作与阿贾克斯的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
