Have ideas to improve npm?Join in the discussion! »

    nativescript-urlhandler
    TypeScript icon, indicating that this package has built-in type declarations

    1.3.0 • Public • Published

    NativeScript URL Handler Plugin apple android

    Greenkeeper badge Build Status Donate with Bitcoin

    npm versionMaintainability

    NPM

    Feel free to donate

    Or donate Bitcoins: bitcoin:3NKtxw1SRYgess5ev4Ri54GekoAgkR213D

    Bitcoin

    Also via greenaddress

    Usage

    Just add App links to your app, see iOS and Android instructions below, and register a handler for the URL data.

    See this example for Angular:

    import { Component, OnInit } from "@angular/core";
    import { handleOpenURL, AppURL } from 'nativescript-urlhandler';
     
    @Component({
      selector: "gr-main",
      template: "<page-router-outlet></page-router-outlet>"
    })
    export class AppComponent {
        constructor() {
        } 
        
        ngOnInit(){
            handleOpenURL((appURL: AppURL) => {
                console.log('Got the following appURL', appURL);
            });
         }
    }
     

    And for pure NativeScript:

    var handleOpenURL = require("nativescript-urlhandler").handleOpenURL;
     
    handleOpenURL(function(appURL) {
      console.log('Got the following appURL', appURL);
    });
     

    Or as TypeScript:

    import { handleOpenURL, AppURL } from 'nativescript-urlhandler';
     
    handleOpenURL((appURL: AppURL) => {
      console.log('Got the following appURL', appURL);
    });
     

    Note: see demo app for sample usage. Start by adding handleOpenURL in app main!

    Installation

    $ tns plugin add nativescript-urlhandler

    Or if you want to use the development version (nightly build), which maybe not stable!:

    $ tns plugin add nativescript-urlhandler@next

    Android

    Replace myapp with your desired scheme and set launchMode to singleTask

    <activity android:name="com.tns.NativeScriptActivity" ... android:launchMode="singleTask"...>
            ...
        <intent-filter>
        <data android:scheme="myapp" /> 
        <action android:name="android.intent.action.VIEW" /> 
        <category android:name="android.intent.category.DEFAULT" /> 
        <category android:name="android.intent.category.BROWSABLE" /> 
        </intent-filter>

    For example:

    <activity android:name="com.tns.NativeScriptApplication" android:label="@string/app_name" android:launchMode="singleTask">
      <intent-filter>
          <action android:name="android.intent.action.MAIN" />
          <category android:name="android.intent.category.LAUNCHER" />
      </intent-filter>
      <intent-filter>
          <action android:name="android.intent.action.VIEW" />
          <category android:name="android.intent.category.DEFAULT" />
          <category android:name="android.intent.category.BROWSABLE" /> 
          <data android:scheme="myapp" android:host="__PACKAGE__" />
      </intent-filter>
    </activity>
     

    The android:launchMode="singleTask" tells the Android operating system to launch the app with a new instance of the activity, or use an existing one. Without this your app will launch multiple instances of itself which is no good.

    iOS

    <key>CFBundleURLTypes</key>
    <array>
        <dict>
            <key>CFBundleURLName</key>
            <string>com.yourcompany.myapp</string>
        </dict>
        <dict>
            <key>CFBundleURLSchemes</key>
            <array>
                <string>myapp</string>
            </array>
        </dict>
    </array>

    FAQ

    Callback handling

    The "handleOpenURL" callback must be called before application initialization, otherwise you'll see this error in the console:

        No callback provided. Please ensure that you called "handleOpenURL" during application init!
    

    Webpack

    TypeScript Config

    If your Webpack Build is failing, try adapting your tsconfig to this:

        "compilerOptions": {
            "module": "commonjs",
            "target": "es5",
            "experimentalDecorators": true,
            "emitDecoratorMetadata": true,
            "noEmitHelpers": true,
            "noEmitOnError": true,
            "lib": [
                "es6",
                "dom",
                "es2015.iterable"
            ],
            "baseUrl": ".",
            "paths": {
                "*": [
                    "./node_modules/tns-core-modules/*",
                    "./node_modules/*"
                ]
            }
        },
        "exclude": [
            "node_modules",
            "platforms",
            "**/*.aot.ts"
        ]
    

    Install

    npm i nativescript-urlhandler

    DownloadsWeekly Downloads

    500

    Version

    1.3.0

    License

    MIT

    Unpacked Size

    27.8 kB

    Total Files

    32

    Last publish

    Collaborators

    • avatar