koakh/app.html

## app.html
<template>
  <h1>${message}</h1>
  <pre>data:[${data}]</pre>
  <ul>
    <!--
    <li repeat.for="user of users">
      ${user.login}
    </li>
    -->
  </ul>
</template>

## app.js
import {inject} from 'aurelia-framework';
import {HttpClient} from 'aurelia-fetch-client';

@inject(HttpClient)
export class App {
  message = 'Hello World!';
  users = null;
  data = null;
  httpClient;

  constructor(httpClient) {
    this.httpClient = httpClient;
    //config();
    //fetch();

    this.httpClient.configure(config => {
      config
        .withBaseUrl('https://koakh.com:8084/api/')
        //.withBaseUrl('http://localhost:5005/api/')
        .withDefaults({
          credentials: 'same-origin',
          headers: {
            'Accept': 'application/json',
            'X-Requested-With': 'Fetch'
          },
          mode: 'no-cors'
        })
        .withInterceptor({
          request(request) {
            console.log(`Requesting ${request.method} ${request.url}`);
            let authHeader = 'Bearer AUTH_TOKEN';
            request.headers.append('Authorization', authHeader);
            return request;
          },
          response(response) {
            console.log(`Received ${response.status} ${response.url}`);
            return response;
          }
        });
    }).fetch('AlertRule/3b8e0052-7c59-48dd-8b75-e71fa1c72690')
      .then(response => response.json())
      .then(data => {
          //this.users = users
          this.data = data;
        })
      .catch(error => {
        this.data = error;
      });
  }

  config() {
    this.httpClient.configure(config => {
      config
        .withBaseUrl('http://koakh.com:8084/api/')
        .withDefaults({
          credentials: 'same-origin',
          headers: {
            'Accept': 'application/json',
            'X-Requested-With': 'Fetch'
          }
        })
        .withInterceptor({
          request(request) {
            console.log(`Requesting ${request.method} ${request.url}`);
            return request;
          },
          response(response) {
            console.log(`Received ${response.status} ${response.url}`);
            return response;
          }
        });
    });
  }

  fetch() {
    this.httpClient.fetch('users')
      .then(response => response.json())
      .then(data => {
          //this.users = users
          this.data = data;
        })
      .catch(error => {
        this.data = error;
      });
  }
}

## index.html
<!doctype html>
<html>
  <head>
    <title>Aurelia</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
  </head>
  <body aurelia-app>
    <h1>Loading...</h1>

    <script src="https://jdanyow.github.io/rjs-bundle/node_modules/requirejs/require.js"></script>
    <script src="https://jdanyow.github.io/rjs-bundle/config.js"></script>
    <script>
      require.config({
        paths: {
          "aurelia-fetch-client": "https://jdanyow.github.io/rjs-bundle/node_modules/aurelia-fetch-client/dist/amd/aurelia-fetch-client"
        }
      })
    </script>
    <script src="https://jdanyow.github.io/rjs-bundle/bundles/aurelia.js"></script>
    <script src="https://jdanyow.github.io/rjs-bundle/bundles/babel.js"></script>
    <script>
      require(['aurelia-bootstrapper']);
    </script>
  </body>
</html>
	<template>
	<h1>${message}</h1>
	<pre>data:[${data}]</pre>
	<ul>
	<!--
	<li repeat.for="user of users">
	${user.login}
	</li>
	-->
	</ul>
	</template>
	import {inject} from 'aurelia-framework';
	import {HttpClient} from 'aurelia-fetch-client';

	@inject(HttpClient)
	export class App {
	message = 'Hello World!';
	users = null;
	data = null;
	httpClient;

	constructor(httpClient) {
	this.httpClient = httpClient;
	//config();
	//fetch();

	this.httpClient.configure(config => {
	config
	.withBaseUrl('https://koakh.com:8084/api/')
	//.withBaseUrl('http://localhost:5005/api/')
	.withDefaults({
	credentials: 'same-origin',
	headers: {
	'Accept': 'application/json',
	'X-Requested-With': 'Fetch'
	},
	mode: 'no-cors'
	})
	.withInterceptor({
	request(request) {
	console.log(`Requesting ${request.method} ${request.url}`);
	let authHeader = 'Bearer AUTH_TOKEN';
	request.headers.append('Authorization', authHeader);
	return request;
	},
	response(response) {
	console.log(`Received ${response.status} ${response.url}`);
	return response;
	}
	});
	}).fetch('AlertRule/3b8e0052-7c59-48dd-8b75-e71fa1c72690')
	.then(response => response.json())
	.then(data => {
	//this.users = users
	this.data = data;
	})
	.catch(error => {
	this.data = error;
	});
	}

	config() {
	this.httpClient.configure(config => {
	config
	.withBaseUrl('http://koakh.com:8084/api/')
	.withDefaults({
	credentials: 'same-origin',
	headers: {
	'Accept': 'application/json',
	'X-Requested-With': 'Fetch'
	}
	})
	.withInterceptor({
	request(request) {
	console.log(`Requesting ${request.method} ${request.url}`);
	return request;
	},
	response(response) {
	console.log(`Received ${response.status} ${response.url}`);
	return response;
	}
	});
	});
	}

	fetch() {
	this.httpClient.fetch('users')
	.then(response => response.json())
	.then(data => {
	//this.users = users
	this.data = data;
	})
	.catch(error => {
	this.data = error;
	});
	}
	}
	<!doctype html>
	<html>
	<head>
	<title>Aurelia</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	</head>
	<body aurelia-app>
	<h1>Loading...</h1>

	<script src="https://jdanyow.github.io/rjs-bundle/node_modules/requirejs/require.js"></script>
	<script src="https://jdanyow.github.io/rjs-bundle/config.js"></script>
	<script>
	require.config({
	paths: {
	"aurelia-fetch-client": "https://jdanyow.github.io/rjs-bundle/node_modules/aurelia-fetch-client/dist/amd/aurelia-fetch-client"
	}
	})
	</script>
	<script src="https://jdanyow.github.io/rjs-bundle/bundles/aurelia.js"></script>
	<script src="https://jdanyow.github.io/rjs-bundle/bundles/babel.js"></script>
	<script>
	require(['aurelia-bootstrapper']);
	</script>
	</body>
	</html>