AUR5001

Error Message

AUR5001: The config callback did not return a valid HttpClientConfiguration like instance. Received {{value}}

Where {{value}} is the actual value that was returned from the configuration callback.

Description

This error occurs when the configuration callback passed to HttpClient.configure() returns something other than a valid HttpClientConfiguration instance. The configure method expects the callback to return the configuration object to enable method chaining.

Common Scenarios

Forgetting to Return Configuration

import { HttpClient } from '@aurelia/fetch-client';

const client = new HttpClient();

// ❌ Wrong: Not returning the config
client.configure(config => {
  config.withBaseUrl('https://api.example.com');
  // Missing return statement - this will throw AUR5001
});

Returning Wrong Value

// ❌ Wrong: Returning something else
client.configure(config => {
  config.withBaseUrl('https://api.example.com');
  return 'done'; // This will throw AUR5001
});

Async Configuration Mistakes

// ❌ Wrong: Returning a Promise instead of config
client.configure(async config => {
  await someAsyncOperation();
  config.withBaseUrl('https://api.example.com');
  return config; // This returns Promise<HttpClientConfiguration>, not HttpClientConfiguration
});

Solutions

1. Always Return the Configuration Object

import { HttpClient } from '@aurelia/fetch-client';

const client = new HttpClient();

// ✅ Correct: Return the config object
client.configure(config => {
  config
    .withBaseUrl('https://api.example.com')
    .withDefaults({
      headers: {
        'Content-Type': 'application/json',
        'Authorization': 'Bearer token'
      }
    });
  
  return config; // Important: return the config
});

2. Use Method Chaining (No Return Needed)

// ✅ Correct: Method chaining automatically returns config
client.configure(config => 
  config
    .withBaseUrl('https://api.example.com')
    .withDefaults({
      headers: { 'Content-Type': 'application/json' }
    })
    .withInterceptor({
      request(request) {
        console.log('Making request:', request.url);
        return request;
      }
    })
);

3. Handling Async Configuration

If you need async configuration, handle it outside the configure callback:

// ✅ Correct: Handle async operations outside configure
async function setupHttpClient() {
  const apiConfig = await loadApiConfiguration();
  
  return client.configure(config => 
    config
      .withBaseUrl(apiConfig.baseUrl)
      .withDefaults({
        headers: apiConfig.defaultHeaders
      })
  );
}

4. Complex Configuration with Helper Functions

function createAuthInterceptor(token: string) {
  return {
    request(request: Request) {
      request.headers.set('Authorization', `Bearer ${token}`);
      return request;
    }
  };
}

// ✅ Correct: Return the config after all operations
client.configure(config => {
  config.withBaseUrl('https://api.example.com');
  
  if (userToken) {
    config.withInterceptor(createAuthInterceptor(userToken));
  }
  
  return config; // Always return config
});

Example: Complete Configuration

import { HttpClient } from '@aurelia/fetch-client';
import { autoinject } from '@aurelia/kernel';

@autoinject
export class ApiService {
  constructor(private http: HttpClient) {
    this.configureHttpClient();
  }
  
  private configureHttpClient() {
    this.http.configure(config => {
      return config
        .withBaseUrl('https://api.example.com')
        .withDefaults({
          credentials: 'same-origin',
          headers: {
            'Accept': 'application/json',
            'X-Requested-With': 'Fetch'
          }
        })
        .withInterceptor({
          request(request) {
            console.log(`Requesting ${request.method} ${request.url}`);
            return request;
          },
          response(response) {
            console.log(`Received ${response.status} ${response.url}`);
            return response;
          }
        });
    });
  }
}

Debugging Tips

1. Check Return Statement: Ensure your configuration callback returns the config parameter

2. Avoid Async Callbacks: The configure callback should be synchronous

3. Use Method Chaining: Leverages the fluent API and automatically returns the config

4. TypeScript Helps: Use TypeScript to catch return type mismatches at compile time