OpenJS

OpenJS是腾讯微博开放平台提供的Javascript库，开发者使用该库可以轻松完成腾讯微博用户授权，访问API接口，调用官方组件等功能，支持多种应用部署环境及无缝迁移。

如果你需要实现网站与腾讯微博连接，或者开发微博应用，只需要在页面上引入OpenJS，就可以轻松实现这些功能。相比传统的接入方式，如OAuth1.0，Openid&Openkey等，它具有以下优势：

• 无需后台程序支持，用户的浏览器直接与微博API服务器交互，速度快，开发者也无需维护和部署后台程序。
• 支持多种部署环境，如腾讯域内，微博应用频道，和第三方网站等。

开始使用

在页面中引用OpenJS的方式分同步引用和异步引用两种。若用同步引用的方式，为优化网站性能，建议将OpenJS放置在页面底部加载^[链]。若用异步引用的方式，开发者须进行异步编程。开发者可根据自己的项目情况，自由选择。

• 同步引用

  
  <script src="//mat1.gtimg.com/app/openjs/openjs.js"></script>
  <script>
      // 同步引用，无需回调函数
      // 你的代码
  </script>
  

• 异步引用

  
  <script>
      // 异步引用需定义回调函数 onOpenjsLoad
      window['onOpenjsLoad'] = function () {
          alert("openJS加载成功");
      }
  
      (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 = "//mat1.gtimg.com/app/openjs/openjs.js";
        fjs.parentNode.insertBefore(js, fjs);
      }(document, 'script', 'openjs'));
  </script>
  

环境变量

OpenJS默认的运行环境参数配置基于大多数人的需要，一般情况下不需要做任何设置。在某些特殊情况下，开发者可以通过设置环境变量，改变OpenJS的默认行为。环境变量以Fragment URL^[链]的形式传递，不区分大小写。

<script src="//mat1.gtimg.com/app/openjs/openjs.js#debug=yes"></script>

腾讯微博API调用

initT.init(inInitOpts)
初始化。

<script>
    T.init({
        appkey:800000006
    });
</script>

<script>
    // 注意：
    // 采用弹窗授权模式的应用可以不用这样构造callbackurl
    // 以下代码只针对samewindow为true的情况，并且采用通用方案时
    // 使用

    // path_to_callbackurl 是指您部署的通用方案网址
    // return_to 后的参数 your_app_url 是指用户成功授权后页面要
    // 跳转到的网址，一般应该是应用的入口
    // appkey 后的参数 your_appkey 是固定字段，指开发者的appkey
    T.init({
        appkey: 800000006,
        samewindow: true,
        callbackurl:["path_to_callbackurl?"
                    ,'return_to=','your_app_url'
                    ,'&appkey=',your_appkey].join("")
    })
</script>

§

loginT.login(inSuccessHandler,inFailHandler)
用腾讯微博帐号登录授权应用，并根据授权结果回调相应函数。

<script>
    T.login(function (loginStatus) {
        alert(loginStatus.nick);
    },function (loginError) {
        alert(loginError.message);
    });
</script>

§

logoutT.logout(inHandler)
登出用户，清除用户授权信息。

§

loginStatusT.loginStatus()
获取用户登录信息，如用户已登录返回包含access_token的Map对象，如未登录返回undefined。

§

apiT.api(inName, inParamMap, inDataType, inType, inOverride)
调用腾讯微博API^[链]，返回Defer对象^[链]。

<script>
    T.api("/user/info")
     .success(function (response){
          alert(response.nick);
      })
     .error(function (code, message) {
          alert(message);
      });
</script>

<script>
    T.api("/user/info")
     .success(function (response){
          alert(response.nick);
      })
     .error(function (code, message) {
          alert(message);
      })
     .api("/statuses/home_timeline")
     .success(function (response) {
          alert(response);
      })
     .error(function (code, message) {
      });
</script>

§

tokenReadyT.tokenReady(inHandler)
注册回调函数，inHandler在用户登录态确定后执行。

<script>
    T.tokenReady(function () {
        if (T.loginStatus()) {
            alert("已登录");
        } else {
            alert("未登录");
        }
    });
</script>

§

documentReadyT.documentReady(inHandler)
注册回调函数，inHandler在DOM树可用后执行。

<script>
    T.documentReady(function () {
        var div = document.createElement("div");
        div.innerHTML = "DOM ready";
        document.body.appendChild(div);
    });
</script>

§

readyT.ready(inHandler)
注册回调函数，inHandler在tokenReady和documentReady后执行。

<script>
    T.ready(function () {
        var stat = T.loginStatus(),
            bar = document.createElement('div'),
            str;
    
        if (stat) {
            str = '欢迎' + stat.nick;
        } else {
            str = '未登录';
        }
    
        bar.innerHTML = str;
        document.body.appendChild(bar);
    });
</script>

§

bindT.bind(inEventName, inHandler)
绑定事件inEventName，此事件发生时执行inHandler。

<script>
    T.bind("ready",function () {
        alert("ready");
    });
</script>

§

unbindT.unbind(inEventName, inHandler)
解除事件绑定inEventName，返回布尔值，表示解除绑定是否成功。

§

triggerT.trigger(inEventName, inEventData*)
手动触发事件inEventName，返回数组，包含回调函数执行后的系列返回值。

<script>
    T.bind("myEvent",function (myEventData) {
        alert(myEventData);
    });
    T.trigger("myEvent","myData");
</script>

§

onceT.once(inEventName, inHandler)
与T.bind一样，区别在于inHanlder执行后自动解除绑定。

<script>
    T.once("myEvent",function (myEventData) {
        alert(myEventData);
    });
    T.trigger("myEvent","myEventData1");
    T.trigger("myEvent","myEventData2");
</script>

§

ajaxT.ajax(inAjaxConfig)
AJAX请求，返回Defer对象^[链]。

<script>
    T.ajax({
        url: "ajaxsample.json"
    }).success(function (response) {
        alert(response);
    }).error(function (code, message) {
        alert(message);
    });
</script>

§

jsonpT.jsonp(inJsonpConfig)
JSONP^[链]请求，返回Defer对象。^[链]。

<script>
    T.jsonp({
        url: "jsonpurl"
    }).success(function (response) {
        alert(response);
    }).error(function (code, message) {
        alert(message);
    });
</script>

§

scriptT.script(inScriptConfig)
异步引入其它script，返回Defer对象^[链]。

<script>
    T.script({
        url: "http://code.jquery.com/jquery-1.7.2.min.js"
    }).success(function () {
        alert($);
    }).error(function (code, message) {
        alert(message);
    });
</script>

§

taskT.task(inDeferred*)
创建任务组，同时完成多项异步任务，这些任务中如果有任一项失败，整个task失败，返回Defer对象^[链]。

<script>
    T.task(
          T.api("/statuses/home_timeline"),
          T.api("/statuses/public_timeline")
      )
     .success(function (homeData, publicData) {
          alert([homeData[0], publicData[0]]);
      })
     .error(function (code, message) {
          alert(message);
      });
</script>

§

findT.find(selector, context, result)
OpenJS集成了jQuery的选择器引擎Sizzle，以帮助开发者进行高效率开发。返回数组，包含匹配到的DOM元素。

<script>
    T.documentReady(function () {
        alert(T.find("ul > li"));
    });
</script>

§

localStorageT.localStorage
跨浏览器的数据本地存储对象，开发者可以使用此技术提升用户体验。

<script>
    T.localStorage.set("mykey", "mydata");
    alert(T.localStorage.get("mykey"));
</script>

§

browserT.browser
提供丰富的浏览器信息。

<script>
    if (T.browser.msie && T.browser.version == 6) {
        // 浏览器为IE6
        // do something
    }
</script>

    if(T.browser.engine == 'webkit') {
        // do something
    } 
    // 等同于
    if(T.browser.webkit) {
        // do something
    }

    //判断是否为iPhone
    if (T.browser.platform.name == 'iPhone') {
        //do something
    }
    等同于
    if (T.browser.platform.iPhone) {
        //do something
    }

    if(T.browser.feature.flash) {
        // 浏览器支持flash
        if(T.browser.feature.flash.externalinterface) {
            //flash player支持externalInterface
        }
    } 

    if(T.browser.os.name == 'windows') {
        // do something
    } 
    // 等同于
    if(T.browser.os.windows) {
        // do something
    }

§

templateT.template(inTemplateName)
小型js模板引擎^[链]，返回模板对象，使用此对象可以方便的构造html。

<script>
// 显示一个简单二维表格并隔行换色
var table = T.template("mytable");
table.add('<% for(var i=0,l=data.length; i<l; i++) {  %>')
     .add('<% var name= data[i][0],score=data[i][1],highlight= i%2==0; %>')
     .add('<tr style="background:<%=highlight ? \"red\" : \"green\" %>;">')
     .add('<td><%=name%></td><td><%=score%></td>')
     .add('</tr>')
     .add('<% } %>')
   .wrapTag('tbody','table')
   .data('data',[["张三",90],["李四",85],["王五",80],["柳六",100]]);

T.documentReady(function () {
    document.body.innerHTML = table.render();
});
</script>

<script>
    var tp = T.template("mytemplate");
    tp.add('<ol>')
      .add('<li><%=x%></li>')
      .add('<li><%=y%></li>')
      .add('</ol>');

    var result1 = tp.data({"x":1,"y":2}).render();
    tp.reset(false,true);

    var result2 = tp.data(["x",1,"y",2]).render();
    tp.reset(false,true);

    var result3 = tp.data("x",1).data('y',2).render();
    tp.reset(false,true);

    // 采用这种写法必须明确指定inOverWrite
    var result4 = tp.data("x",1,'y',2,true).render();
    tp.reset(false,true);

    alert(result1 && result1 == result2 && result2 == result3 && result3 == result4);
</script>

§

componentT.component(inComponentName)
创建网站连接的腾讯微博组件，返回网站连接组件对象。

<script>
    T.component("微评论").appkey('801126062').renderInto("body");
</script>

历史更新

常见问题

成功案例