2011-08-05 4 views
-1

를 사용할 때 AJAX 호출되지 : http://www.comehike.com/test_fb_connect.php나는이 테스트 페이지를 해제하고 있어요 FF 브라우저

페이스 북을 사용하여 사용자가 로그인, 시스템은 아약스 스크립트를 호출해야합니다. Chrome을 사용할 때 발생하지만 Firefox는 사용하지 않습니다.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" 
    "http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd"> 
<html> 
<head> 

     <script type="text/javascript"> 
     var _gaq = _gaq || []; 
     _gaq.push(['_setAccount', '***REDACTED***']); 
     _gaq.push(['_trackPageview']); 

      (function() { 
      var ga = document.createElement("script"); ga.type = "text/javascript"; ga.async = true; 
      ga.src = ("https:" == document.location.protocol ? "https://ssl" : "http://www") + ".google-analytics.com/ga.js"; 
      var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(ga, s); 
      })(); 
     </script> 


    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 

    <meta name="description" content="Live page for testing Facebook login and to learn how it works." /> 


    <title property="dc:title">Facebook Login Test Page - Come Hike</title> 
    <link rel="shortcut icon" type="image/x-icon" href="http://www.comehike.com/img/ui/favicon.jpg"> 

    <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/combo?2.8.2r1/build/reset-fonts-grids/reset-fonts-grids.css&2.8.2r1/build/base/base-min.css"> 
    <link rel="stylesheet" type="text/css" href="../hike_layout.css"/> 
    <link rel="stylesheet" type="text/css" href="../menusystem.css"/> 

     <meta name="google-site-verification" content="RJcu8ObHW6huUbyea336xJ1WgLiC4478fz3_3r_zthc" /> 
     <meta name="alexaVerifyID" content="-2hEyu8phk6CFHF-PTqdQvP2B8k" /> 

     <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> 
</head> 

<script type="javascript"> 
function loadfb() 
{ 
    var e = document.createElement('script'); e.async = true; 
    e.src = document.location.protocol + '//connect.facebook.net/es_EN/all.js'; 
    document.getElementById('fb-root').appendChild(e); 
}; 
</script> 

<!--<body onload="loadfb();">--> 
<body> 








Array<br /> 
(<br /> 
    [OPENID_AUTH] => <br /> 
)<br /> 

<div id="fb-root"></div> 

<script src="http://connect.facebook.net/en_US/all.js"></script> 

<script> 
    FB.init({ 
    appId : '***REDACTED***', 
    status : true, // check login status 
    cookie : true, // enable cookies to allow the server to access the session 
    xfbml : true 
    }); 

FB.Event.subscribe('auth.login', 
function(response) 
{alert("login"); 
    FB.getLoginStatus(function(response) 
    { 
     if (response.status == "connected") 
     { 
      FB.api('/me', function(response) 
      { 
//   alert ("First Name:" + response.first_name); 
//   alert ("Last Name:" + response.last_name); 
//   alert ("Email:" + response.email); 
//   alert ("Location name:" + response.location.name); 
//   alert ("Bio:" + response.bio); 
//   alert ("Id:" + response.id); 



// <img src="https://graph.facebook.com/FBNeedsADontLikeButton/picture"/> 


       // Now need to go send an AJAX call :) 
       var url="/auth/facebook_login_ajax.php?first_name="+response.first_name+"&email="+response.email+"&last_name="+response.last_name+"&bio="+response.bio+"&location="+response.location.name; 
alert("sending request"); 
       var request = window.ActiveXObject ? 
        new ActiveXObject('Microsoft.XMLHTTP') : 
        new XMLHttpRequest; 

       request.open("GET", url , true); 

       request.onreadystatechange = function() 
       { 
         if (request.readyState == 4) 
         { 
          var xmlDoc = request.responseXML; 
         } 

        location.reload(true); 

       } 
       request.send(null); 

       // Check if the request was successfull and refresh the page 
      }); 
     } 
     else 
     { 
      // user not connected 
     } 
    }); 
}); 



FB.Event.subscribe('auth.logout', 
function(response) 
{alert("log-out"); 
    // Now need to go send an AJAX call to log out :) 
    var url="/auth/facebook_logout_ajax.php"; 

    var request = window.ActiveXObject ? 
     new ActiveXObject('Microsoft.XMLHTTP') : 
     new XMLHttpRequest; 

    request.open("GET", url , true); 

     request.onreadystatechange = function() 
     { 
       if (request.readyState == 4) 
       { 
        var xmlDoc = request.responseXML; 

        // obtain the array of markers and loop through it 
        //result = xmlDoc.documentElement.getElementsByTagName("result"); 
       } 
       location.reload(true); 
     } 
     request.send(null); 



     // TODO: Check if the request was successfull and refresh the page 

}); 
</script> 


<div class="banner"> 
<!-- title and login/sign up go here --> 
    <a href="/"><div class="site_title">Hike!</div></a> 





      <div class="site_login"> 

    <fb:login-button show-faces="false" perms="user_about_me,email,user_location" autologoutlink="true" width="200" max-rows="1"> 
    </fb:login-button> | 

      <a class="login_link" id="login" href="/auth/log_in.php">Log in</a> | 
      <a href="/auth/create_profile.php">Sign up</a> | 
      <a href="/auth/forgot_password.php">Forgot Password</a> 
      </div> 




</div> 

<div class="nav_bar"> 
<!-- connect buttons and menu go here --> 
    <div class="nav"> 
     <div class="icons"> 
<!-- 
      <div id="fb"> 
       <script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script> 
       <fb:like layout="button_count" show_faces="false"></fb:like> 
      </div> 
--> 
<!-- 
      <div id="badge"> 
       <script src="http://www.stumbleupon.com/hostedbadge.php?s=1"></script> 
      </div> 
--> 
<!-- 
      <div id="tweet"> 
       <a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal" data-via="comehike">Tweet</a> 
       <script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script> 
      </div> 
--> 
     </div> 

     <div class="menusystem" id="site_nav"> 
      <ul class="main_menu_ul"> 

       <li class="main_menu_li"><a href="/community/support.php">SUPPORT</a> 
       </li> 
       <li class="main_menu_li"><a href="/community/search_hikers.php?all=yes&redirect=yes">COMMUNITY</a> 
        <ul class="child_menu_ul"> 
         <li class="first"><a href="/community/search_hikers.php">Search Hikers</a></li> 
         <li><a href="/hikes/search_hiking_groups.php">Search Groups</a></li> 
         <li class="last"><a href="/hikes/start_hiking_group.php">Start Regular Hiking Group</a></li> 

        </ul> 
       </li> 
       <li class="main_menu_li"><a href="/hikes/search_hikes.php?all=yes&when=f&redirect=yes">HIKES</a> 
        <ul class="child_menu_ul"> 
         <li class="first"><a href="/hikes/schedule_hike.php">Start Single Hike</a></li> 
         <li><a href="/hikes/search_hikes.php">Search Hikes</a></li> 
         <li><a href="/hikes/search_hikes.php?when=b&redirect=yes&all=yes">Past Hikes</a></li> 

         <li><a href="http://www.comehike.com/outdoors/parks/add_trailhead.php">Add Routes You Know</a></li> 
         <li class="last"><a href="http://www.comehike.com/outdoors/parks/trailhead.php">Trailhead Map</a></li> 
        </ul> 
       </li> 
      </ul> 
     </div> 


    </div> 

</div> 

<!-- ************************************************* --> 

<!-- the login overlay markup is hidden, will show if user clicks 'login' link --> 

<div id="loginOverlay" class="yui3-overlay-loading" style="z-index: 100;"> 
    <div class="yui3-widget-hd"><h3>Login</h3></div> 
    <div class="yui3-widget-bd"> 
     <div> 
      <span>Email</span><input type="text" id="user_email"></input> 

     </div> 
     <div> 
      <span>Password</span><input type="password" id="user_pass"></input> 
     </div> 
     <div id="err"></div> 
    </div> 
    <div class="yui3-widget-ft"> 
     <div class="btn" id="submit">Submit</div> 

     <div class="btn" id="cancel">Cancel</div> 
    </div> 
</div> 

<!-- ************************************************* --> 

<!-- Main area of the page --> 
<div id="layout2" class="content"> 
<div class="mainBody"> 
<div class="basic"> 
<p> 
    <h1><center>Test For Facebook Login</h1></center> 

</p> 
</p> 
<br /> 

<p> 
<center> 
<script type="text/javascript"><!-- 
google_ad_client = "***REDACTED***"; 
/* 728x90, created 12/23/10 */ 
google_ad_slot = "***REDACTED***"; 
google_ad_width = 728; 
google_ad_height = 90; 
//--> 
</script> 
<script type="text/javascript" 
src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> 
</script> 
</center> 
</p> 

<div class="footer"> 

    <p>Copyright (c) - 2011 Come Hike - All Rights Reserved | 
     <a href="http://www.comehike.com/about_us.php">About Us</a>&nbsp;| 
     <a href="http://www.comehike.com/contact_us.php">Contact Us</a>&nbsp;| 
     <a href="http://www.comehike.com/privacy_policy.php">Privacy Policy</a>&nbsp;| 
       <a href="http://www.nps.gov/index.htm">National Park Service Website</a>&nbsp; 

    </p> 
</div> <!-- end footerdiv --> 


<script src="http://yui.yahooapis.com/3.3.0/build/yui/yui-min.js"></script> 
<script> 
YUI().use('node','io','gallery-overlay-modal','event-key','json', function(Y){ 

    var LOGIN_URL = "/auth/auth.php"; 
    var LOGOUT_URL = "/auth/auth_logout.php"; 

    var dlg = false, 
     elLogin = Y.all("a.login_link"), 
     elLogout = Y.all("a.logout_link"); 

    var auth = function(){ 

     Y.one("#err").set('innerHTML', '<img src="/img/ui/ajax-loader-bar.gif" alt="Authenticating..."></img>'); 

     var u = Y.one("#user_email").get("value"); 
     var p = Y.one("#user_pass").get("value"); 
     Y.io(LOGIN_URL, 
      { 
       method:"POST", 
       headers: { 
        'X-Transaction': 'POST 1' 
       }, 
       data: "user_email=" + u + "&user_pass=" + p, 
       on: { 
        success: function(id, o){ 
         var o = Y.JSON.parse(o.responseText); 
         if(o.valid){ 
          //dlg.hide(); 
          window.location.reload(); 
         }else{ 
          if(o.error){ 
           Y.one("#err").set('innerHTML', o.error); 
          } 
         } 
        }, 
        failure: function(id, o){ 
         Y.one("#err").set('innerHTML', "Authorization Error"); 
        } 
       } 
      } 
     ); 
    }; 

    var hideLogin = function(){ 
     if(dlg){ 
      dlg.hide(); 
     } 
    }; 

    var onKey = function(e){ 
     switch (e.charCode) { 
      case 13: 
       e.preventDefault(); 
       auth(); 
       break; 
      case 27: 
       e.preventDefault(); 
       dlg.hide(); 
       break; 
     } 
    }; 

    var showLogin = function(e){ 
     e.preventDefault(); 
     if(dlg===false){ 
      dlg = new Y.Overlay({ 
       srcNode:"#loginOverlay", 
       width:"25em", 
       height:"17em" 
      }).plug(Y.Plugin.OverlayModal); 
      dlg.centered(); 
      dlg.render(); 
      var elSubmit = Y.one("#submit"); 
      if(elSubmit){ 
       elSubmit.on("click", auth); 
      } 
      var elCancel = Y.one("#cancel"); 
      if(elCancel){ 
       elCancel.on("click", hideLogin); 
      } 

      Y.on("key", onKey, "#loginOverlay"); 
     } 
     Y.one("#user_email").set("value",''); 
     Y.one("#user_pass").set("value",''); 
     Y.one("#err").set('innerHTML', ''); 
     Y.one("#user_email").focus(); 
     dlg.show(); 
    }; 

    if(!Y.Lang.isNull(elLogin)){ 
     elLogin.on("click", showLogin); 
    } 

    var logout = function(e){ 
     e.preventDefault(); 
     Y.io(LOGOUT_URL, 
      { 
       method:"POST", 
       data: "logout=true", 
       headers: { 
        'X-Transaction': 'POST 2' 
       }, 
       on: { 
        success: function(id, o){ 
         window.location.reload(); 
        }, 
        failure: function(id, o){ 
         window.location.reload(); 
        } 
       } 
      } 
     ); 
    }; 

    if(!Y.Lang.isNull(elLogout)){ 
     elLogout.on("click", logout); 
    } 


}); 
</script> 
</div> <!-- Closing basic --> 
</div> <!-- Closing main body --> 
</div> <!-- Closing layout 2? --> 

</div> <!-- Closing the body of this thing --> 

</body> 
</html> 
+2

FB 로그인을 게시하지 마십시오. 로그인 세부 정보를 공유하는 것은 Facebook TOS 위반입니다. Fiddler 또는 다른 코드 공유 사이트에 코드를 게시하십시오. 여기에 붙여 넣기에는 너무 큰 경우. –

+0

@Marc B - 편집하지 않은 이유는 무엇입니까? 나는 그렇게 했어.하지만 왜 네가 왜 그랬는지 궁금해? 2 초가 걸렸습니다. –

+0

@Chris : 했어. 편집 내역을 확인하십시오. –

답변

1

당신이 크로스 도메인 아약스 요청을 호출하려고 : 여기

페이지에서 코드입니다. same origin policy 때문에 여러 브라우저에서 차단할 수 있습니다. 이것을 극복하기 위해 these steps을 따라갈 수 있습니다.

0

답변을 찾았습니다.

나는 이것을 가지고 사용 :

  request.open("GET", url , true); 

그러나 파이어 폭스는 다음과 같이 그것을 좋아 :

  request.open("GET", url , false); 

내가 그의 의미가 사이트 전체 될 것입니다 무엇인지 궁금합니다. 누구 알아?

관련 문제