non absolute urls for reverse proxy

use dynamic hostname in samples

pom.xml

@@ -8,9 +8,6 @@
     <version>1.0-SNAPSHOT</version>
     <name>transceivr</name>
     <packaging>jar</packaging>
-    <properties>
-        <undertow.version>2.0.19.Final</undertow.version>
-    </properties>
     <build>
         <plugins>
             <plugin>
@@ -80,9 +77,7 @@
                     </archive>
                 </configuration>
             </plugin>
-
         </plugins>
-
     </build>
     <dependencies>
         <dependency>
@@ -109,7 +104,7 @@
         <dependency>
             <groupId>org.slf4j</groupId>
             <artifactId>slf4j-api</artifactId>
-            <version>1.7.25</version>
+            <version>1.7.26</version>
         </dependency>
         <!-- https://mvnrepository.com/artifact/ch.qos.logback/logback-classic -->
         <dependency>

src/main/resources/webroot/index.html

@@ -5,6 +5,7 @@
         width: 100%;
         background-color: #ddd;
     }
+
     #myBar {
         width: 1%;
         height: 30px;
@@ -54,8 +55,10 @@
                 </td>
             </tr>
             <tr>
-    <td><button @click="cancel(item.id)">cancel</button>
-    </td><td>
+                <td>
+                    <button @click="cancel(item.id)">cancel</button>
+                </td>
+                <td>
 <pre>id: {{ item.id}}
 from: {{ item.from}}
 to: {{ item.to}}
@@ -67,8 +70,8 @@ downloadDone: {{ item.downloadDone}}
 finished: {{ item.finished}}
 finishedAT: {{ item.finishedAT}}
 </pre>
-</td>
-<td><pre>rate: {{ item.rate}}k/s
+                </td>
+                <td><pre>rate: {{ item.rate}}k/s
 toMethod: {{ item.toMethod}}
 uploadError: {{ item.uploadError}}
 uploadCode: {{ item.uploadCode}}
@@ -78,10 +81,11 @@ cpeeCallbackResult: {{ item.cpeeCallbackResult}}
 cpeeCallbackCode: {{ item.cpeeCallbackCode}}
 cpeeCallbackMessage: {{ item.cpeeCallbackMessage}}
 cpeeCallbackError: {{ item.cpeeCallbackError}}
-</pre></td>
-</tr>
-</template>
-</table>
+</pre>
+                </td>
+            </tr>
+        </template>
+    </table>
 </div>
 
 <script type="application/javascript">
@@ -102,26 +106,32 @@ cpeeCallbackError: {{ item.cpeeCallbackError}}
         },
         watch: {},
         methods: {
+            baseURL: function () {
+                let url = document.location.protocol + "//" + document.location.hostname + document.location.pathname;
+                if (url.endsWith('/'))
+                    url = url.slice(0, -1);
+                return url;
+            },
             example1: function () {
-                this.$data.from='http://localhost:8082/zero?length=1000000';
-                this.$data.to='http://localhost:8082/null';
-                this.$data.type='xfer';
-                this.$data.toMethod='POST';
-                this.$data.toMime='application/octet-stream';
+                this.$data.from = this.baseURL() + '/zero?length=1000000';
+                this.$data.to = this.baseURL() + '/null';
+                this.$data.type = 'xfer';
+                this.$data.toMethod = 'POST';
+                this.$data.toMime = 'application/octet-stream';
             },
             example2: function () {
-                this.$data.from='http://ftp.debian.org/debian/ls-lR.gz';
-                this.$data.to='http://localhost:8082/null';
-                this.$data.type='xfer';
-                this.$data.toMethod='POST';
-                this.$data.toMime='application/octet-stream';
+                this.$data.from = 'http://ftp.debian.org/debian/ls-lR.gz';
+                this.$data.to = this.baseURL() + '/null';
+                this.$data.type = 'xfer';
+                this.$data.toMethod = 'POST';
+                this.$data.toMime = 'application/octet-stream';
             },
             example3: function () {
-                this.$data.body='[{}]';
-                this.$data.to='http://localhost:8082/null';
-                this.$data.toMethod='POST';
-                this.$data.type='send';
-                this.$data.toMime='application/json';
+                this.$data.body = '[{}]';
+                this.$data.to = this.baseURL() + '/null';
+                this.$data.toMethod = 'POST';
+                this.$data.type = 'send';
+                this.$data.toMime = 'application/json';
             },
             send: function (ts) {
                 let data = new URLSearchParams();
@@ -130,31 +140,31 @@ cpeeCallbackError: {{ item.cpeeCallbackError}}
                 data.append('toMethod', this.toMethod);
                 data.append('body', this.body);
                 data.append('toMime', this.toMime);
-                ep=this.$data.type;
-                fetch('/' + ep, {
+                ep = this.$data.type;
+                fetch(ep, {
                     method: "POST",
                     body: data
                 }).then(response => {
                     console.log(response);
                 })
-                .catch(error => {
-                    this.$data.log = [];
-                    console.log(error)
-                });
+                    .catch(error => {
+                        this.$data.log = [];
+                        console.log(error)
+                    });
             },
             cancel: function (id) {
                 let data = new URLSearchParams();
                 data.append('id', id);
-                fetch('/cancel', {
+                fetch('cancel', {
                     method: "POST",
                     body: data
                 }).then(response => {
                     console.log(response);
                 })
-                .catch(error => {
-                    this.$data.log = [];
-                    console.log(error)
-                });
+                    .catch(error => {
+                        this.$data.log = [];
+                        console.log(error)
+                    });
             },
             ts2txt: function (ts) {
                 return moment(ts).format('YYYY-MM-DD hh:mm ss.SSS ')
@@ -164,7 +174,7 @@ cpeeCallbackError: {{ item.cpeeCallbackError}}
                 return response;
             },
             update: function (event) {
-                fetch('/status', {method: "GET"})
+                fetch('status', {method: "GET"})
                     .then(this.handleErrors)
                     .then(response => {
                         return response.json();