Enable Https Endpoint for Service Fabric Application

 

In this post, I would like to share with you on hosting a website in secure mode (https) in Service Fabric.

Assume that I have a ReactJs application is running on Service Fabric with HTTP endpoint as below.

Now, to secure this site by applying the SSL and let it’s running on HTTPs endpoint by following steps.

I. Generate SSL Certificate.

Generate SSL certification just for development purpose. If you want to host the application on PRD, you should request the certificates form your company CA provider.

For localhost Service Fabric I’m using below command to generate a certificate using OpenSSL.

  • Create private key.

  • Create certification

  • Convert cert to pfx

  • Import pfx file
    Open mmc.exe and import pfx file to Personal of Local Computer

If don’t have OpenSSL, download here.

II. Enable HTTPS for Service Fabric Application

1. Add application parameter.

Add a new parameter named CertThumbprint and value is Thumbprint of the certificate to Local1Node.xml and Local5Node.xml

We may have difference certificate for difference environments So we can push the Thumbprint value from the Continuous Delivery system.

2. Update the ApplicationManifest.xml

Adding one more CertThumbprint under Parameters section and one more EndpointCertificate name HttpsCert under Certificates section as below.

3. Update the Policies for Https endpoint

In the same ApplicationManifest add the below EndpointBindingPolicy config into ReactJs under ServiceManifestImport section which CertificateRef reference to the EndpointCertificate name added above and EndpointRef is a new service endpoint for https will be added later.

4. Update ServiceManifest.xml of ReactJs app.

Open ServiceManifest.xml of ReactJs and update the endpoint as below.

The name of Endpoint name and CertificateRef must be the same with EndpointRef and EndpointCertificate name which added into ApplicationManifest above.

5. Update the CommunicationListener

  • Using HttpSysCommunicationListener

If you are using HttpSysCommunicationListener then using the below setup for the endpoints.

Perfect, now run the application and we have a ReacJs is running https.

  • Using KestrelCommunicationListener 

With above configuration is not work for as KestrelCommunicationListener is not able to load the certificate from the configuration directly instead we need to add some additional code to load and binding the certificate manually as below.

The GetCertificateFromStore() method

Look into the GetCertificateFromStore you will see that I’m loading the certificate from the Config folder instead of from the Certificate Store. It means you can attach the certificate along with your application and binding it directly to the listener instead of import the certificate to every servers of Servicr Fabric cluster.

III. Working with Reverse Proxy.

However, the application is not accessible via Reversed Proxy because my local Service Fabric is running in unsecured mode and the Reverse proxy is supporting HTTP protocol.

In order to access the application via Reversed proxy, we need to run the Service Fabric in secure mode.

1. Run Local Service Fabric in a secured mode

In localhost run below PowerShell script to convert Service Fabric to secured mode.

After the done the installation, We will have secured Service Fabric cluster, and The application is accessible via Reversed proxy.

2. Run PRD Service Fabric in secure mode

If you PRD Service Fabric is unsecured then follow steps here to secure it.

Thanks for reading and download source code here.

Working with Service Fabric Reverse Proxy

 

The Reverse Proxy

Working with Service Fabric, you might hear about the Reverse Proxy, a built-in feature of Azure Service Fabric helps microservices running in a Service Fabric cluster discover and communicate with other services that have HTTP endpoints.

The benefit of Reverse Proxy is providing the standard uniform resource identifier format to identify the services running on Service Fabric Clusters. So you can access your services via Reverse Proxy regardless of the actual port of the services.

Refer here to understand more about the Reverse Proxy.

By default, After installed service fabric the Reverse Proxy will run on port 19081 and access the applications or services by following the format below.

Supported Platforms

Reverse proxy in Service Fabric currently supports the following platforms

  • Windows Cluster: Windows 8 and later or Windows Server 2012 and later.
  • Linux Cluster: Reverse Proxy is not currently available for Linux clusters.

So you should using Window 8 or 10 for develop in order to test the Reverse proxy.

The Service Fabric Application

Create a Service Fabric Application on Visual Studio you will see it allows to host various services inside.

There are 2 kindles of services:

  • The Internal services that are working as backend services and can be access by the other services within an application (using Microsoft.ServiceFabric.Services.Remoting.IService ).
  • The https services that allow users to operate with your data or an API services that exposing your data to other consumers outside of the application.

Check out here for more information about Service Fabric Application

In this demo, I created a Service Fabric application named MvcReservedProxy and added a ReactJs Mvc app. When running the application, I shall have a ReactJs app running on port 8383.

Port 8383 is a random value was assigned by Visual Studio when creating the service.

And here is the endpoint configuration in the service manifest.

The application is working perfectly fine with this port. However, let’s see if you have many apps running on PRD, and each application has some HTTP services inside, resolving the port conflict is a challenge as we need to ensure that the occupation ports are not conflicted with existing one in PRD environment.

Fortunately, Service Fabric doesn’t require the ports to be specified. Instead, it will pick-up the free ports when startup your services. After removed, the port from the endpoint and reran the application. I have a new port http://localhost:30001

Amazing, form now onward I don’t need to care about the ports of the HTTP services anymore.

But, whenever, my application got restarted, re-deployed it will have a new port. So, how can I access my application? Luckily, as mentioned above the Reverse proxy is using a specific uniform resource identifier format to identify the service. So, I can access my application via below URL:

However, the website is not working correctly as some resource files were not able to reach when accessing via Reverse proxy.

To fix this issues, we need to add some additional code to the ReactJs project as below.

I. Update ServiceInstanceListener

Open the ReacJs.cs and changes the ServiceFabricIntegrationOptions from None to UseReverseProxyIntegration

II. Update Mvc Startup configuration

Open Startup.cs and add below code into Configure method.

The ServiceNameUrl format is [YourApplicationName]/[YourServiceName].

III. Update Base Url for Javascript application

After the second step, the MVc application will work fine. However, if you are hosting javascript applications (ex: ReacJs or AngularjS), then you need to update the base tad into your _Layout.cshtml because the routing of ReactJs router will use it.

Use in here

Now, Rerun the application and see the result.

Cheers and the source code here.