Trying to optimize the initial fetch calls when loading.

This commit is contained in:
Scott Idem
2025-01-28 18:12:01 -05:00
parent a9c96c905a
commit acff856e25
3 changed files with 304 additions and 67 deletions

View File

@@ -46,6 +46,12 @@ import {
db_update_ae_obj_id__hosted_file
} from "$lib/ae_core/core__hosted_files";
import {
add_url_params,
clean_headers,
} from "$lib/ae_core/core__api_helpers";
let ae_promises: key_val = {}; // Promise<any>;
@@ -412,6 +418,8 @@ let export_obj = {
delete_ae_obj_id__hosted_file: delete_ae_obj_id__hosted_file,
db_save_ae_obj_li__hosted_file: db_save_ae_obj_li__hosted_file,
db_update_ae_obj_id__hosted_file: db_update_ae_obj_id__hosted_file,
add_url_params: add_url_params,
clean_headers: clean_headers,
handle_load_ae_obj_id__site_domain: handle_load_ae_obj_id__site_domain,
handle_load_ae_obj_code__data_store: handle_load_ae_obj_code__data_store,
load_ae_obj_id__activity_log: load_ae_obj_id__activity_log,

View File

@@ -0,0 +1,70 @@
import type { key_val } from '$lib/ae_stores';
// Updated 2025-01-28
export function add_url_params(
{
base_url = '',
endpoint,
params,
log_lvl = 0
}: {
base_url?: string,
endpoint: string,
params: key_val,
log_lvl?: number
}
) {
if (log_lvl) {
// console.log(`*** add_url_params() ***`);
console.log(`*** add_url_params() *** base_url=${base_url} endpoint=${endpoint}`, params);
}
const url_obj = new URL(endpoint, base_url);
Object.keys(params).forEach(key => url_obj.searchParams.append(key, params[key]));
if (log_lvl) {
console.log('New URL:', url_obj.toString());
}
return url_obj.toString();
// return 'test';
}
// This is used to clean the header property names. Not underscores allowed in the header names.
// Updated 2025-01-28
export function clean_headers(
{
headers,
log_lvl = 0
}: {
headers: any,
log_lvl?: number
}
) {
if (log_lvl) {
console.log(`*** clean_headers() ***`);
}
let headers_cleaned: key_val = {};
for (const prop in headers) {
let prop_cleaned = prop.replaceAll('_', '-');
if (typeof headers[prop] != 'string') {
headers[prop] = JSON.stringify(headers[prop]);
}
headers_cleaned[prop_cleaned] = headers[prop];
if (log_lvl > 1) {
console.log(`${prop_cleaned}: ${headers_cleaned[prop_cleaned]}`);
}
}
// Object.keys(headers).forEach(key => {
// if (headers[key]) {
// headers_cleaned[key] = headers[key];
// }
// });
return headers_cleaned;
}

View File

@@ -9,6 +9,7 @@ import { core_func } from '$lib/ae_core/ae_core_functions';
import type { key_val } from '$lib/ae_stores';
import { PUBLIC_AE_API_PROTOCOL, PUBLIC_AE_API_SERVER, PUBLIC_AE_API_BAK_SERVER, PUBLIC_AE_API_PORT, PUBLIC_AE_API_PATH, PUBLIC_AE_API_SECRET_KEY, PUBLIC_AE_API_CRUD_SUPER_KEY, PUBLIC_AE_NO_ACCOUNT_ID, PUBLIC_AE_NO_ACCOUNT_ID_TOKEN } from '$env/static/public';
const api_base_url = `${PUBLIC_AE_API_PROTOCOL}://${PUBLIC_AE_API_SERVER}:${PUBLIC_AE_API_PORT}${PUBLIC_AE_API_PATH}`;
const api_base_url_bak = `${PUBLIC_AE_API_PROTOCOL}://${PUBLIC_AE_API_BAK_SERVER}:${PUBLIC_AE_API_PORT}${PUBLIC_AE_API_PATH}`;
@@ -56,7 +57,7 @@ let ae_loc_init: key_val = {
// properties: params, route, url
// functions: fetch, setHeaders, parent, depends, untrack
export async function load({ fetch, params, parent, route, url }) { // params, route, url
let log_lvl: number = 1;
let log_lvl: number = 2;
// console.log(`Svelte root +layout.ts params:`, params);
// console.log(`Svelte root +layout.ts route:`, route);
// console.log(`Svelte root +layout.ts url:`, url);
@@ -132,89 +133,247 @@ export async function load({ fetch, params, parent, route, url }) { // params, r
// ae_loc.site_domain = data.url.origin;
// console.log(`ae_loc = `, ae_loc);
account_id = await core_func.handle_load_ae_obj_id__site_domain({
api_cfg: ae_api_init,
// fqdn: 'idaa.localhost:5173', // url.host,
fqdn: url.host,
try_cache: false,
let fqdn = url.host;
let api_endpoint = `/crud/site/domain/${fqdn}`;
let api_params: any = {
'use_alt_table': true,
'use_alt_base': true,
};
// const api_url = new URL(api_endpoint, ae_api_init['base_url']);
// Object.keys(api_params).forEach(key => api_url.searchParams.append(key, api_params[key]));
// let api_url_str = api_url.toString();
const api_url_str = core_func.add_url_params({
base_url: ae_api_init['base_url'],
endpoint: api_endpoint,
params: api_params,
log_lvl: log_lvl
});
let headers: any = {
'x-no-account-id': 'Nothing to See Here',
}
headers = core_func.clean_headers({
headers: headers,
log_lvl: log_lvl
})
.then(function (site_domain_results) {
if (site_domain_results) {
// console.log(`ae_ site_domain_results = `, site_domain_results);
});
data_struct.account_id = site_domain_results.account_id_random;
// Clean the headers
// let headers_cleaned: key_val = {};
// for (const prop in headers) {
// let prop_cleaned = prop.replaceAll('_', '-');
// if (typeof headers[prop] != 'string') {
// headers[prop] = JSON.stringify(headers[prop]);
// }
// headers_cleaned[prop_cleaned] = headers[prop];
// if (log_lvl > 1) {
// console.log(`${prop_cleaned}: ${headers_cleaned[prop_cleaned]}`);
// }
// }
// headers = headers_cleaned;
// if (log_lvl > 1) {
// console.log('All headers cleaned:', headers);
// }
ae_acct.account_id = site_domain_results.account_id_random;
const fetchOptions: RequestInit = {
method: 'GET',
headers: {
...ae_api_init['headers'],
...headers
},
// signal: controller.signal
};
ae_api_init['account_id'] = site_domain_results.account_id_random;
ae_api_init['headers']['x-account-id'] = site_domain_results.account_id_random;
ae_api_init['headers']['x-no-account-id'] = null;
let result = await fetch(api_url_str, fetchOptions)
.then(async function (response) {
if (response.ok) {
let json_raw = await response.json();
console.log(`ALERT json_raw = `, json_raw);
ae_loc_init['account_id'] = site_domain_results.account_id_random;
ae_loc_init['account_code'] = site_domain_results.account_code; // Useful for export file naming
ae_loc_init['account_name'] = site_domain_results.account_name; // Generally useful for display
let json_data: any = null;
ae_loc_init['site_id'] = site_domain_results.site_id_random;
ae_loc_init['site_domain_id'] = site_domain_results.site_domain_id_random;
ae_loc_init['site_enable'] = site_domain_results.enable;
ae_loc_init['site_header_image_path'] = site_domain_results.header_image_path;
ae_loc_init['site_style_href'] = site_domain_results.style_href;
ae_loc_init['site_google_tracking_id'] = site_domain_results.google_tracking_id;
ae_loc_init['site_access_code_kv'] = site_domain_results.access_code_kv_json;
ae_loc_init['site_cfg_json'] = site_domain_results.cfg_json;
ae_loc_init['site_access_key'] = site_domain_results.access_key; // This is the general site access key
ae_loc_init['site_domain_access_key'] = site_domain_results.site_domain_access_key; // This is specific to a (sub)domain.
if (json_raw.data) {
if (!ae_loc_init['site_access_key'] && !ae_loc_init['site_domain_access_key']) {
ae_loc_init['key_checked'] = true; // Se to true to allow access without a key.
ae_loc_init['allow_access'] = true; // No access key is required here.
} else {
let access_key = url.searchParams.get('key');
json_data = json_raw.data;
account_id = json_data.account_id_random;
data_struct.account_id = json_data.account_id_random;
ae_acct.account_id = json_data.account_id_random;
if (access_key) {
if (log_lvl) {
console.log(`root +layout.ts: access_key = ${access_key}`);
}
if (access_key == ae_loc_init['site_access_key']) {
ae_loc_init['key_checked'] = ae_loc_init['site_access_key'];
ae_loc_init['allow_access'] = ae_loc_init['site_access_key'];
} else if (access_key == ae_loc_init['site_domain_access_key']) {
ae_loc_init['key_checked'] = ae_loc_init['site_domain_access_key'];
ae_loc_init['allow_access'] = ae_loc_init['site_domain_access_key'];
} else {
// The key changed and no longer matches the site or domain key.
ae_loc_init['key_checked'] = true;
ae_loc_init['allow_access'] = false;
}
ae_api_init['account_id'] = json_data.account_id_random;
ae_api_init['headers']['x-account-id'] = json_data.account_id_random;
ae_api_init['headers']['x-no-account-id'] = null;
ae_loc_init['account_id'] = json_data.account_id_random;
ae_loc_init['account_code'] = json_data.account_code; // Useful for export file naming
ae_loc_init['account_name'] = json_data.account_name; // Generally useful for display
ae_loc_init['site_id'] = json_data.site_id_random;
ae_loc_init['site_domain_id'] = json_data.site_domain_id_random;
ae_loc_init['site_enable'] = json_data.enable;
ae_loc_init['site_header_image_path'] = json_data.header_image_path;
ae_loc_init['site_style_href'] = json_data.style_href;
ae_loc_init['site_google_tracking_id'] = json_data.google_tracking_id;
ae_loc_init['site_access_code_kv'] = json_data.access_code_kv_json;
ae_loc_init['site_cfg_json'] = json_data.cfg_json;
ae_loc_init['site_access_key'] = json_data.access_key; // This is the general site access key
ae_loc_init['site_domain_access_key'] = json_data.site_domain_access_key; // This is specific to a (sub)domain.
if (!ae_loc_init['site_access_key'] && !ae_loc_init['site_domain_access_key']) {
ae_loc_init['key_checked'] = true; // Se to true to allow access without a key.
ae_loc_init['allow_access'] = true; // No access key is required here.
} else {
if (log_lvl > 1) {
console.log(`root +layout.ts: No access key found in URL.`);
let access_key = url.searchParams.get('key');
if (access_key) {
if (log_lvl) {
console.log(`root +layout.ts: access_key = ${access_key}`);
}
if (access_key == ae_loc_init['site_access_key']) {
ae_loc_init['key_checked'] = ae_loc_init['site_access_key'];
ae_loc_init['allow_access'] = ae_loc_init['site_access_key'];
} else if (access_key == ae_loc_init['site_domain_access_key']) {
ae_loc_init['key_checked'] = ae_loc_init['site_domain_access_key'];
ae_loc_init['allow_access'] = ae_loc_init['site_domain_access_key'];
} else {
// The key changed and no longer matches the site or domain key.
ae_loc_init['key_checked'] = true;
ae_loc_init['allow_access'] = false;
}
} else {
if (log_lvl > 1) {
console.log(`root +layout.ts: No access key found in URL.`);
}
ae_loc_init['key_checked'] = true;
// Do nothing to change the allow_access here
// ae_loc_init['allow_access'] = false; // An access key is required at this point.
}
ae_loc_init['key_checked'] = true;
// Do nothing to change the allow_access here
// ae_loc_init['allow_access'] = false; // An access key is required at this point.
}
} else {
console.log('API GET Object *fetch* response was missing the JSON "data" part.');
error(500, {
message: 'Site lookup failed!'
});
}
if (log_lvl > 1) {
console.log(`root +layout.ts: Returning account_id = `, site_domain_results.account_id_random);
console.log(`root +layout.ts: ae_loc_init = `, ae_loc_init);
}
return site_domain_results.account_id_random;
return json_data; // || json_raw;
} else {
console.log('API GET Object *fetch* request was no ok.');
error(500, {
message: 'Site lookup failed!'
});
}
console.log(`root +layout.ts: Site domain results not found!!! URL = `, url);
return null; // For no results
})
.catch(function (error) {
console.log(`root +layout.ts: Site domain lookup error = `, error);
// error(500, {
// message: 'Site lookup failed!'
// });
return false; // For a likely API or DB connection error
console.log('API GET Object *fetch* request was aborted or failed in an unexpected way.', error);
error(500, {
message: 'Site lookup failed!'
});
});
console.log(`ALERT response = `, result);
if (log_lvl > 1) {
console.log(`root +layout.ts: Using account_id = `, account_id);
console.log(`root +layout.ts: ae_loc_init = `, ae_loc_init);
}
log_lvl = 1;
// if (response.ok) {
// let json_val = await response.json();
// console.log(`ALERT json_val = `, json_val);
// let json_data = json_val.data;
// }
// error(500, {
// message: 'Site lookup failed!'
// });
// account_id = await core_func.handle_load_ae_obj_id__site_domain({
// api_cfg: ae_api_init,
// // fqdn: 'idaa.localhost:5173', // url.host,
// fqdn: url.host,
// try_cache: false,
// log_lvl: log_lvl
// })
// .then(function (site_domain_results) {
// if (site_domain_results) {
// // console.log(`ae_ site_domain_results = `, site_domain_results);
// data_struct.account_id = site_domain_results.account_id_random;
// ae_acct.account_id = site_domain_results.account_id_random;
// ae_api_init['account_id'] = site_domain_results.account_id_random;
// ae_api_init['headers']['x-account-id'] = site_domain_results.account_id_random;
// ae_api_init['headers']['x-no-account-id'] = null;
// ae_loc_init['account_id'] = site_domain_results.account_id_random;
// ae_loc_init['account_code'] = site_domain_results.account_code; // Useful for export file naming
// ae_loc_init['account_name'] = site_domain_results.account_name; // Generally useful for display
// ae_loc_init['site_id'] = site_domain_results.site_id_random;
// ae_loc_init['site_domain_id'] = site_domain_results.site_domain_id_random;
// ae_loc_init['site_enable'] = site_domain_results.enable;
// ae_loc_init['site_header_image_path'] = site_domain_results.header_image_path;
// ae_loc_init['site_style_href'] = site_domain_results.style_href;
// ae_loc_init['site_google_tracking_id'] = site_domain_results.google_tracking_id;
// ae_loc_init['site_access_code_kv'] = site_domain_results.access_code_kv_json;
// ae_loc_init['site_cfg_json'] = site_domain_results.cfg_json;
// ae_loc_init['site_access_key'] = site_domain_results.access_key; // This is the general site access key
// ae_loc_init['site_domain_access_key'] = site_domain_results.site_domain_access_key; // This is specific to a (sub)domain.
// if (!ae_loc_init['site_access_key'] && !ae_loc_init['site_domain_access_key']) {
// ae_loc_init['key_checked'] = true; // Se to true to allow access without a key.
// ae_loc_init['allow_access'] = true; // No access key is required here.
// } else {
// let access_key = url.searchParams.get('key');
// if (access_key) {
// if (log_lvl) {
// console.log(`root +layout.ts: access_key = ${access_key}`);
// }
// if (access_key == ae_loc_init['site_access_key']) {
// ae_loc_init['key_checked'] = ae_loc_init['site_access_key'];
// ae_loc_init['allow_access'] = ae_loc_init['site_access_key'];
// } else if (access_key == ae_loc_init['site_domain_access_key']) {
// ae_loc_init['key_checked'] = ae_loc_init['site_domain_access_key'];
// ae_loc_init['allow_access'] = ae_loc_init['site_domain_access_key'];
// } else {
// // The key changed and no longer matches the site or domain key.
// ae_loc_init['key_checked'] = true;
// ae_loc_init['allow_access'] = false;
// }
// } else {
// if (log_lvl > 1) {
// console.log(`root +layout.ts: No access key found in URL.`);
// }
// ae_loc_init['key_checked'] = true;
// // Do nothing to change the allow_access here
// // ae_loc_init['allow_access'] = false; // An access key is required at this point.
// }
// }
// if (log_lvl > 1) {
// console.log(`root +layout.ts: Returning account_id = `, site_domain_results.account_id_random);
// console.log(`root +layout.ts: ae_loc_init = `, ae_loc_init);
// }
// return site_domain_results.account_id_random;
// }
// console.log(`root +layout.ts: Site domain results not found!!! URL = `, url);
// return null; // For no results
// })
// .catch(function (error) {
// console.log(`root +layout.ts: Site domain lookup error = `, error);
// // error(500, {
// // message: 'Site lookup failed!'
// // });
// return false; // For a likely API or DB connection error
// });
if (await account_id === null) {