2014-09-25 6 views
0

페이스 북의 로그인 버튼이 iOS 8에서 완전히 작동을 멈췄습니다. 제가 한 일이라고 생각했지만, 페이스 북 샘플 HTML을 사이트에서 가져 와서 내 페이지에 적용하면 여전히 작동하지 않습니다. (내 애플 리케이션 ID는 xxxxx로 대체되었습니다). 기본적으로 팝업 창이 페이스 북의 인증을 위해 열리지 만 닫히지 않고 내 앱으로 돌아갑니다. 임 단지 개방하는 탭 빈 왼쪽 : 내가 생각 해낸JS 페이스 북의 로그인 iOS8

<!DOCTYPE html> 
<html> 
<head> 
    <title>Facebook Login JavaScript Example</title> 
    <meta charset="UTF-8"> 
</head> 
<body> 
    <script> 
     // This is called with the results from from FB.getLoginStatus(). 
     function statusChangeCallback(response) { 
      console.log('statusChangeCallback'); 
      console.log(response); 
      // The response object is returned with a status field that lets the 
      // app know the current login status of the person. 
      // Full docs on the response object can be found in the documentation 
      // for FB.getLoginStatus(). 
      if (response.status === 'connected') { 
       // Logged into your app and Facebook. 
       testAPI(); 
      } else if (response.status === 'not_authorized') { 
       // The person is logged into Facebook, but not your app. 
       document.getElementById('status').innerHTML = 'Please log ' + 
        'into this app.'; 
      } else { 
       // The person is not logged into Facebook, so we're not sure if 
       // they are logged into this app or not. 
       document.getElementById('status').innerHTML = 'Please log ' + 
        'into Facebook.'; 
      } 
     } 

     // This function is called when someone finishes with the Login 
     // Button. See the onlogin handler attached to it in the sample 
     // code below. 
     function checkLoginState() { 
      FB.getLoginStatus(function (response) { 
       statusChangeCallback(response); 
      }); 
     } 

     window.fbAsyncInit = function() { 
      FB.init({ 
       appId: 'xxxxxxxxxxxxx', 
       cookie: true, // enable cookies to allow the server to access 
       // the session 
       xfbml: true, // parse social plugins on this page 
       version: 'v2.1' // use version 2.1 
      }); 

      // Now that we've initialized the JavaScript SDK, we call 
      // FB.getLoginStatus(). This function gets the state of the 
      // person visiting this page and can return one of three states to 
      // the callback you provide. They can be: 
      // 
      // 1. Logged into your app ('connected') 
      // 2. Logged into Facebook, but not your app ('not_authorized') 
      // 3. Not logged into Facebook and can't tell if they are logged into 
      // your app or not. 
      // 
      // These three cases are handled in the callback function. 

      FB.getLoginStatus(function (response) { 
       statusChangeCallback(response); 
      }); 

     }; 

     // Load the SDK asynchronously 
     (function (d, s, id) { 
      var js, fjs = d.getElementsByTagName(s)[0]; 
      if (d.getElementById(id)) return; 
      js = d.createElement(s); js.id = id; 
      js.src = "//connect.facebook.net/en_US/sdk.js"; 
      fjs.parentNode.insertBefore(js, fjs); 
     }(document, 'script', 'facebook-jssdk')); 

     // Here we run a very simple test of the Graph API after login is 
     // successful. See statusChangeCallback() for when this call is made. 
     function testAPI() { 
      console.log('Welcome! Fetching your information.... '); 
      FB.api('/me', function (response) { 
       console.log('Successful login for: ' + response.name); 
       document.getElementById('status').innerHTML = 
        'Thanks for logging in, ' + response.name + '!'; 
      }); 
     } 
    </script> 
    <!-- 
     Below we include the Login Button social plugin. This button uses 
     the JavaScript SDK to present a graphical Login button that triggers 
     the FB.login() function when clicked. 
    --> 

    <fb:login-button scope="public_profile,email" onlogin="checkLoginState();"> 
    </fb:login-button> 

    <div id="status"> 
    </div> 

</body> 
</html> 
+0

추가 정보를 (사람이 일을 더 우아한 방법이있는 경우 나 댓글에 알려 주시기 바랍니다)/return/arbiter? – user987723

+0

facebook 버그처럼 보입니다. https://developers.facebook.com/bugs/295178237341368/ – user987723

답변

1

유일한 해결책은 리디렉션에 대한 전체 사용하는 경우 iOS에서 다시 서버 측 인증 흐름이 저하 될 것입니다. 인 (사용자가 이상한 탭 전환을 통해 촬영되지 않도록 주어진, 바탕 화면에 부조화 경험이지만, 틀림없이 모바일에서 더 좋은 경험이다

https://www.facebook.com/dialog/oauth? 
    client_id={app-id} 
    &redirect_uri={redirect-uri} 

: 기본적으로 앱과 같은 URL을 공격한다 새로운 문제의 근본 원인). iOS에서만이 흐름을 저하 시키려면 로그인 링크가 실제로 페이스 북 인증 대화 상자의 href (위의 링크 또는 레일의 omniauth 사용자는 "/ auth/facebook")인지 확인하십시오. 그런 다음 iOS (또는 원하는 경우 모든 모바일)에서 실행되지 못하게하는 코드에서 클라이언트 측 흐름을 호출하는 자바 스크립트를 래핑하십시오. 페이지가 늘 다시이 URL에서 리디렉션 https://www.facebook.com/dialog :

if(!/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) { 
[Facebook client side flow code here] 
} 

+0

멋진 작품 marc! Cant는 이번 주 iOS8에서 깨진 것을 발견했습니다. 당신은 여전히 ​​베타 버전이라고 생각할 것입니다! – user987723

관련 문제