Ionic Cordova Social Share plugin - cannot read property 'socialsharing' of undefined

Question

So I've been on this for 3 days now... Tried several tutorials like this one, and tried after the original page here , and read the GitHub description a thousand times.

Versions I'm using:

$ npm -v
3.7.3

$ cordova -v
6.1.0 (cordova-lib@undefined)

$ ionic -v
1.7.14

The error I'm getting in Chrome browser: Cannot read property 'socialsharing' of undefined . On android or ios phone nothing happens if buttons are pressed. Not even error function call.

The app.js + controller: (notice I'm trying with window.plugins and without .plugins as well!)

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

.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
    // for form inputs)
    if (window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
      cordova.plugins.Keyboard.disableScroll(true);

    }
    if (window.StatusBar) {
      // org.apache.cordova.statusbar required
      StatusBar.styleDefault();
    }
  });
})

  .controller('shareCtrl',['$scope',function($scope) {

     $scope.facebookShare=function(){
      window.socialsharing.shareViaFacebook('Digital Signature Maker', null /* img */, "https://play.google.com/store/apps/details?id=com.prantikv.digitalsignaturemaker" /* url */, null, 
        function(errormsg){alert("Error: Cannot Share")});
     }

     $scope.whatsappShare=function(){
      window.plugins.socialsharing.shareViaWhatsApp('Digital Signature Maker', null /* img */, "https://play.google.com/store/apps/details?id=com.prantikv.digitalsignaturemaker" /* url */, null, 
        function(errormsg){alert("Error: Cannot Share")});

}

I have tried to install even manually, and here there was a different error. When I inserted SocialSharing.js into index.html (before cordova.js), Chrome console said: Uncaught ReferenceError: require is not defined , which is in line 1 of SocialSharing.js:

var cordova = require('cordova');

So I have installed require.sj (npm install -g requirejs) with success and then tried manually but whole different kind of errors appeared.

Tried re installing the plugin or remove and add again platforms, but no change.

Not sure if it's related, but have tried to use ngCordova's $cordovaFileOpener2 and that one always gave the error of undefined for cordova. (Didn't work on actual phone either)

Appreciate any help! Thanks

UPDATE: I have pasted in all of my .js file content above.

Please note that, I have successfully installed the share plugin:

cordova plugin add cordova-plugin-x-socialsharing
Fetching plugin "cordova-plugin-x-socialsharing" via npm
Installing "cordova-plugin-x-socialsharing" for android

Here is my index.html:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">

    <!-- ionic/angularjs js -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>

    <!-- cordova script (this will be a 404 during development) -->
    <script src="lib/ng-cordova.min.js"></script>
    <script src="cordova.js"></script>

    <!-- your app's js -->
    <script src="js/app.js"></script>    
  </head>

  <body ng-app="starter">
    <ion-view view-title="Share">
      <ion-content ng-controller="shareCtrl">
        <div class="card">
            <div class="item item-divider">
                <b> Share this app</b>
            </div>
         <ul class="list">
           <li class="item" id="displayLabel">

            <button class="button button-block button-royal item-icon-left" ng-click="whatsappShare()">
                <i class="icon ion-social-whatsapp"></i>
                  WhatsApp
          </button>
          </li>

           <li class="item" id="displayLabel">

            <button class="button button-block button-royal item-icon-left" ng-click="facebookShare()">
                <i class="icon ion-social-twitter"></i>
                  facebook
          </button>
          </li>

          <li class="item" id="displayLabel">     
            <button class="button button-block button-royal item-icon-left" ng-click="OtherShare()">
                 <i class="icon ion-android-share-alt"></i>
                  Other
          </button>
          </li>
        </ul>
        </div>
      </ion-content>
    </ion-view>

  </body>
</html>

Answer 1

Actually Plugins provide access to device and platform functionality that is ordinarily unavailable to web-based apps. So you may not achieve plugin functionality on browser.

You can achieve on device(android/ios/emulator) using either by using Plugin or ngCordova.js file

Using Plugin

Installation: cordova plugin add cordova-plugin-x-socialsharing

Usage:

.controller('ShareCtrl', function ($scope) {
    $scope.whatsappShare = function(){
        if(window.plugins.socialsharing) {
        window.plugins.socialsharing.canShareVia('whatsapp',
            'msg', null, null, null,
            function (e) {
                //do something
            },
            function (e) {
               //error occured
            });
       }
    }
})

Using ng-Cordova

Installation: Add ng-cordova file in your project and include it in index.html file

<script src="lib/ng-cordova.min.js"></script>

Usage :

.controller('ShareCtrl', function ($scope,$cordovaSocialSharing) {
   $scope.shareByWhatsApp = function() {
        $cordovaSocialSharing
            .shareViaWhatsApp('sharedMsg', "", shareAppLink)
            .then(function(result) {
            }, function(err) {
                // An error occurred. Show a message to the user
                alert("error : "+err);
            });
    };
})

Ionic Cordova Social Share plugin - cannot read property 'socialsharing' of undefined

Question

1 answers

solution1
2 2016-04-01 06:28:01

Ionic Cordova Social Share plugin - cannot read property 'socialsharing' of undefined

Question

1 answers

solution1 2 2016-04-01 06:28:01

solution1
2 2016-04-01 06:28:01