Hey everyone,
Im designing a web app that uses the Apple Music API to have all the same functionality as the Music app on the iPhones. My problem is that im getting 401 status codes when trying to retrieve users recently played and recently added. Im using Angular and the HTTPClient module to handle the requests and the reuqest is going through but its throwing the 401. My developer token is good for 6 months and im signed in using my personal Apple Music account. Any suggestions?
Also heres how im handling the requests:
app.module.ts: (I import the HTTPClientModule here)
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { UiModule } from './ui/ui.module';
import { HttpClientModule } from '@angular/common/http';
@NgModule({
declarations: [
AppComponent,
],
imports: [
BrowserModule,
HttpClientModule,
AppRoutingModule,
UiModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
musickit.service.ts: (I import the HttpClient to make the requests and then create methods to handle the requests)
import { HttpClient } from '@angular/common/http';
@Injectable({
providedIn: 'root'
})
export class MusickitService {
constructor(private http: HttpClient) { }
//Create method to get recently played and return JSON datagetRecentlyPlayed() {
return this.http.get('https://api.music.apple.com/v1/me/recent/played');
}
//Create method to get recently added and return JSON datagetRecentlyAdded() {
return this.http.get('https://api.music.apple.com/v1/me/library/recently-added');
}
}
content.component.ts: (I take the methods from the service and import them and then use the OnInit method to call the methods and display the returned data to the log to make sure they returning a 200, but sadly i get a 401)
import { MusickitService } from 'src/app/services/musickit.service';
@Component({
selector: 'app-content',
templateUrl: './content.component.html',
styleUrls: ['./content.component.css']
})
export class ContentComponent implements OnInit {
recentlyPlayed: object;
recentlyAdded: object;
constructor(private data: MusickitService) { }
ngOnInit() {
this.data.getRecentlyPlayed().subscribe(data => {
this.recentlyPlayed = data;
console.log(this.recentlyPlayed);
});
this.data.getRecentlyAdded().subscribe(data => {
this.recentlyAdded = data;
console.log(this.recentlyAdded);
});
}
}
