In the realm of e-commerce today, shipping is crucial. Consumers anticipate accurate and timely delivery. FedEx and UPS are two well-known shipping companies. Creating shipping labels, tracking deliveries, and automatically calculating shipping costs are all made possible by connecting their APIs when developing an ERP, e-commerce, or shipping system. In this tutorial, I will demonstrate how to easily integrate the UPS and FedEx APIs using Angular for the frontend and ASP.NET Core for the backend.
Create Developer Account
UPS:
- Go to UPS Developer Portal.
- Sign up for a free account.
Request API access keys. You will get:
- Access Key
- Username
- Password
Note the API endpoints (sandbox and production).
FedEx:
- Go to FedEx Developer Portal.
- Sign up for a free developer account.
Request API credentials:
- Key
- Password
- Account Number
- Meter Number
Note FedEx sandbox and production URLs.
Backend Setup: ASP.NET Core
We will create APIs in ASP.NET Core to talk to UPS and FedEx.
Step 1. Create ASP.NET Core Project
dotnet new webapi -n ShippingAPI
cd ShippingAPI
Step 2. Add Required Packages
Install HttpClientFactory and Newtonsoft.Json for calling API and parsing response:
dotnet add package Microsoft.Extensions.Http
dotnet add package Newtonsoft.Json
Step 3. Create Model for Shipping Request
Create ShippingRequest.cs:
public class ShippingRequest
{
public string ServiceType { get; set; } // e.g. "Ground", "Express"
public string SenderAddress { get; set; }
public string ReceiverAddress { get; set; }
public decimal PackageWeight { get; set; }
public string PackageDimensions { get; set; }
}
Step 4. Create UPS Service
Create UpsService.cs:
using System.Net.Http;
using System.Text;
using Newtonsoft.Json;
public class UpsService
{
private readonly HttpClient _httpClient;
public UpsService(HttpClient httpClient)
{
_httpClient = httpClient;
}
public async Task<string> CreateShipmentAsync(ShippingRequest request)
{
var upsRequest = new
{
Shipment = new
{
Shipper = new { Address = request.SenderAddress },
ShipTo = new { Address = request.ReceiverAddress },
Package = new { Weight = request.PackageWeight }
}
};
var json = JsonConvert.SerializeObject(upsRequest);
var content = new StringContent(json, Encoding.UTF8, "application/json");
var response = await _httpClient.PostAsync("https://onlinetools.ups.com/rest/Ship", content);
return await response.Content.ReadAsStringAsync();
}
}
Step 5. Create FedEx Service
Create FedExService.cs:
using System.Net.Http;
using System.Text;
using Newtonsoft.Json;
public class FedExService
{
private readonly HttpClient _httpClient;
public FedExService(HttpClient httpClient)
{
_httpClient = httpClient;
}
public async Task<string> CreateShipmentAsync(ShippingRequest request)
{
var fedExRequest = new
{
RequestedShipment = new
{
ShipTimestamp = DateTime.UtcNow,
Shipper = new { Address = request.SenderAddress },
Recipient = new { Address = request.ReceiverAddress },
PackageCount = 1,
PackageWeight = request.PackageWeight
}
};
var json = JsonConvert.SerializeObject(fedExRequest);
var content = new StringContent(json, Encoding.UTF8, "application/json");
var response = await _httpClient.PostAsync("https://apis-sandbox.fedex.com/ship/v1/shipments", content);
return await response.Content.ReadAsStringAsync();
}
}
Step 6. Register Services in Program.cs
builder.Services.AddHttpClient<UpsService>();
builder.Services.AddHttpClient<FedExService>();
Step 7. Create Shipping Controller
[ApiController]
[Route("api/[controller]")]
public class ShippingController : ControllerBase
{
private readonly UpsService _upsService;
private readonly FedExService _fedExService;
public ShippingController(UpsService upsService, FedExService fedExService)
{
_upsService = upsService;
_fedExService = fedExService;
}
[HttpPost("ups")]
public async Task<IActionResult> CreateUpsShipment([FromBody] ShippingRequest request)
{
var result = await _upsService.CreateShipmentAsync(request);
return Ok(result);
}
[HttpPost("fedex")]
public async Task<IActionResult> CreateFedExShipment([FromBody] ShippingRequest request)
{
var result = await _fedExService.CreateShipmentAsync(request);
return Ok(result);
}
}
Frontend Setup: Angular
Step 1. Create Angular Service
ng generate service shipping
shipping.service.ts:
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
@Injectable({ providedIn: 'root' })
export class ShippingService {
private baseUrl = 'https://localhost:5001/api/shipping';
constructor(private http: HttpClient) {}
createUpsShipment(shippingData: any) {
return this.http.post(`${this.baseUrl}/ups`, shippingData);
}
createFedExShipment(shippingData: any) {
return this.http.post(`${this.baseUrl}/fedex`, shippingData);
}
}
Step 2. Create an Angular Component
ng generate component shipping
shipping.component.ts:
import { Component } from '@angular/core';
import { ShippingService } from './shipping.service';
@Component({
selector: 'app-shipping',
templateUrl: './shipping.component.html'
})
export class ShippingComponent {
shippingData = {
serviceType: 'Ground',
senderAddress: 'Sender Address Here',
receiverAddress: 'Receiver Address Here',
packageWeight: 2
};
constructor(private shippingService: ShippingService) {}
createUpsShipment() {
this.shippingService.createUpsShipment(this.shippingData).subscribe(res => {
console.log('UPS Response:', res);
});
}
createFedExShipment() {
this.shippingService.createFedExShipment(this.shippingData).subscribe(res => {
console.log('FedEx Response:', res);
});
}
}
shipping.component.html:
<h3>Create Shipment</h3>
<button (click)="createUpsShipment()">Create UPS Shipment</button>
<button (click)="createFedExShipment()">Create FedEx Shipment</button>
Test Your Integration
Run ASP.NET Core backend: dotnet run
Run Angular frontend: ng serve
Open the Angular app in the browser and click Create UPS Shipment or Create FedEx Shipment.
Check the console for response and verify the shipping label or tracking number returned by UPS/FedEx.
Notes and Tips
- Always test first in sandbox environment.
- Keep API keys and passwords secure (never commit to Git).
- For production, switch to production API URLs.
- You can extend this integration to track shipments, calculate rates, and print labels.
Conclusion
Integrating UPS and FedEx APIs in your system using ASP.NET Core and Angular helps automate shipping, save time, and reduce errors. Once integrated, you can easily create shipments, track them, and manage shipping cost dynamically. By following this guide step by step, even beginners can implement shipping API integration without much trouble.