Skip to main content

Resource override

F

For years I was stuck in an endless loop. Change the JavaScript file, upload to APEX, refresh the page, hope it works, repeat. There were few unofficial solutions developed in the past like APEX Builder Extension by FOS (I think it was a work of Stefan Dobre) or APEX Nitro utilizing Node.js.

Recently I was recently notified about the Chrome extension Resource Override.


To set this up you will need to do this 4 easy steps:

  • get this extention to your Chrome or Firefox browser
  • create a rule to override your (.js, .css or any kind of) file
  • create local server to serve your file
  • avoid file caching in APEX


First two points are covered on the project page above, just a note that syntax is "glob like" syntax. Basicaly it is similar to LIKE in SELECT, you just use "*" instead of "%". For example my rule for Oracle cloud server look like:

Tab URL: *.eu-frankfurt-1.oraclecloudapps.com*
From: *global.js*
To: http://localhost:8080/workspace_files/global.js

So every request of global.js file to the cloud server is replaced by the content in my localhost file (Documents/PROJECTS/CORE/apex/workspace_files/global.js). For this I use Python3 with integrated http server, I just go to the folder with the files I would like to use and start the server:

cd Documents/PROJECTS/CORE/apex
python3 -m http.server 8080

And to avoid file caching in APEX I use G_VERSION (application) item with a simple computation (Expression):

TO_CHAR(SYSDATE, 'YYYY-MM-DD-HH24-MI-SS')

In User Interface - JavaScript I reference the file postfixed with the G_VERSION item:


That's it. Now I can change my file in a favourite editor, refresh page in APEX and see the changes without the need to re-upload file every time.


Comments

  1. Great post! For those looking to streamline their JavaScript development even further, you might want to check out Requestly. It's a versatile tool that allows you to easily intercept and modify HTTP requests, making file overrides and testing a breeze.

    ReplyDelete

Post a Comment