[angular] getting authorization token

angular
javascript
authentication

#1

Hey,

I am using angular platform. currently I am developing an authorization service to just to get the auth_token and to validate it. I always get “POST https://api.moltin.com/oauth/access_token 400 (Bad Request)” result in my console. I am doubt there is some problem in headers (if there is anything missing) so I attached the authorization service code.

One thing to note, I know I may use moltin javascript sdk but from some reasons I need to implement an angular native service in this project.

The main reason is that there are some important functionalities are not implemented in javascript api, such as getting product images (file) url. I can see in the api reference: Not supported yet

import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { JwtHelper } from 'angular2-jwt'
import "rxjs/add/operator/map"

const httpOptions = {
  headers: new HttpHeaders({
    'Content-Type':  'multipart/form-data'
  })
};

@Injectable()
export class ApiAuthService {

  constructor(private http: HttpClient) { }

  getAuthToken() { // to be changed later to config file
    var form = new FormData();
    form.append("client_id", "XXX");
    form.append("client_secret", "XXX");
    form.append("grant_type", "client_credentials");

    return this.http.post("https://api.moltin.com/oauth/access_token", form, httpOptions)
    .map(response => {
      console.log(response);
    })
  }
}

#2

Hi @khaled1

Is there any additional information provided in the request that returns a 400 response?

I’d always recommend you use the moltin JS SDK if you’re using JavaScript, that way you can take advantage of our efforts to handle authentication. We’ll also silently handle re-authenticating when the token expires for you.

You’re able to wrap the moltin SDK inside a provider and specify your own custom functions that call the SDK.

Here is an example of a moltin provider that exposes a getProductBySku custom method. The SDK also has Authenticate that you can call to handle your auth.

import { gateway as MoltinGateway } from '@moltin/sdk'
import { Observable } from 'rxjs'
import { HttpClient } from '@angular/common/http'
import { Injectable } from '@angular/core'

interface MoltinProduct {
  id: string
  name: string
  slug: string
  sku: string
  description: string
  main_image: string
}

@Injectable
export class Moltin {
  private moltin = MoltinGateway({
    client_id: 'j6hSilXRQfxKohTndUuVrErLcSJWP15P347L6Im0M4'
  })

  constructor(public httpClient: HttpClient) {
    console.log(this.moltin)
  }

  getProductBySku(sku: string): Observable<MoltinProduct> {
    return new Observable<MoltinProduct>(observer => {
      const request = this.moltin.Products

      request.Filter({
        eq: {
          sku
        }
      })

      request
        .All()
        .then(products => {
          const product = products.data[0]

          if (!product) {
            observer.error({ error: 'Product not found' })
            observer.complete()
            return
          }
        })
        .then(data => {
          observer.next(data[0])
          observer.complete()
        })
        .catch(error => {
          observer.error(error)
          observer.complete()
        })
    })
  }
}

Regards,
Jamie


#3

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.