What is a proxy pattern?

The proxy pattern is a structural design pattern. 

Proxy means ‘in place of’, representing’ or ‘in place of’ or ‘on behalf of’ are literal meanings of the proxy, and that directly explains Proxy Design Pattern.

The proxy pattern classifies include Remote Proxy, Virtual Proxy, Protection Proxy, Monitor Proxy, Firewall Proxy, Cache Proxy, Synchronization Proxy, Copy-On-Write Proxy, and Smart Reference Proxy.

When should I use the proxy pattern?

The adapter pattern should be used when:

• protect access to the methods of the real object.
• additional operations are needed before executing the method of the actual object.
• many accesses to the object there is a large initialization.
• original object is in an old system or a third-party library.

How to implement

Role enum

enum ERole {
  Admin = 'admin',
  Customer = 'customer',
}

SaleChannelService interface

interface SaleChannelService {
  loadPage();
  parseToCsv();
}

AbcSaleChannelService implement

export class AbcSaleChannelService implements SaleChannelService {
  private readonly _url: string;

  constructor(url: string) {
    this._url = url;
  }

  loadPage() {
    return `HTML dom from URL ${this._url}`;
  }

  parseToCsv() {
    return 'CSV content';
  }
}

SaleChannelProxy implement

export class SaleChannelProxy implements SaleChannelService {
  private readonly _role: ERole;
  private readonly _abcSaleChannelService: AbcSaleChannelService;
  private readonly _url: string;
  private _htmlDom: string;

  constructor(role: ERole, url: string) {
    this._role = role;
    this._url = url;
    this._abcSaleChannelService = new AbcSaleChannelService(url);
  }

  loadPage() {
    if (!this.allowAccessToResource()) {
      throw Error(`The ${this._role} does not allow access to ${this._url}`);
    }
    
    const htmlDom = this._abcSaleChannelService.loadPage();
    this._htmlDom = (!this._htmlDom && htmlDom) || '';

    return htmlDom;
  }


  parseToCsv() {
    if (!this._htmlDom) {
      console.log(`The ${this._url} is loaded.`);
      return '';
    }

    return this._abcSaleChannelService.parseToCsv();
  }

  private allowAccessToResource() {
    return this._role === ERole.Admin;
  }
}

The client code

function client() {
  const admin = new SaleChannelProxy(ERole.Admin, 'https://abc.com');
  console.log(admin.loadPage());
  console.log(admin.parseToCsv());

  console.log(admin.loadPage());
  console.log(admin.parseToCsv());

  const customers = new SaleChannelProxy(ERole.Customer, 'https://abc.com');
  console.log(customers.loadPage());
  console.log(customers.parseToCsv());
}

client();

Result

HTML dom from URL https://abc.com
CSV content

HTML dom from URL https://abc.com
The https://abc.com is loaded.

Error: The customer does not allow access to https://abc.com

Pros and Cons

Pros:

• Easy to upgrade and maintain.
• Protection for the real object from the outside world.
• Improved Performance.

Cons:

• The response from the service might get delayed.
• The code may become more complicated since you need to introduce a lot of new classes.



Wrapping Up

Thank you for reading, and happy coding!

I hope this article will help make the concepts of the Proxy Pattern