Skip to content

web: support HTTPS reverse proxy for API calls #3432

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
LJspice wants to merge 2 commits into
base: main
Choose a base branch
from
Open

web: support HTTPS reverse proxy for API calls #3432

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
40a7832
web: support HTTPS reverse proxy for API calls
LJspice Jun 21, 2026
35df65b
web: support HTTPS reverse proxy for API on non-standard port
LJspice Jun 27, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
33 changes: 24 additions & 9 deletions src/web/web-service/frontend/res/js/app.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -287,7 +287,7 @@
console.log(response);
$scope.res = response.data.result;
if (response.data.result == 'successful') {
var image = "http://api.qrserver.com/v1/create-qr-code/?color=000000&bgcolor=FFFFFF&data=v%3D1%26%26eui%3D" + response.data.eui64 +"%26%26cc%3D" + $scope.thread.pskd +"&qzone=1&margin=0&size=400x400&ecc=L";
var image = "https://api.qrserver.com/v1/create-qr-code/?color=000000&bgcolor=FFFFFF&data=v%3D1%26%26eui%3D" + response.data.eui64 +"%26%26cc%3D" + $scope.thread.pskd +"&qzone=1&margin=0&size=400x400&ecc=L";
$scope.showQRCode(event, image);
} else {
$scope.showQRAlert(event, "sorry, can not generate the QR code.");
Expand Down Expand Up @@ -440,7 +440,22 @@

$scope.restServerPort = '8081';
var formatRestAddr = function(host, port) {
return (host.indexOf(':') > -1) ? '[' + host + ']:' + port : host + ':' + port;
// Remove existing IPv6 brackets if present
var normalizedHost = host.replace(/^\[(.*)\]$/, '$1');

var formattedHost = (normalizedHost.indexOf(':') > -1) ? '[' + normalizedHost + ']' : normalizedHost;

// When using HTTPS, assume reverse proxy places web UI and API on same port
if (window.location.protocol === 'https:') {
Comment thread
LJspice marked this conversation as resolved.
// If the target API host is the same as the Web UI host
if (normalizedHost === window.location.hostname.replace(/^\[(.*)\]$/, '$1')) {
// Use the web UI full host string (including non-standard port if present)
return window.location.host;
}
// Otherwise, assume the proxy handles the port translation for the external host
return formattedHost;
}
return formattedHost + ':' + port;
};
$scope.ipAddr = formatRestAddr(window.location.hostname, $scope.restServerPort);

Expand Down Expand Up @@ -505,7 +520,7 @@
$scope.dataInit = async function() {
let response;

$http.get('http://' + $scope.ipAddr + '/api/node', {
$http.get(window.location.protocol + '//' + $scope.ipAddr + '/api/node', {
headers: {
'Accept': 'application/json'
}
Expand Down Expand Up @@ -609,7 +624,7 @@
// GET request to check action status
$scope.getActionStatus = async function(action_id) {

const response = await $http.get('http://' + $scope.ipAddr + '/api/actions/' + action_id, {
const response = await $http.get(window.location.protocol + '//' + $scope.ipAddr + '/api/actions/' + action_id, {
headers: {
'Accept': 'application/vnd.api+json'
}
Expand All @@ -628,7 +643,7 @@
console.log("discover network ..."); // Debugging log message
do {
// start discovery task
const postResponse = await $http.post('http://' + $scope.ipAddr + '/api/actions', $scope.createRequestBodyUpdateDeviceCollection(deviceCount), {
const postResponse = await $http.post(window.location.protocol + '//' + $scope.ipAddr + '/api/actions', $scope.createRequestBodyUpdateDeviceCollection(deviceCount), {
headers: {
'Content-Type': 'application/vnd.api+json',
'Accept': 'application/vnd.api+json'
Expand Down Expand Up @@ -670,7 +685,7 @@

// GET device collection
$scope.fetchDevices = async function () {
const response = await $http.get('http://' + $scope.ipAddr + '/api/devices', {
const response = await $http.get(window.location.protocol + '//' + $scope.ipAddr + '/api/devices', {
headers: {
'Accept': 'application/json'
}
Expand All @@ -689,7 +704,7 @@

do {
// Fetch device diagnostics
const postResponse = await $http.post('http://' + $scope.ipAddr + '/api/actions', $scope.createRequestBody(device_id), {
const postResponse = await $http.post(window.location.protocol + '//' + $scope.ipAddr + '/api/actions', $scope.createRequestBody(device_id), {
headers: {
'Content-Type': 'application/vnd.api+json',
'Accept': 'application/vnd.api+json'
Expand Down Expand Up @@ -785,15 +800,15 @@
const devices = await $scope.fetchDevices();

// Delete diagnostics entries
await $http.delete('http://' + $scope.ipAddr + '/api/diagnostics').then(function(response) {
await $http.delete(window.location.protocol + '//' + $scope.ipAddr + '/api/diagnostics').then(function(response) {
console.log(`Deleted diagnostics status ${response.status}`);
});

// Loop over each device and fetch diagnostics
await $scope.fetchDiagnosticsForDevices(devices);

// Fetch the list of device diagnostics
const getResponse = await $http.get('http://' + $scope.ipAddr + '/api/diagnostics', {
const getResponse = await $http.get(window.location.protocol + '//' + $scope.ipAddr + '/api/diagnostics', {
headers: {
'Accept': 'application/json'
}
Expand Down