How to read a value from properties file in a javascript file - javascript

I have a spring-boot project which serves angularjs. Both the front-end and back-end code are in the same project.
In my angularjs service.js files I am calling the back-end service.
I have different urls in the different properties file. I want to read them as per profile selection. I know how to read properties file in a Java class but I am not sure how to read values from properties file in a javascript file.
As shown below:

Some options:
create a separate config.json for your angular APP (manage it manually).
use maven resource plugin to filter placeholders for your config.json file (automated). E.g. read in one place and substitute in another (but I don't like this way).
Or create an API to return data from from your properties file as JSON.
https://docs.spring.io/spring-boot/docs/current/reference/html/boot-features-external-config.html

Related

Search through files in path using only javascript

I'm coding a webpage that needs to read some data from different csv on a path depending on the country of the user.
the path is something like this:
./csv/m2-2022-10-25_13_45_55_es.csv
m2-2022-10-25_13_45_56_fr.csv
m2-2022-10-25_13_46_04_it.csv
etc
And those files will be replaced regularly, the only that we'll always have is the country code (es, fr, it, etc).
So, what I need is to list all the files on the path to an array, and loop through the array to find if the last characters of the filename are $countryCode + ".csv", and there run some code.
But I can't find how, all the solutions I find are using Node.js, but are there a solution using only Javascript (or jQuery)?
Regards!
You cannot use pure Javascript to do that, because if you wanted to search files in your computer only using javascript, it would be a huge security breach.
You must use node.js to open files but you can make an API to your nodejs file from your javascript and you can send as a response the content of your file.
Here some links that might help you :
FS : https://nodejs.org/api/fs.html
NodeJS api : https://medium.com/swlh/how-to-create-a-simple-restful-api-in-node-js-ae4bfddea158
You can check a similar question here:
Get list of filenames in folder with Javascript
You can't access to filesystem from the frontend, this it would be a huge security breach, because anyone could access to your filesystem tree.
You have to do a function in backend to build the array you want and send it to frontend.
If you create a function in backend file that returns the array of files in the folder, you can call it from the frontend via XMLHttpRequest or Fetch to get the array in frontend and be able to use in your js file.

How to update zip file with XML content

Overview
I am using JSZip which allows you to create and update zip files using JavaScript. I would like to update some of the contents of the zip file with other files. However the examples in the documentation only show how to use strings.
In my situation I have an XML file and I want to overwrite another XML file within the Zip file. According to the documentation the file() method supports multiple types:
file(name, data [,options])
String/ArrayBuffer/Uint8Array/Buffer/Blob/Promise/Nodejs stream
Question
I have access to my zip file and my XML file is local as it will be built pro-grammatically. How can I go about using this method to overwrite files with XML files. I also expect the need to overwrite images as well but I also didn't see examples of this either.
Documentation - https://stuk.github.io/jszip/
If I do an import of the XML:
import testXML from '../testXML';
This will not work as when I console log this, I get:
static/media/testXML.dd632dc5.xml
Note: I am using React for the frontend if this matters.

React JS - Reading environment configurations from external property file

Problem :
I am new to React JS, and looking for an option to read environment configs from an external property file. This problem is more specific for one of my clients, who is looking to have an option to change the environment files dynamically. E.g. change the hostname/port dynamically whenever there is a change. The build process is not owned by my client. I create a minified final package, which my client deploys it on tomcat/web server.
Tried Solution :
With some read-outs, I have configured .env files for different environments and able to successfully read configs from these files. However, these are more of a build process environment files. And, I am trying to find a way to read the configs from an external source after my package is created.
Possible solutions : Here is one possible approach I can think of -
Read external property file using libraries like "properties-reader". I will provide the property file as part of my release bundle (i.e. build folder). My client can change this property file whenever required.
Please suggest if this is the correct approach or is there a better solution to this problem?
A Solution which worked for me !!
1) Create a "config.js" file inside public folder of react project. Sample Content of the
"config.js" file -
window.env = {
API_DOMAIN_ADDR: "http://localhost:8080"
};
2) Refer "config.js" file inside index.html. Code for index.html will be -
<body>
<div id="root"></div>
<script src="%PUBLIC_URL%/config.js"></script>
</body>
3) Now, content of the config.js file will be accessible to react code. Sample code to retrieve the value of config.js variables -
window.env.API_DOMAIN_ADDR
Add this code wherever variable value needs to be accessed. I added this in my service class which is making ajax call.
I would suggest using something like Firebase Realtime DB. I had a similar requirement for pointing the App builds to production or development server APIs for my company. For this, we use to load a Firebase Config and from there the UI used to pick up the host server endpoint.
Advantages:
This saves you from deploying your build folder every time.
This is realtime and less prone to errors.
FirebaseDB is free for small stuff like this.
The second option is to create two environment files which I see you have already done.

How to configure settings in Django when realative reference of static files don't contain a 'static'?

I'm a newbee to html/js/css.
Now I have a big frontend that use realative reference of static files that don't contain a 'static' prefix.
However Django need a STATIC_URL definition in settings.py, default is "/static/".
Then the real request url is "/demo/faces/male/16.jpg", but the url django expected is "/static/demo/faces/male/16.jpg"
It's really a big frontend maintained by other guys, I don't want to modify it.
Is there a method to remove the 'static' requirement?
See this. It says "In addition to using a static/ directory inside your apps, you can define a list of directories (STATICFILES_DIRS) in your settings file where Django will also look for static files."
The example that they give puts static in the specification of the additional directory, but that appears to be inessential. So you would just list your /demo/faces/male and /demo/faces/female/ directories.

How to read & write in a properties file with javascript

I'm working in a JEE web project and i have a problem, i would like to read and write into a properties file which is located into WebContent/WEB-INF/classes folder and i need to do this with javascript, do you have an idea how to do that ?
Assuming you mean JavaScript on the client: Create an endpoint that the JavaScript code can post to via ajax, and have servlet code handle the post by updating the properties file.

Categories

Resources