twitter Ionic app中$ cordovaOauth的问题

时间:2015-11-03 22:38:00

标签: angularjs twitter ionic-framework ionic

我想制作一个twitter feed离子应用程序。但是有问题。在启动应用程序之后,它应该显示$ cordovaOauth授权窗口,如下所示: what shood i see

但我有: what i have

我试图让很多战士做到这一点。 例如:

    ionic start devdactic-twitter blank
cd devdactic-twitter
bower install ng-twitter-api --save
bower install ngCordova#c3634c64090fa11c3e6bab3fcdc29712d3ecb965 --save

    cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-inappbrowser.git
cordova plugin add cordova-plugin-whitelist

加载库:

    <script src="lib/ngCordova/dist/ng-cordova.js"></script>
<script src="lib/ng-twitter-api/dist/ng-twitter-api.min.js"></script>
<script src="lib/sha1.js"></script>

angular.module('starter', ['ionic', 'ngCordova', 'ngTwitter'])

查看:

<body ng-app="starter" ng-controller='AppCtrl'>
  <ion-pane>
    <ion-header-bar class="bar-positive">
      <h1 class="title">My Twitter Feed</h1>
    </ion-header-bar>
    <ion-content class="has-header padding">
      <div class="list">
        <div class="item item-input-inset">
          <label class="item-input-wrapper">
            <input type="text" placeholder="My tweet..." ng-model="tweet.message" ng-maxlength="140">
          </label>
          <button class="button button-small" ng-click="submitTweet()">
            Tweet
          </button>
        </div>
      </div>
      <ion-refresher on-refresh="doRefresh()"></ion-refresher>

      <div ng-show="home_timeline.length == 0">Loading tweets...</div>

      <div ng-repeat="entry in home_timeline" class="list card">
        <div class="item item-avatar">
          <img ng-src="{{entry.user.profile_image_url}}"/>
          <h2>{{entry.user.name}}</h2>
          <p>{{correctTimestring(entry.created_at) | date:'medium'}}</p>
        </div>

        <div class="item item-body">
          <p ng-bind-html="entry.text"></p>
          <img ng-if="entry.extended_entities" ng-src="{{ entry.extended_entities.media[0].media_url }}" style="width: 100%;"/>
        </div>

      </div>
    </ion-content>
  </ion-pane>
</body>

AppCtrl:

.controller('AppCtrl', function($scope, $ionicPlatform, $twitterApi, $cordovaOauth) {});

然后(我在这里输入我的密钥和秘密):

var twitterKey = 'STORAGE.TWITTER.KEY';
var clientId = 'yourConsumerKey';
var clientSecret = 'yourConsumerSecretKey';
var myToken = '';

$scope.tweet = {};

$ionicPlatform.ready(function() {
  myToken = JSON.parse(window.localStorage.getItem(twitterKey));
  if (myToken === '' || myToken === null) {
    $cordovaOauth.twitter(clientId, clientSecret).then(function (succ) {
      myToken = succ;
      window.localStorage.setItem(twitterKey, JSON.stringify(succ));
      $twitterApi.configure(clientId, clientSecret, succ);
      $scope.showHomeTimeline();
    }, function(error) {
      console.log(error);
    });
  } else {
    $twitterApi.configure(clientId, clientSecret, myToken);
    $scope.showHomeTimeline();
  }
});

控制器的功能:

$scope.showHomeTimeline = function() {
  $twitterApi.getHomeTimeline().then(function(data) {
    $scope.home_timeline = data;
  });
};

$scope.submitTweet = function() {
  $twitterApi.postStatusUpdate($scope.tweet.message).then(function(result) {
    $scope.showHomeTimeline();
  });
}

$scope.doRefresh = function() {
  $scope.showHomeTimeline();
  $scope.$broadcast('scroll.refreshComplete');
};

$scope.correctTimestring = function(string) {
  return new Date(Date.parse(string));
};

我在devdactic中找到了这段代码(你可以找到ngTwitter)

我花了很多时间来找到解决这个问题的方法。你能帮我吗? 可能你有其他变种怎么做?

1 个答案:

答案 0 :(得分:0)

实际上你可以直接从https://dev.twitter.com/overview/documentation访问,你需要调用$ http指定的方法,参数并且不要忘记包含具有auth签名的标题。