NCS and URL Rewrite

Netcam Studio Problems & Bugs
,
1

I have NCS installed on a machine running IIS. The machine has a domain that can be accessed via the internet. I have successfully forwarded port 8100 on my router so that I can access NCS from the internet. However, this does not use https, and I want to use the URL Rewrite functionality of IIS to create a reverse proxy from my domain name to the NCS server.

Here are my steps to configure this in IIS:

  1. Install Application Request Routing
  2. Create an application called “ncs” under the Default web site
  3. Using URL Rewrite, create a set of rules to forward the requests and rewrite the responses

Here are the rules from the generated web.config files:

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <httpProtocol>
            <customHeaders>
                <remove name="X-Powered-By" />
            </customHeaders>
        </httpProtocol>
        <rewrite>
            <rules>
                <clear />
                <rule name="ReverseProxyInboundRuleNetcamStudio" stopProcessing="true">
                    <match url="ncs(/)?(.*)" />
                    <conditions logicalGrouping="MatchAll" trackAllCaptures="false" />
                    <action type="Rewrite" url="http://localhost:8100/{R:2}" />
                    <serverVariables>
                        <set name="HTTP_X_ORIGINAL_ACCEPT_ENCODING" value="{HTTP_ACCEPT_ENCODING}" />
                        <set name="HTTP_ACCEPT_ENCODING" value="" />
                    </serverVariables>
                </rule>
			</rules>
            <outboundRules>
                <rule name="ReverseProxyOutboundRuleNetcamStudio" preCondition="ResponseIsHtml1">
                    <match filterByTags="A, Form, Frame, IFrame, Img, Input, Link, Script" pattern="^http(s)?://localhost:8100/(.*)" />
                    <action type="Rewrite" value="http{R:1}://[my domain]/ncs/{R:2}" />
                </rule>
            </outboundRules>
        </rewrite>
    </system.webServer>
</configuration>

When I point my browser to https://[my domain]/ncs/ I get a blank page. When I view the source I see the following:

<!DOCTYPE html>
<html>
  <head>
    <base href="/"/>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Netcam Studio</title>
    <link rel="icon" type="image/x-icon" href="favicon.ico" />

    <!--</script>-->
    <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" charset="utf-8"></script> -->

    <!-- D3 and customized EventDrops -->
    <script src="./assets/lib/d3/d3.js"></script>
    <!--<script src="https://d3js.org/d3.v4.js"></script>-->
    <script src="./assets/lib/event-drops/dist/eventDrops.js"></script>

    <!-- Video.JS -->
    <link href="./assets/lib/video-js/video-js.min.css" rel="stylesheet" />
    <script src="./assets/lib/video-js/video.js"></script>

    <!-- Chart.JS -->
    <script src="./assets/lib/chart.js/dist/Chart.js"></script>
    <!--<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.3/Chart.bundle.min.js"></script>-->

    <!-- SoundManager 2 -->
    <script src="./assets/lib/soundmanager2/soundmanager2-nodebug-jsmin.js"></script>

    <!-- PrimeNG -->
    <!--
  <link rel="stylesheet" type="text/css" href="./lib/primeng/themes/omega/theme.css" />
  <link rel="stylesheet" type="text/css" href="./lib/primeng/primeng.min.css" />
  <link rel="stylesheet" type="text/css" href="./lib/font-awesome-4.7.0/css/font-awesome.css" />
  -->

    <!-- momentJS-->
    <script src="./assets/lib/moment-with-locales.min.js"></script>
  <link rel="stylesheet" href="styles.01ecddb3c489cc50e314.css"></head>
  <body>
    <app-root>
      <div class="loading"></div>
    </app-root>
  <script src="runtime-es2015.e8a2810b3b08d6a1b6aa.js" type="module"></script><script src="runtime-es5.e8a2810b3b08d6a1b6aa.js" nomodule defer></script><script src="polyfills-es5.1902a4db008bc3386943.js" nomodule defer></script><script src="polyfills-es2015.3c23419c5698e054ace2.js" type="module"></script><script src="main-es2015.87c5ee2239c550eb5fce.js" type="module"></script><script src="main-es5.87c5ee2239c550eb5fce.js" nomodule defer></script></body>
</html>

This means it should be working - but nothing is being displayed. I suspect the outbound rewrite isn’t quite correct, as it seems to be resolving the scripts to:

https://[my domain//assets/lib/moment-with-locales.min.js

Rather than

https://[my domain]/ncs/assets/lib/moment-with-locales.min.js

Does anyone have any ideas on how to resolve this?
Dean

2

Hi Dean,
You can setup NCS to use https, but that is maybe not what you are looking for?
-Henrik

3

That is what I am looking for. But it also should be fairly simple - as you can see, Netcam Studio is returning the values - it just appears to be going to mydomain/ rather than mydomain/ncs - which is frustrating.

4

If you config. NCS for https with certificate etc. and use https://mydomain:8100 it is not working?

5

That would work, but what I want to do is use a reverse proxy via IIS.

Is NCS written in Angular? It uses a base href="/" when browsing. This might be part of the issue.

6

Yes, web client is in Angular.

7

Thought so. Interesting. Everything I’ve done should work. I’ll go digging in some other forums.