##Intro A native module that allows you to use the Spotify SDK API (IOS beta 17) with JavaScript through react-native.
##Set-up: ###Using npm
Recomended
-
Use
npm install react-native-spotify
from the directory of your project in your command line. -
Download the Spotify IOS SDK beta 17 here and unzip it.
-
Open your react native project in Xcode and drag the unzipped
Spotify.framework
file into theFrameworks
group in your Xcode project (create the group if it doesn’t already exist). In the import dialog, tick the box for Copy items into destinations group folder (or Destination: Copy items if needed). -
Please folow the instructions on the "Creating Your Client ID, Secret and Callback URI" and "Setting Up Your Build Environment" sections of the Spotify iOS SDK Tutorial
Important Note! When adding frameworks to the list in the "Link Binary With Libraries" section you wll need to add
WebKit.framework
in addition to those mentioned in the tutorial.
- Go to
node-modules/react-native-spotify/
and copy the following files to theios
directory of your project:SpotifyLoginViewController.m
SpotifyLoginViewController.h
SpotifyAuth.m
SpotifyAuth.h
###Using git
-
Fork and clone the repo.
-
Download the Spotify IOS SDK beta 17 here and unzip it.
-
Open your react native project in Xcode and drag the unzipped
Spotify.framework
file into theFrameworks
group in your Xcode project (create the group if it doesn’t already exist). In the import dialog, tick the box for Copy items into destinations group folder (or Destination: Copy items if needed). -
Please folow the instructions on the "Creating Your Client ID, Secret and Callback URI" and "Setting Up Your Build Environment" sections of the Spotify iOS SDK Tutorial
Important Note! When adding frameworks to the list in the "Link Binary With Libraries" section you wll need to add
WebKit.framework
in addition to those mentioned in the tutorial.
- From this project directory, go to
react-native-spotify/spotifyModule/ios
and copy the following files to theios
directory of your project:SpotifyLoginViewController.m
SpotifyLoginViewController.h
SpotifyAuth.m
SpotifyAuth.h
##How to use:
//You need to import NativeModules to your view
import { NativeModules } from 'react-native';
//Assign our module from NativeModules and assign it to a variable
var SpotifyAuth = NativeModules.SpotifyAuth;
class yourComponent extends Component {
//Some code ...
someMethod(){
//You need this to Auth a user, without it you cant use any method!
const options = {
clientID: 'your-clientID',
redirectURL: 'your-app-schema://callback',
requestedScopes: ['streaming',...]
};
SpotifyAuth.login(options, (error) => {
if (error) {
//handle error
} else {
//handle success
}
});
}
##Exposed API:
###Auth:
options:callback
You need this to Auth a user, without it you cant use any other methods!
Set your Client ID, Redirect URL, Scopes and start the auth process
Option | description |
---|---|
clientID | (String) The client ID of your registered Spotify app |
redirectURL | (String) The Redirect URL of your registered Spotify app |
requestedScopes | (Array) list of scopes of your app, see here |
tokenSwapURL | (String) Backend URL to exchange authorization code for access token (only Authorization Code Flow see here) |
tokenRefreshURL | (String) Backend URL to refresh an access token (only Authorization Code Flow see here) |
callback | (Function) a callback to handle the login success/error |
const options = {
clientID: 'your-clientID',
redirectURL: 'your-app-schema://callback',
requestedScopes: ['streaming',...]
};
SpotifyAuth.login(options,(error)=>{console.log(error)});
const options = {
clientID: 'your-clientID',
redirectURL: 'your-app-schema://callback',
requestedScopes: ['streaming',...],
tokenSwapURL: 'http://your.backend.com/token/swap',
tokenRefreshURL: 'http://your.backend.com/token/refresh'
};
SpotifyAuth.login(options,(error)=>{console.log(error)});
###SPTAudioStreamingController Class:
initialized
Returns true when SPTAudioStreamingController is initialized, otherwise false
Parameter | description |
---|---|
Callback | (Function) a callback to handle the response |
Example:
SpotifyAuth.initialized((res)=>{console.log(res);});
Returns true if the receiver is logged into the Spotify service, otherwise false
Parameter | description |
---|---|
Callback | (Function) a callback to handle the response |
Example:
SpotifyAuth.loggedIn((res)=>{console.log(res);});
Returns true if the receiver is playing audio, otherwise false
Parameter | description |
---|---|
Callback | (Function) a callback to handle the response |
Example:
SpotifyAuth.isPlaying((res)=>{console.log(res);});
Returns the volume
Parameter | description |
---|---|
Callback | (Function) a callback to handle the response |
Example:
SpotifyAuth.volume((res)=>{console.log(res);});
Returns true if the receiver expects shuffled playback, otherwise false
Parameter | description |
---|---|
Callback | (Function) a callback to handle the response |
Example:
SpotifyAuth.shuffle((res)=>{console.log(res);});
Returns true if the receiver expects repeated playback, otherwise false
Parameter | description |
---|---|
Callback | (Function) a callback to handle the response |
Example:
SpotifyAuth.repeat((res)=>{console.log(res);});
Returns the current approximate playback position of the current track
Parameter | description |
---|---|
Callback | (Function) a callback to handle the response |
Example:
SpotifyAuth.currentPlaybackPosition((res)=>{console.log(res);});
Returns the length of the current track
Parameter | description |
---|---|
Callback | (Function) a callback to handle the response |
Example:
SpotifyAuth.currentTrackDuration((res)=>{console.log(res);});
Returns the current track URI, playing or not
Parameter | description |
---|---|
Callback | (Function) a callback to handle the response |
Example:
SpotifyAuth.currentTrackURI((res)=>{console.log(res);});
Returns the currenly playing track index
Parameter | description |
---|---|
Callback | (Function) a callback to handle the response |
Example:
SpotifyAuth.currentTrackIndex((res)=>{console.log(res);});
Returns the current streaming bitrate the receiver is using
Parameter | description |
---|---|
Callback | (Function) a callback to handle the response |
Example:
SpotifyAuth.targetBitrate((res)=>{console.log(res);});
Logout from Spotify
Parameter | description |
---|---|
N/A | N/A |
Example:
SpotifyAuth.logout();
Set playback volume to the given level. Volume is a value between 0.0
and 1.0
.
Parameter | description |
---|---|
volume | (Number) The volume to change to, value between 0.0 and 1.0 |
Callback | (Function) a callback that will pass back an NSError object if an error ocurred |
Example:
SpotifyAuth.setVolume(0.8,(error)=>{console.log(error);});
Set the target streaming bitrate. 0
for low, 1
for normal and 2
for high
Parameter | description |
---|---|
bitrate | (Number) The bitrate to target |
Callback | (Function) a callback that will pass back an NSError object if an error ocurred |
Example:
SpotifyAuth.setTargetBitrate(2,(error)=>{console.log(error);});
Seek playback to a given location in the current track (in secconds).
Parameter | description |
---|---|
offset | (Number) The time to seek to |
Callback | (Function) a callback that will pass back an NSError object if an error ocurred |
Example:
SpotifyAuth.seekToOffset(110,(error)=>{console.log(error);});
-playURIs:withOptions:callback:
Play a list of Spotify URIs.(at most 100 tracks).SPTPlayOptions
containing extra information about the play request such as which track to play and from which starting position within the track.
Parameter | description |
---|---|
uris | (Array) The array of URI’s to play (at most 100 tracks) |
options | (Object) with trackIndex:(Number) and/or startTime:(Number) (can be null) |
Callback | (Function) a callback that will pass back an NSError object if an error ocurred |
Example:
SpotifyAuth.playURIs(["spotify:track:6HxIUB3fLRS8W3LfYPE8tP",...], {trackIndex :0, startTime:12.0},(error)=>{console.log(error)});
-replaceURIs:withCurrentTrack:callback:
Replace the current list of tracks without stopping playback.
Parameter | description |
---|---|
uris | (Array) The array of URI’s to play |
index | (Number) The current track in the list |
Callback | (Function) a callback that will pass back an NSError object if an error ocurred |
Example:
SpotifyAuth.replaceURIs(["spotify:track:6HxIUB3fLRS8W3LfYPE8tP",...], 0, (error)=>{console.log(error)});
Play a Spotify URI.
Parameter | description |
---|---|
uri | (Number) The URI to play |
Callback | (Function) a callback that will pass back an NSError object if an error ocurred |
Example:
SpotifyAuth.playURI("spotify:track:6HxIUB3fLRS8W3LfYPE8tP",(error)=>{console.log(error);});
Queue a Spotify URI.
Parameter | description |
---|---|
uri | (String) The URI to queue |
Callback | (Function) a callback that will pass back an NSError object if an error ocurred |
Example:
SpotifyAuth.queueURI("spotify:track:6HxIUB3fLRS8W3LfYPE8tP",(error)=>{console.log(error);});
Set the "playing" status of the receiver.
Parameter | description |
---|---|
playing | (Boolean) Pass true to resume playback, or false to pause it |
Callback | (Function) a callback that will pass back an NSError object if an error ocurred |
Example:
SpotifyAuth.setIsPlaying(true,(error)=>{console.log(error);});
Stop playback and clear the queue and list of tracks.
Parameter | description |
---|---|
Callback | (Function) a callback that will pass back an NSError object if an error ocurred |
Example:
SpotifyAuth.stop((error)=>{console.log(error);});
Go to the next track in the queue
Parameter | description |
---|---|
Callback | (Function) a callback that will pass back an NSError object if an error ocurred |
Example:
SpotifyAuth.skipNext((error)=>{console.log(error);});
-skipPrevious:(RCTResponseSenderBlock)block
Go to the previous track in the queue
Parameter | description |
---|---|
Callback | (Function) a callback that will pass back an NSError object if an error ocurred |
Example:
SpotifyAuth.skipPrevious((error)=>{console.log(error);});
###SPTSearch Class:
+performSearchWithQuery:queryType:offset:accessToken:market:callback:
Go to the previous track in the queue You need to have a session first
Parameter | description |
---|---|
searchQuery | (String) The query to pass to the search |
searchQueryType | (String) The type of search to do ('track', 'artist', 'album' or 'playList') |
offset | (Number) The index at which to start returning results |
market | (String) Either a ISO 3166-1 country code to filter the results to, or “from_token” |
Callback | (Function) callback to be called when the operation is complete. The block will pass an Array filled with json Objects on success, otherwise an error. |
Example:
SpotifyAuth.performSearchWithQuery('lacri','artist',0,'US',(err, res)=>{
console.log('error', err);
console.log('result', res);
});
##Demo:
Included in the repo.
![alt text](https://github.com/viestat/react-native-spotify/blob/master/SpotifyAuthDemoEdit.gif?raw=true = 250x "Demo")