- Version: 1.0.6
- GitHub: https://github.com/NativeScript/plugins
- NPM: https://www.npmjs.com/package/%40bigin%2Fns-url-handler
- Downloads:
- Last Day: 0
- Last Week: 0
- Last Month: 0
Credit
This plugin is from nativescript-urlhanlder of @hypery2k. You can get the original plugin at https://github.com/hypery2k/nativescript-urlhandler
We just upgrade to NS7 and add some tweaks to make it works.
NativeScript URL Handler Plugin
Register universal links and custom URL schemes handler for your app
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);
});
Installation
$ ns plugin add @bigin/ns-url-handler
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"
]