Make Ionic app appear in “Share” list and receive

2020-01-30 06:46发布

I am trying to get an Ionic app to appear in the "Share" list when a user clicks the share button for example for an image.

Sharing example

As far as I understand I have to add something like

<intent-filter> 
   <action android:name="android.intent.action.SEND" />
   <category android:name="android.intent.category.DEFAULT" />
   <data android:mimeType="image/*" />
</intent-filter>

to the AndroidManifest.xml. That I can do using the cordova-custom-config plugin, I think.
I would then have to handle that intent somehow though and that is where it gets tricky for me. Seems like the only cordova plugin that is currently maintaned for intents is this one. I tried using it like this:

  initializeApp() {
    this.platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      this.statusBar.styleDefault();
      this.splashScreen.hide();
      this.registerBroadcastReceiver();
    });
  }
  private registerBroadcastReceiver(){
      window.plugins.intentShim.registerBroadcastReceiver({
          filterActions: [
              'com.darryncampbell.cordova.plugin.broadcastIntent.ACTION'
              ]
          },
          function(intent) {
              //  Broadcast received
              console.log('Received Intent: ' + JSON.stringify(intent.extras));
          }
      );
  }

But this way I am getting an error that window.plugins is undefined. I don't really know how I would integrate this with Ionic.

Also this only works for Android, I would like to have that work for iOS too. This SO question is related and mentions a way to do it for iOS, but it's about 4 years old (the linked iOS parts 5 years) and the project webintent specified for Android in the answer doesn't even exist anymore.

Would be great if someone could help me out here.

Also related:

Update

All the answers are focusing on Android only, I was really hoping somebody could point me in the right direction for iOS as I would need it there even more...

Final conclusion & bounty

Bounty
After long consideration I have concluded to give the bounty to @Ghandi. Although nobody could give a full answer, he was the only one trying to answer the whole question - including the iOS part. I wasn't expecting a full code solution, just a pointer in the right direction for both Android and iOS and that's what he came closest to of all answers. I know this is a very broad question and I'd like to thank everyone who took the time to answer and / or comment this question.

For other's who are trying to accomplish the same thing, here is what I conclude of all my research and the answers here

Android
As I describe already in my question above, you have to add those lines to the AndroidManifest.xml. Android will then make your app appear in the share list. The data that your app receives you'll have to handle via a so called Intent. To do so you can use Ionic Native - Web Intent. As of 9.5.2017 this would not work yet as the Plugin Ionic Native is using does not exist anymore. I have however created an issue on Github where I have been told that the next version of Ionic Native (I think 3.7.0), which should be released in the next two weeks, should fix this by using the plugin mentioned in my question above already. This resolves the issue of having to kinda play around the Ionic Framework yourself and simply being able to use Ionic Native.

iOS
In iOS it seems to be a bit more tricky and also there is less to be found of it around the web. It's best you follow the link that @Ghandi provides in his answer below.

4条回答
三岁会撩人
2楼-- · 2020-01-30 07:20

For running the plugin https://github.com/darryncampbell/darryncampbell-cordova-plugin-intent, try:

  • Install the plugin with --save to make sure the plugin is added to your config.xml

    ionic plugin add https://github.com/darryncampbell/darryncampbell-cordova-plugin-intent --save
    
  • Since this plugin is not imported in ionic-native, you need to identify the global object. This will be declared in the plugin folder->plugin.xml. Here the object is intentShim.

       <js-module name="IntentShim" src="www/IntentShim.js">
          <clobbers target="intentShim" />
      </js-module>
    
  • In your code declare global object as:

    declare var intentShim:any;
    

    And in your function,

    private registerBroadcastReceiver(){
      intentShim.registerBroadcastReceiver({
          filterActions: [
              'com.darryncampbell.cordova.plugin.broadcastIntent.ACTION'
              ]
          },
          function(intent) {
              //  Broadcast received
              console.log('Received Intent: ' + JSON.stringify(intent.extras));
          }
      );
    }
    
查看更多
Lonely孤独者°
3楼-- · 2020-01-30 07:23

After some detailed analysis, this is what I could conclude:

In Android, you could just get your application added in the share list using cordova-plugin-intent as described here. You can also achieve this by adding intent filter in the activity as described here

In iOS, this is bit tricky as there are no straight forward plugins or readymade solution available to achieve this. But the best possible link i could get related to adding app in iOS share menu is getting listed in share menu The link includes apple documentation to do this and also some tweaking in Info.plist to acheive this.

This is the best possible answer I could think of. Hope it helps. Cheers.

查看更多
Melony?
4楼-- · 2020-01-30 07:33

You can send or receive data through webIntent plugin provided by ionic.

Ionic:
   Ionic CLI          : 5.0.2 (C:\Windows\System32\node_modules\ionic)
   Ionic Framework    : ionic-angular 3.9.5
   @ionic/app-scripts : 3.2.2

Cordova:
   Cordova CLI       : 9.0.0 (cordova-lib@9.0.1)
   Cordova Platforms : android 8.0.0
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.1.0, (and 5 other plugins)

Utility:
   cordova-res : not installed
   native-run  : 0.2.5

System:
   Android SDK Tools : 26.1.1 (D:\Android\Sdk)
   NodeJS            : v12.4.0 (D:\node.exe)
   npm               : 6.9.0
   OS                : Windows 8.1

Command to install plugin:

ionic cordova plugin add com-darryncampbell-cordova-plugin-intent
npm install --save @ionic-native/web-intent@4

Code To receive data: (Add 'Web-Intent' in provider)

import { WebIntent } from '@ionic-native/web-intent';

clickMe() {
    console.log('clicked')
    this.webIntent.getIntent().then((data) => {
      console.log('Success', data);
    },
    err => {
      console.log('Error', err);
    });
  }
查看更多
放荡不羁爱自由
5楼-- · 2020-01-30 07:36

try

window.intentShim.registerBroadcastReceiver

or call function inside

document.addEventListener('deviceready', function(){
    registerBroadcastReceiver() }, 
false);
查看更多
登录 后发表回答