I am trying to authenticate a flutter application against Spotify.
For this, I use the flutter_web_auth package. I have a button to authenticate against Spotify.
Once user clicks the button, the following function operates:
onPressed: () async {
final spotifyAuthURL = Uri.https(
'accounts.spotify.com',
'/authorize',
{
'response_type': 'code',
'client_id': dotenv.get('SPOTIFY_CLIENT_ID'),
'redirect_uri':
'https://vinyl_app_spotify.com/callback',
'scope': 'user-read-private user-read-email',
},
);
final result = await FlutterWebAuth.authenticate(
url: spotifyAuthURL.toString(),
callbackUrlScheme:
'https://vinyl_app_spotify.com/callback',
);
},
I've also added the following activiy to the AndroidManifest.xml file as I should have done according to the flutter_web_auth package:
<activity android:name="com.linusu.flutter_web_auth.CallbackActivity" >
<intent-filter android:label="flutter_web_auth">
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<data android:scheme="https://vinyl_app_spotify.com/callback" />
</intent-filter>
</activity>
So after I click my application button, I do get access to Spotify, then the redirect url kicks in, but I just see this:
So my android emulator could not capture the callback url.
What is my mistake? Any advice..
Related
I want it to be possible to share web pages with my react native app. After the user will share with my app, I need to be able to extract the url.
This is part of my AndroidManifest.xml
<activity
android:name=".MainActivity"
android:label="#string/app_name"
android:configChanges="keyboard|keyboardHidden|orientation|screenSize|uiMode"
android:launchMode="singleTask"
android:windowSoftInputMode="adjustResize">
<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="https"/>
<!-- note that the leading "/" is required for pathPrefix-->
</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="http"/>
</intent-filter>
<intent-filter>
<action android:name="android.intent.action.SEND"/>
<category android:name="android.intent.category.DEFAULT"/>
<data android:mimeType="text/plain"/>
</intent-filter>
</activity>
And this is my code in react native where I am trying to retrieve the url -
useEffect(() => {
Linking.getInitialURL().then((url) => {
if (url) {
alert('got url ', url);
}
}).catch((e) => {
alert('got some error ', e)
});
}, []);
useEffect(() => {
const callback = (url) => alert("get url when app was open " + decodeURI(url));
Linking.addEventListener('url', callback);
return () => {
Linking.removeEventListener('url', callback);
};
}, []);
There are 2 options here - one when the app is already open and the other when the app was opened by the share process.
I don't get the url in any of the options.
I am running the app on a real android devices attached to my laptop in non debug mode.
And it seems like the app keep refreshing itself all the time.
Can someone explain what am I doing wrong?
Thanks
I think you're mixing up deep linking and share menu.
If you want to share urls to your app, you can use this extension https://www.npmjs.com/package/react-native-share-menu. This will add your app as a target while sharing from other apps/browser.
const handleShare = useCallback((item: ?SharedItem) => {
if (!item) {
return;
}
const { mimeType, data, extraData } = item;
setSharedData(data);
setSharedMimeType(mimeType);
// You can receive extra data from your custom Share View
console.log(extraData);
}, []);
useEffect(() => {
ShareMenu.getInitialShare(handleShare);},
[]);
You can find the url youre looking for in "data" field of "item: ?SharedItem"
With the help of uni_links library, I am connecting the payment screen in the browser with the app, to link back to the app once payment is successful. It all works as expected on iOS, and app is opened with return url. But on Android callback is not even called, that notifies me about the return url, even though the app is opened, meaning http linking part works.
This is what I've added in Android Manifest file:
<intent-filter android:autoVerify="true">
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<data
android:scheme="https"
android:host="www.redirect.mydomain.eu"
android:pathPrefix="/return_url"/>
</intent-filter>
And this is the callback from uni_links that I am listening to in order for it to trigger with the return url string, but it doesn't trigger on Android at all:
_subscription = getLinksStream().listen((String link) {
// Handle success case
}, onError: (err) {
// Handle exception by warning the user their action did not succeed
});
Any idea why this is not working on Android at all?
I need to authenticate user in my Flutter app which uses Spotify api.
I use flutter_web_auth to open WebView and let user login there.
I can't make it to return to app.
In Spotify Dashboard i have callback Uri set to: https://spotifydata.com/callback
final callbackUrl = "https://spotifydata.com/callback";
void _authenticateSpotfy() async {
final url = Uri.https('accounts.spotify.com', '/authorize', {
'response_type': 'code',
'client_id': clientID,
'redirect_uri': 'https://spotifydata.com/callback:/',
'scope': 'user-read-private user-read-email',
});
final result = await FlutterWebAuth.authenticate(
url: url.toString(), callbackUrlScheme: callbackUrl);
}
AndroidManifest.xml
<activity android:name="com.linusu.flutter_web_auth.CallbackActivity" >
<intent-filter android:label="flutter_web_auth">
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<data android:scheme="https://spotifydata.com/callback" />
</intent-filter>
</activity>
I have tried other answers on Stack but they don't seem to work.
As mentioned in Spotify's API docs, authentication redirects the user to the defined redirect_uri on successful request. Trying to log-in on https://spotifydata.com/, it has redirect_uri set as redirect_uri=https%3A%2F%2Fspotifydata.com%2Fsongdata. Make sure that the defined redirect_uri matches the callback scheme configured in the Manifest file since this enables the app to handle the redirect URL via the intent-filter.
I want to open my component in Application Android (Nativescript) from a link in email, that is Click here to reset password
I have a link like this in email:
http://secsystem.domain.tk/v1/resetPassword/11E8FC9
So when I click the link from my mobile browser I need the app Launched in component resetPassword.
I use the following code:
AndroidManifest.xml
<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="http" android:host="secsystem.domain.tk" android:path="/v1/resetPassword"></data>
</intent-filter>
This code works good only in this url: http://secsystem.domain.tk/v1/resetPassword
I want to work in this url: http://secsystem.domain.tk/v1/resetPassword/11E8FC9
In routing.ts I write this code:
{ path: 'v1/resetPassword/:id', component: ResetPassIdComponent },
I want to open this component when I click in link.
Is there any solution for this?
You should use android:pathPattern when the path has dynamic parameter.
Example
<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="http" android:host="secsystem.domain.tk" android:path="/v1/resetPassword/.*"></data>
</intent-filter>
So far this is all about making Android understand it has to open this app when this particular URL pattern is matched. Angular has nothing to do here. If you want to navigate to particular component when app is opened with this URL pattern, then you must handle it manually.
Install nativescript-urlhandler plugin and query the URL that was used to open the app in the app component and initiate navigation in your router accordingly.
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);
});
}
}
We have an Authservice which following the OAuth2 protocoll. The url is the following:
https://auth.domaon.com/web/login?client_id=client&login_redirect_uri=%2Fweb%2Fauthorize&redirect_uri=????????&response_type=code&state=somestate
How can I use it to login my users in our mobile app?
I tryed to Linking it.
openAuth() {
Linking.openURL('URL above');
}
componentDidMount() {
Linking.addEventListener('url', this._handleURL);
}
_handleURL(event) {
console.log(event.url);
console.log(event.url.split('#')[1].split('=')[1].split('&')[0]);
}
I don't know what I have to add to my redirect URL to redirect to my app.
I resolved it:
<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="schema"
android:host="url" />
</intent-filter>
Have to add it to Manifest.xml
App accessible on the schema://url path.