Sebastien
Sebastien

Reputation: 95

Backend from Angular 1.x for Angular2

I am trying to migrate from Angular 1.5 to Angular 2.4. I have question about backend. Is it possible to use my backend from Angular 1 app to my Angular 2 app without any changes on backend side? If answer is yes why i get this error net::ERR_SSL_PROTOCOL_ERROR when trying to log in app on Angular2 ?

Angular 2 code:

 login(loginData: User): Observable<User> {
        let data = 'grant_type=password&username=' + encodeURIComponent(loginData.username) + "&password=" + encodeURIComponent(loginData.password);

        return this.http.post(`${this.authUrl}` + 'token', data)
            .map(res => res.json())
            .do(res => {
                if (res.token) {
                    localStorage.setItem('authorizationData', res.token);
                    this.loggedIn = true;
                }
            })
            .catch(this.handleError);    
    }

Angular 1 code:

function (loginData) {

    var data = "grant_type=password&username=" + encodeURIComponent(loginData.userName) + "&password=" + encodeURIComponent(loginData.password);

$http.post(serviceBase + 'token', data, { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } });

Upvotes: 0

Views: 119

Answers (1)

AngularChef
AngularChef

Reputation: 14087

Are you sure you're HTTP POSTing to the same URL? (i.e. that serviceBase and this.authUrl + 'token' contain the same value?

Why are you NOT setting the Content-Type in your Angular 2 code?

Here's how you can do it:

let headers: Headers = new Headers();
headers.append('Content-Type', 'application/x-www-form-urlencoded');
let options: RequestOptionsArgs = { headers: headers };

// ...

return this.http.post(`${this.authUrl}token`, data, options); // `options` has appeared

Side note: DON'T do this:

`${this.authUrl}` + 'token'

The point of template literals (the backticks) is to AVOID concatenation (the + sign).

Instead, you should write this:

`${this.authUrl}token`

Or that:

this.authUrl + 'token'

But not a combination of both. :)

Upvotes: 2

Related Questions