How can I install CordovaClipboard in a ionic project?


#1

Hi, ionickers I am a newbie with ionic. I want to copy a text into clipboard if a user click a button. So I find Cordova Clipboard in Github. How can I install it with my ionic project?


#2

Should be able to do

$ ionic plugin add https://github.com/VersoSolutions/CordovaClipboard

#3

This is now failing with Cordova 7.0.0 because the repo does not have a package.json
It does not appear active.

Will ionic team step up and do something about it?

Thank you.


#4

You can fork the repository yourself and apply the PR to your fork, then install the plugin via your repo URL on Github. Ionic (or Cordova) doesn’t want to “adopt” this plugin (or any others) because then they would have to keep working on it forever. Feel free to do this yourself and let us know.


#5

Thank you for your suggestion, but it’s not the correct route. If you know of someone who already forked it on github, I would try to install it from there.

Installing the clipboard support is documented by the ionic framework here https://ionicframework.com/docs/native/clipboard/ and those directions are now failing. Since ionic is supporting this plugin they ought to fix or remove this documentation.

Why should everyone fork and fix things over and over?
Thanks.


#6

Why do you have such an urgent need for Cordova 7?


#7

I don’t, I can’t recall at the moment which upgrade steps I followed at some point that took it to 7.0.0

I will regress to 6.5 as suggested.


#8

I have removed and installed Cordova@6.5
I have never gotten Clipboard.copy to work, it was producing "Error: cordova_not_available"
now after installing Cordova@6.5 and what appear to be a successful install of
ionic cordova plugin add https://github.com/VersoSolutions/CordovaClipboard.git

$ ionic cordova plugin add https://github.com/VersoSolutions/CordovaClipboard.git
> cordova plugin add https://github.com/VersoSolutions/CordovaClipboard.git --save
✔ Running command - done!
Fetching plugin "https://github.com/VersoSolutions/CordovaClipboard.git" via git clone
Repository "https://github.com/VersoSolutions/CordovaClipboard.git" checked out to git ref "master".
cp: dest file already exists: S:\_W\ARP\UPS.TS\SRC\UPS.TS.2.0\plugins\com.verso.cordova.clipboard\LICENSE 

cp: dest file already exists: S:\_W\ARP\UPS.TS\SRC\UPS.TS.2.0\plugins\com.verso.cordova.clipboard\LICENSE
cp: dest file already exists: S:\_W\ARP\UPS.TS\SRC\UPS.TS.2.0\plugins\com.verso.cordova.clipboard\plugin.xml 
cp: dest file already exists: S:\_W\ARP\UPS.TS\SRC\UPS.TS.2.0\plugins\com.verso.cordova.clipboard\LICENSE
cp: dest file already exists: S:\_W\ARP\UPS.TS\SRC\UPS.TS.2.0\plugins\com.verso.cordova.clipboard\plugin.xml
cp: dest file already exists: S:\_W\ARP\UPS.TS\SRC\UPS.TS.2.0\plugins\com.verso.cordova.clipboard\README.md 

skipping existing file: Clipboard.java
skipping existing file: CDVClipboard.h
skipping existing file: CDVClipboard.m
skipping existing file: Clipboard.cs
skipping existing file: clipboard.js
Installing "com.verso.cordova.clipboard" for android
Installing "com.verso.cordova.clipboard" for browser
Saved plugin info for "com.verso.cordova.clipboard" to config.xml

I now get the following error “Error: Missing Command Error”

Here is the code I prompt the user with on the browser

// , public Clipboard: Clipboard 
// was injected in the constructor

 //---------------------------------------------------------------------- 
    // http://ionicframework.com/docs/api/components/alert/AlertController/
    // http://ionicframework.com/docs/components/#alert
    // https://ionicframework.com/docs/native/clipboard/
    // 20170519
    ShareViaBrowser(message, subject, file, link) {
        let prompt = this.AlertController.create({
            title: "Share this link",
            inputs: [{
                name: 'name',
                placeholder: 'link...',
                value: link
            }],
            buttons: [
                {
                    text: 'Cancel'
                },
                {
                    text: 'Copy',
                    handler: data => {
                        console.log("SocialShare------------>>ShareViaBrowser, User accepted", data);
                        this.Clipboard.copy(data).then(
                            (resolve: string) => {
                                alert(resolve);
                            },
                            (reject: string) => {
                                alert('Error: ' + reject);
                            }
                        );
                    }
                }
            ]
        });

        prompt.present();
    }

Now, how can I get a simple text copy to work?
Thank you.


#9

For one thing, I would strongly recommend following traditional naming conventions, whereby object properties are camelCase, not PascalCase. You’re asking for trouble having a property be the same name as a class.


#10

in VSCode I pressed F2 (rename symbol) on Clipboard and renamed it to “clipboard”,
I still get localhost:8100 says: Error: Missing Command Error

I get the following in the browser console

Error: exec proxy not found for :: SocialSharing :: share
SocialShare.ts:46 SocialShare<<P.FAIL------------ShareViaShareSheet
SocialShare.ts:86 SocialShare------------>>ShareViaBrowser, User accepted Object {name: "http:mumti.org/?m=f-syqTWtDvU"}
cordova.js:989 Error: exec proxy not found for :: Clipboard :: copy

The last line seems to be pointing to cordova.js

Here is how I handle SocialSharing not being available on the browser and fall back onto Clipboard.copy
I think there must be testing platform type…

// https://github.com/EddyVerbruggen/SocialSharing-PhoneGap-Plugin
    // http://ionicframework.com/docs/v2/native/social-sharing/
    // 20170414
    ShareViaShareSheet(message, subject, file, link) {
        console.log("SocialShare------------>>ShareViaShareSheet");
        console.log(message, "\n", subject, "\n", file, "\n", link)
        this.Platform.ready().then(() => {
            SocialSharing.share(message, subject, file, link).then(() => {
                // Success!
            }).catch(() => {
                // Error!
                console.log("SocialShare<<P.FAIL------------ShareViaShareSheet");
                this.ShareViaBrowser(message, subject, file, link);
            });
        });
    }

Now that I think of it, I probably should use if (platform.is(‘core’)) { } and avoid the first exception altogether. Need to test the check works on Windows browsers, and Mobile platforms browsers as well.

Let me know how to get Clipboard.copy to work though.
Thank you.