Proper use of transformers vs interceptors

Question

When POSTing to an endpoint in a service layer to update a user's profile, I need to strip certain values from the request payload (the profile with the desired modifications from the client) and re-attach them in the response payload (the updated profile from the server). I am currently performing behavior using Angular's request and response transformers, like this:

myService.updateProfile = function (profile) {

    return $http({
        method: 'POST',
        withCredentials: true,
        url: root + 'users/profile',
        data: profile,
        transformRequest : requestTransformer,
        transformResponse : responseTransformer
    });

};

// the map used during transformation below
var myMap = {
    0: 'foo', 
    1: 'bar',
    2: 'etc'
};

// prependTransform() and appendTransform() are similar to the example provided in Angular transformer docs here:
// https://docs.angularjs.org/api/ng/service/$http#overriding-the-default-transformations-per-request
var requestTransformer = httpTransformer.prependTransform($http.defaults.transformRequest, function(profileRequest) {
    profileRequest.myKey = myMap.indexOf(profileRequest.myValue);
    delete profileRequest.myValue;

    return profileRequest;
});
var responseTransformer = httpTransformer.appendTransform($http.defaults.transformResponse, function(profileResponse) {
    profileRequest.myValue = myMap[profileRequest.myKey];
    delete profileRequest.myKey;

    return profileResponse;
});

I prepend a transformer to the default request transformers and append a transformer to the default response transformers. My question is, is there a better way to do this? Perhaps using interceptors, as documented here, instead? If so, how?

I would just wrap the http request in a service. Basically, before the call, you strip it, then it comes back down, you can add it back in a .then call. — Strawberry, May 01 '15 at 05:34
You can use interceptors but they're mostly helpful for intercepting HTTP requests/responses globally (meaning for each call made). You can still use interceptors but you have to determine the specific API route that only will be handled by your interceptor. — Dennis Rongo, Jun 16 '15 at 19:29

score 0 · Answer 1 · answered Jun 16 '15 at 19:52

I think your solution is fine but if you want an alternative, you can intercept specific requests like so. HTTP interceptors are mostly useful for handling global HTTP requests/responses (auth, error handling, etc.).

In any case, the "response" payload should be taken cared of from the API/server-side.

$provide.factory('userProfileInterceptor', function() {
  return {
    request: function(config) {
       if (config.url.indexOf('/users/profile') >=0){
           if (config.params.myValue) delete config.params.myValue;
       }
       return config;
    },
    response: function(response) {
       if (response.config.url.indexOf('/users/profile') >=0){
           delete response.data.myKey;
       }
       return response;
    }
  };
});

$httpProvider.interceptors.push('userProfileInterceptor');

Proper use of transformers vs interceptors

1 Answers1