2

ユーザーがFacebookにログインしていない場合にログインを促すページを作成し、ユーザーがグループのメンバーであるかどうかを確認したいと思います。そうでない場合は、クリックするとグループへの招待がこのユーザーに送信されるボタンを提供します。

グループ招待の送信の最後のステップまですべて行うことができます。それが可能かどうか知りたいです。グループは通常のオープン グループであり、ドキュメントがまだベータ版であると言うアプリ グループではありません。

応答を console.log すると、ボタンがクリックされたときに次のエラーが発生し続けることがわかりました。

Object {error: Object}
error: Object
code: 3
message: "(#3) "
type: "OAuthException"

エラーコードとエラーメッセージはまったく役に立ちません...

ここに私がこれまでに持っている完全なコードがあります

<html>
<head>
    <title>Group Tester</title>
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="css/style1.css" />
    <script src="jquery/jquery-1.9.1.min.js"></script>
    <style>
        body.connected #login { display: none; }
        body.connected #logout { display: block; }
        body.not_connected #login { display: block; }
        body.not_connected #logout { display: none; }
    </style>
</head>
<body onload="setTimeout(function() { window.scrollTo(0, 1) }, 100);"></body>
<div id="fb-root"></div>
<script>
  (function() {
    var e = document.createElement('script'); e.async = true;
        e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
        document.getElementById('fb-root').appendChild(e);
        }());
</script>
<script>
var uid = "";
var fbName = "";
var accessToken = "";
var appId = "xxxxxxxxxxxxxx";
var appSecret = "xxxxxxxxxxxxxxxxxxxxxx";
var appAccessToken = "";
var groupId = "xxxxxxxxxxxxxxxxxx";

$(document).ready(function(){
    $("#group").hide();
    window.fbAsyncInit = function() {
        FB.init({ appId: appId, 
            status: true, 
            cookie: true,
            xfbml: true,
            oauth: true});

        FB.Event.subscribe('auth.authResponseChange', handleResponseChange); 
        checkLoginStatus();
    };
});
function handleResponseChange(response) {
    document.body.className = response.authResponse ? 'connected' : 'not_connected';

    if (response.authResponse) {
        checkLoginStatus();
    }
}

function loginUser() {    
    FB.login(function(response) { }, {scope:'email, user_likes, manage_groups, user_groups'});     
}

function checkLoginStatus() {
    FB.getLoginStatus(function(response) {
        if (response.status === 'connected') {
            // the user is logged in and has authenticated your
            // app, and response.authResponse supplies
            // the user's ID, a valid access token, a signed
            // request, and the time the access token 
            // and signed request each expire
            document.body.className = 'connected';
            uid = response.authResponse.userID;
            accessToken = response.authResponse.accessToken;
            FB.api('/me', function(response) {
                loginSuccess(response);
            });
        } else {
            // the user isn't logged in to Facebook.
            notLoggedIn();
        }
    });
}

function checkGroupMember()
{
    var fql = "SELECT uid from group_member WHERE uid=me() AND gid='"+groupId+"'";
    var fqlencoded = encodeURIComponent(fql);
    FB.api("/fql?q="+fqlencoded, 
        function(response) {
            //console.log(response.data[0].uid);
            if (response.data.length != 0)
            {
                $("#sendInvite").hide();
                $("#alreadyMember").show();
            }
            else
            {
                $("#sendInvite").show();
                $("#alreadyMember").hide();
            }
        }
    );
}

function logoutUser() {
    FB.logout();
    notLoggedIn();
}

function loginSuccess(response) {
    $("#profileName").html(response.name);
    fbName = response.name;
    $("#profileImg").html("<img src='https://graph.facebook.com/"+uid+"/picture?type=large' />");
    $("#group").show();
    console.log("logged in");
    checkGroupMember();
}

function notLoggedIn() {
    document.body.className = 'not_connected';
    $("#profileImg").html("");
    $("#profileName").html("");
    $("#group").hide();
}

function sendInvite()
{
    var connection = '/'+groupId+'/members/'+uid;
    console.log(connection);
    console.log(accessToken);
    FB.api(connection, 'post', {access_token : accessToken}, function(response) {
        console.log(response);
    });
}

</script>
 <div id="wrapper">
    <center><h1>Group API Test</h1></center>
    <div id="login" onClick="loginUser();"></div>
    <div id="logout" onClick="logoutUser();"></div>
    <br />
    <div id="group">
        <div id="profileImg"></div>
        <div id="profileName"></div>
        <div id="sendInvite" style="display:none;" onclick="sendInvite()">Send Invite Now</div>
        <div id="alreadyMember" style="display:none;">Already a Member</div>
        <div id="message"></div>
    </div>
</div>
</body>
</html>

認証フローは問題なく機能します。問題は sendInvite() 関数にあり、私は提案を受け付けています。

ああ...、誰かがこのコードの css ファイルを必要とする場合。（質問には関係ありません）

body {
    text-align: center; 
    font-family:Comic Sans MS;
    text-shadow: 0 1px 0 #222222;
}

h1 {
    color: #34D13C;
    margin-top:20px;
    font-weight: bold;
    text-shadow: 0 3px 0 #222222;
}

#login
{
    width: 413px;
    height: 70px;
    background-image:url('../img/login.png');
    margin-left:auto;
    margin-right:auto;
    display:none;
    cursor:pointer;
}

#logout
{
    width: 413px;
    height: 70px;
    background-image:url('../img/logout.png');
    margin-left:auto;
    margin-right:auto;
    display:none;
    cursor:pointer;
}

#sendInvite
{
    background-color: cyan;
    cursor: pointer;
    border: black thin solid;
    margin-top:10px;
    max-width: 200px;
    padding: 5px;
    margin-left:auto;
    margin-right:auto;
}

#sendInvite:hover
{
    background-color: skyblue;
    color : green;
}
4

0 に答える 0