APM Modern Customization - modify Header in user-common.js and form in user-logon.js
Hi! I try to customize the modern logon pages and as I have multiple pages so I want to modify the header section in the user-common.js and the single logon pages in the user-logon.js files. I somehow cannot make it work, currently only the header from user-common.js gets rendered but not the user-logon.js. It seems to me that they interfere with each other the way that I try to do that. user-common.js: define(['require', 'exports', 'tslib', 'module', 'apmui/page/logon/View'], function ( require, exports, tslib_1, module, View_1 ) { 'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); requirejs.config({ map: { 'apmui/master/View': { 'apmui/page/logon/View': module.id, }, }, }); /* Replacement View component */ var CustomLogonView = /** @class */ (function (_super) { tslib_1.__extends(CustomLogonView, _super); function CustomLogonView() { return (_super !== null && _super.apply(this, arguments)) || this; } CustomLogonView.prototype.componentDidMount = function () { _super.prototype.componentDidMount.call(this); var header = document.getElementsByClassName('apmui-header')[0]; header.classList.add( 'header', 'sticky', 'top-0', 'left-0', 'z-10', 'w-full', 'box-border', 'flex', 'items-center', 'justify-center', 'text-sm', 'border-b', 'border-b-gray-300', 'dark:border-b-neutral-700' ); header.innerHTML = '<div class="flex flex-col w-full max-w-7xl p-4 gap-4 justify-between"><div class="flex flex-col w-full gap-2 overflow-hidden"><div class="flex flex-row w-full gap-8 select-none"><a class="h-14 pointer-events-none flex flex-shrink-0 place-items-center gap-4 p-8 lg:pointer-events-auto lg:p-0" href="/"><img alt="" loading="lazy" width="185" height="56" decoding="async" data-nimg="1" src="images/logo.svg" style="color: transparent;"></a><span class="flex flex-col flex-grow justify-center text-primary text-3xl font-semibold">PAGE HEADER</span></div></div></div>'; }; return CustomLogonView; })(View_1.default); exports.default = CustomLogonView; }); user-logon.js: define(['require', 'exports', 'tslib', 'module', 'apmui/page/logon/View'], function ( require, exports, tslib_1, module, View_1 ) { 'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); requirejs.config({ map: { 'apmui/master/View': { 'apmui/page/logon/View': module.id, }, }, }); /* Replacement View component */ var CustomLogonView = /** @class */ (function (_super) { tslib_1.__extends(CustomLogonView, _super); function CustomLogonView() { return (_super !== null && _super.apply(this, arguments)) || this; } CustomLogonView.prototype.componentDidMount = function () { _super.prototype.componentDidMount.call(this); var content = document.getElementsByClassName('apmui-content')[0]; var content = document.createElement('div'); content.style.cssText = 'max-width: 400px; width: 100%; padding-top: 20px;'; content.innerHTML = "<p>Please register <a href='/register.php'>here</a> if you don't have an account yet.</p>"; }; return CustomLogonView; })(View_1.default); exports.default = CustomLogonView; }); How can I then modify only the header (or footer) via the user-common.js and the logon page content via user-logon.js files? I'm thankful for any advice :) Greetings, Eric
customize logon page
Hi all - This post from 2014 is what I'm looking for an update for in v 11.5. Is there a way to customize the logon page? It's the same use case as the linked article. We have a general logon page and a subsequent challenge response page. Are there options to customize both logon pages? Think of something along the lines of replacing the out-of-the-boxo F5 pages with something like Google's initial and 2FA logon pages. We do not have a CMS to host the webpage on and are looking to host it locally on the F5. Not sure if this is technically possible but wanted to reach out to see if the F5 community could help. Thanks in advance!
Multiple Logon Pages (APM) Reset Customisation
We use a custom view for a logon page through a macro on an Access Policy. The custom view changes the logon page to have (1) a single field for entry and (2) a different link that does a loop within the macro (part of our one time password configuration). The problem is that I am trying to add an AD query after this to prompt the user if their password is due to expire. The AD query doesn't present as the normal logon view and configuration is altered by this custom logon page. In order to resolve my issue, I need to add a normal logon page before the AD query to allow the logon page to "reset". The issue with doing this though is that there is user intervention required for them to click on the Logon button. Is there a way to (1) auto click the logon button or (2) reset the logon page via an iRule for example?APM - Provide file at access policy logon page stored on the APM
Hello community, I have to add a download link (help file; .pdf format) to a custom logon page. I could of course place this file on a web server but I'd like to store the file directly on the APM. I've found something about "Hosted content" (http://support.f5.com/kb/en-us/products/big-ip_apm/manuals/product/apm-hosted-content-implementations-11-4-0/1.html) but I really don't know if this is what fits my need and second...we run 11.3 at the moment. Any idea would be appreciated. Best regards, h0nky
APM Policy - AD Auth Fallback
I have a policy that presents F5 generated Forms logon page. The policy is doing Active Directory authentication. When user enters invalid credentials, the policy does not seem to follow the 'Fallback' branch from the 'AD Auth' item, but rather updates the page with basic message, but remains on the logon page. Where is this logon retry configured at?
APM Logon Page Input Field
Is it possible to use the value of a custom session variable in "Logon Page Input Fields"? Instead of showing always the same text I need to show different texts in each session as we are using a grid card for sencond factor authentication and each time the system will ask for the value of two random cells.