This article covers how to proxy Noticeable public endpoints used by Noticeable Newspages and Widgets. Proxying is not recommended in all cases. This is purely an option requested by some organizations to meet their specialized security needs.

Introduction

A proxy service relays requests between a client and another service, acting as an intermediary step. Building a proxy lets you proxy requests to Noticeable endpoints through your own domain. For example, you can send requests on client browsers to noticeable.your-domain.com/widgets-data instead of directly to data.widgets.noticeable.io. A proxy service relays the requests to the Noticeable platform.

Sending data through a self-owned proxy service gives you better control of the data you collect and send to the Noticeable platform. Using a proxy service can have these benefits:

Self-owned audit logging of data.
Easier debugging, filtering, and blocking of events.
Anonymizing end-users. For example, remove originating IP address, location, user ID, and more.

Building a proxy solution

You should notice that Noticeable makes use of different public endpoints. As a consequence, you may decide to proxy one or more:

EndpointDescriptionRequirements
https://data.widgets.noticeable.ioUsed by Noticeable to retrieve data that is needed to render widgets (e.g. publications, project name, widget preferences)Must support GET and OPTIONS requests for any path
https://pipeline.noticeable.ioUsed by Noticeable Newspages and Widgets to report comments, metrics, or reactions.Must support POST, PUT, and OPTIONS requests for any path


Your proxy must be scaled to support your end-user's network traffic. Noticeable is unable to provide estimates for this traffic because it is a function of your active users, the number of requests your app makes to the Noticeable infrastructure via the Noticeable SDK, the size of your content, and the amount of content being shown.

Setting up a Caddy server

The example in this guide uses Caddy to build a proxy server. Caddy is an open-source solution to building a proxy. Here is a Caddyfile configuration sample to setup a proxy to Noticeable endpoints in seconds, including HTTPS support:

noticeable.your-domain.com {
        handle_path /pipeline/* {
                uri strip_prefix /pipeline
                reverse_proxy https://pipeline.noticeable.io {
                        header_up Host {http.reverse_proxy.upstream.hostport}
                }
        }
        handle_path /widgets-data/* {
                uri strip_prefix /widgets-data
                reverse_proxy https://data.widgets.noticeable.io {
                        header_up Host {http.reverse_proxy.upstream.hostport}
                }
        }
}


The configuration above maps https://noticeable.your-domain.com/pipeline/* to https://pipeline.noticeable.io and https://noticeable.your-domain.com/widgets-data/* to https://data.widgets.noticeable.io. By default, all inbound and outbound headers are passed as-is. If you want to remove some headers, you will need to adapt the configuration by yourself.

Available services on major cloud providers

Most major cloud providers have their own services for easy development and deployment of scalable APIs that you can use to create a proxy. You can also use API services to set up outbound traffic to Noticeable. If you use a cloud provider, refer to their documentation to set up a proxy service and for their quickstart guides:

Amazon Web Services: API Gateway
Microsoft Azure: API Management
Google Cloud: API Gateway

Configuring Noticeable to work with alternate endpoints

Newspages

Open the Noticeable dashboard and select a project.
Click on Newspage in the left navigation.
In the page that appears, scroll to the bottom of the page and select "Advanced options".
You should now see a field to configure the pipeline endpoint used by Noticeable on Newspages. Enter your proxy URL and press enter:



Widgets

Before calling noticeable.render(...) to render a Noticeable widget, make sure to define global preferences as follows with the Noticeable SDK:

noticeable.set('preferences', {
  endpoints: {
    pipeline: 'https://noticeable.your-domain.com/pipeline', 
    widgets_data: 'https://noticeable.your-domain.com/widgets-data
  }
});
noticeable.render(...)


Setting global preferences must be done before all other calls to the Noticeable SDK.

Validation and deployment

Testing is as simple as loading your Newspage or Widget(s) on your site and seeing it function. Be careful to test feedback and reactions reporting if such features are enabled on your project.
Was this article helpful?
Cancel
Thank you!