[책] 페이스북 이펙트 - 영화 '소셜네트워크'를 보셨다면 봐야할 책!

나의 삶/리뷰 2010. 12. 5. 20:18
 
전 IT를 너무 좋아해서 이런 IT 스토리나 얘기가 재미있네요~
예전에 안철수가 쓴 책과 빌게이츠관련된 책도 어렸을 때(?) 잼나게 읽었던 기억이 나네요...
그리고 "실리콘 벨리 전쟁"이라는 영화도 있는데, 이 영화도 굉장히 재미있게 본 것 같아요. 이 영화는 마이크로소프트와 애플이 실리콘벨리에서 어떤 식으로 경쟁을 해왔는지에 대해서 나오는 영화인데, 1999년 영화라서 이 당시에는 빌게이츠가 마치 스티브잡스를 이긴듯한 영화를 그린 형태입니다. 하지만, 10년 뒤인 지금은 애플이 세상을 바꾸려고 하고 있죠! 그리고 이 영화는 뭐 그리 썩 잘만든 영화는 아니였지만, 이런 얘기를 담은 것 자체가 매우 흥미로웠죠...

영화 소셜네트워크를 보게 되었는데요. 이 영화를 보게 되면 페이스북이 탄생한 배경과 그 탄생과정에서 겪는 소송(?) 스토리를 얘기해주는데요. 영화를 보면서 이런 일이 있었구나~ 하면서 넘어가기에는 다른 내용들이 너무 궁금했고, 또한 영화에서는 항상 픽션이 존재하고, 사실을 기반으로 하지만 일부 영화화를 위해 과장된 내용이 있을 것이라고 생각했습니다.
그런 생각이 드는 와중에 "페이스북 이펙트"라는 페이스북의 인사이드 스토리를 담은 책이 출간된다는 얘기를 들었습니다. 그래서 출판과 동시에 구입을.....

사용자 삽입 이미지

재미있게 영화와 책을 비교한 글도 있네요~
http://blog.daum.net/7237474/8739840

이 책의 내용은 말그대로 페이스북 효과입니다. 페이스북이 어떤 방식으로 성장을 하면서 대체 사회에 어떤 영향을 끼치고 있으며 페이스북이 지금까지 어떤 짓(?)을 해왔는가, 앞으로 페이스북은 어떤 것을 꿈꾸고 있는가에 대해서 기록한 책입니다.

일단 처음에는 역시나 페이스북이 탄생하게 된 스토리를 주로 다룹니다. 영화 소셜네트워크에서 나온 일부스토리를 풀스토리로 볼 수 있습니다.

중반부에는 투자관련 얘기가 주로 나오게 되는데, 굉장히 많은 회사들이 페이스북을 사려고 했다는 것이 매우 흥미롭네요. 근데, 그런 거대한 금액이 유혹하는데 안 팔 수 있다는 것 자체가 대인배... 게다가 마크 주커버그와 그의 일당들은 협상의 달인 같은....-_-

또한 sns에서 꼭 빠지지 않는 개인정보 문제도...

플랫폼 관련 얘기가 나오는데, 저는 이 부분을 매우 유심히 봤습니다. 확실히 페이스북은 MS의 윈도우나 애플의 맥OS, 안드로이드, iOS 등의 플랫폼과는 다른 웹서비스입니다. 하지만, 이것을 플랫폼이라고 정의한 마크 주커버그가 너무 위대하게 느껴지네요... 그래서 다른 측면에서 보면 저들과 같은 플랫폼이 되는 것이죠.

마지막으로 마크 주커버그가 항상 강조하는 것은 수익보단 성장을 우선 시 한다는 것입니다. 이런 마크주커버그의 생각이 페이스북을 여기까지 이끌지 않았나 싶네요.
그리고 많은 분들이 마크주커버그는 후루꾸가 터져서 페이스북을 이렇게 성장시킨 것이다 라는 생각을 많이 하는데, 이 책을 보시면 생각이 좀 달라질꺼에요~ 운만 가지고 이렇게 성장할 수 없었고, 마크주커버그는 미래에 대해서 어느정도 예측하고, 사람들이 어떤 것을 원하는지 잘 알고 있었던 인물이 아니였나 생각해봅니다...

PS. 개발관련얘기 별로 없으니 IT좋아하시는 분들 보세요~ 잼있어요~!
 
Posted by 머드초보
,

[Javascript] 페이스북(Facebook) JavaScript 기반 인증 연동 후 YQL을 이용한 글쓰기

자바스크립트(Javascript) 2010. 9. 20. 16:53
 
일단 인증을 받기 위해서 애플리케이션을 등록해야합니다.
페이스북 developer페이지
http://www.facebook.com/#!/developers/apps.php

여기서 새 애플리케이션 셋업을 선택해서 애플리케이션을 등록해야합니다.
등록하고 나서 설정에서 Web Site탭에서
Site URL을 해당 "http://인증할 사이트주소/", Site Domain을 "인증할 사이트주소" 이렇게 설정합니다. 이렇게 안하니까 에러나더라구요-_-
저는 http://mudchobo.tomeii.com/ , mudchobo.tomeii.com 이렇게 셋팅했습니다.

그리고 이제 인증받을 페이지를 만듭니다.
index.html
[code]
<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="/js/jquery-1.4.2.min.js"></script> 
        <script type="text/javascript">
            $(document).ready(function(){
                $("#btnAuth").click(function(){
                    window.location = "https://graph.facebook.com/oauth/authorize?client_id=126292714090241&redirect_uri=http://mudchobo.tomeii.com/test/facebook/callback.html&type=user_agent&display=popup&scope=publish_stream,create_event,rsvp_event,sms,offline_access";
                });
            });
        </script>
    </head>
    <body>
        <button type="button" id="btnAuth" name="btnAuth">인증받기</button>
    </body>
</html>
[/code]
뭐 간단한데, 인증버튼이 있는데, 인증 받으려고 해당 url로 갑니다. 이거 팝업으로 한다음에 인증받고 callback에서 다시 팝업->부모페이지로 전달해서 하는 방법도 있는데, 귀찮으니까 그냥 페이지로 넘기고 콜백으로 넘어갑시다-_-

인증url을 보면 client_id가 application_id입니다. 저는 이런 단어통일이 안되어서 몬가 삽질을 좀 했습니다. 왜 단어가 틀려-_-

그리고 rediret_uri는 인증받고 다시 돌아올 주소고, scope는 이 인증에 어디까지 권한을 주는것이냐 입니다. 저기에 있는 게 다인데, 글쓰기권한은 publish_stream하나면 되는 듯. 나머지는 몰라서 막 추가해봤음...ㅠㅠ

인증받으려고 하면 아래와 같은 화면이 뜹니다.
사용자 삽입 이미지
허가하기 누르면 이제 access_token을 가지고 callback url로 옵니다.
이제 이 access_token만 있으면 글쓰기를 하거나, 글을 가져올 수 있습니다.

콜백을 보면...
callback.html
[code]
<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="/js/jquery-1.4.2.min.js"></script> 
        <script type="text/javascript">
            var url;
            var accessToken;
            var userId;
           
            $(document).ready(function(){
                url = new String(window.location);
                accessToken = url.substring(url.indexOf("#") + 14, url.indexOf("&"));
                var userId = accessToken.substring(43, 53);
               
                // 자신의 정보 가져오기
                $.getJSON("https://graph.facebook.com/me?access_token=" + accessToken + "&callback=?", result);
            });
           
            function result(data){
                userId = data.id;
               
                // 글쓰기 버튼 이벤트 추가
                $("#btnWrite").click(function(){
                    var data = $("#taWall").val();
                    if (data.length <= 0){
                        alert("글을 입력하세요!");
                        return;
                    }
                    var query = "use 'http://mudchobo.tomeii.com/test/facebook/facebook_wall_table.xml' as htmlpost;" +
                                    "select * from htmlpost where " +
                                    "url='https://graph.facebook.com/" + userId + "/feed' " +
                                    "and postdata='access_token=" + accessToken + "&message=" + encodeURIComponent(data) +"'" +
                                    "and xpath='//p'";
                    var url = "http://query.yahooapis.com/v1/public/yql?format=json&callback=?&q=" +
                        encodeURIComponent(query) + "&diagnostics=true";
                    $.getJSON(url, cbResult);
                });
            }
           
            function cbResult(data){
                alert("글쓰기 완료!" + data.query.results.postresult.p);
            }
        </script>
    </head>
    <body>
        <textarea id="taWall" name="taWall"></textarea>
        <button id="btnWrite" name="btnWrite">글쓰기</button>
    </body>
</html>
[/code]
accessToken을 url에서 가져오고, 자신의 정보를 access_token을 이용해서 가져옵니다.

그리고, 이제 문제는 글쓰기 부분인데요. 타도메인에 post요청을 할 수 없기 때문에 서버프록시를 이용해야합니다. 제가 가지고 있는 이 tomeii서버는 몬가 https를 요청하니 에러를 뿜는 것 같아-_- YQL이라는 것을 찾았습니다.
이거 좀 짱인데, 나중에 공부해봐야겠습니다.

일단 YQL에 포스트를 날릴 TABLE을 만들어야 하네요. YQL은 저도 잘 모르니 POST요청하는 거 그냥 찾아서 따라해봅니다-_- 아래 사이트 참조
http://www.wait-till-i.com/2009/11/16/using-yql-to-read-html-from-a-document-that-requires-post-data/

facebook_wall_table.xml
[code]
<table xmlns="http://query.yahooapis.com/v1/schema/table.xsd">
    <meta>
        <author>Mudchobo</author>
          <description>HTML pages that need post data</description>
          <sampleQuery>
              <![CDATA[
                select * from {table} where
                url='http://mudchobo.tomeii.com/test/facebook/test.php'
                and postdata="access_token=a&message=b" and xpath="//p"
            ]]>
        </sampleQuery>
          <documentationURL></documentationURL>
      </meta>
      <bindings>
        <select itemPath="" produces="XML">
            <urls>
                  <url>{url}</url>
            </urls>
            <inputs>
                  <key id="url" type="xs:string" required="true" paramType="variable"/>
                  <key id="postdata" type="xs:string" required="true" paramType="variable"/>
                <key id="xpath" type="xs:string" required="true" paramType="variable"/>
            </inputs>
            <execute>
                <![CDATA[
                      var myRequest = y.rest(url);
                      var data = myRequest.accept("text/html")
                        .contentType("application/x-www-form-urlencoded")
                        .post(postdata).response;
                    var xdata = y.xpath(data,xpath);
                    response.object = <postresult>{xdata}</postresult>;
                ]]>
            </execute>
        </select>
      </bindings>
</table>
[/code]
뭐 잘은 모르겠지만, inputs태그에서 postdata랑 url을 받고 여기서 처리를 하는 듯.
javascript같은게 있는데, 여기서 post어쩌구 함수를 호출해서 날리고 response객체 저장시켜놓으면 그걸 얻어올 수 있는 것 같음.

쿼리는 이렇게 날리네요.
[code]
use 'http://mudchobo.tomeii.com/test/facebook/facebook_wall_table.xml' as htmlpost;
select * from htmlpost where url='https://graph.facebook.com/자기페이스북아이디/feed' and postdata='access_token=access_token&message=메세지'and xpath='//p'
[/code]
저렇게 yql을 getJSON으로 날리면 데이터처리를 야후서버에서 하겠죠^^ 그리고 리턴값은 글을 작선한 뒤에 아이디를 받아옵니다.

ps1. YQL진짜 신기하네요-_- 저런식으로 하면 정의된 테이블에 의해서 처리를 한다음에 결과값을 실어서 주네요.

ps2. 예제주소는 여기에....
http://mudchobo.tomeii.com/test/facebook/

 
Posted by 머드초보
,

티스토리툴바