Edit the rest API in the JSON file without the need for redeployment

I have successfully implemented a call to an API from a JSON file, and it is working fine. However, I am facing a problem where I need to change the path of the API in the JSON file without having to redeploy the application. I have tried to do this but it doesn't seem to work. Is there a way to implement this?

assets/config/config.json

{
"urls":{
  "apiBaseUrl": "https://demored.ddns.net:59443",
  "path": "/demored/api"
 }
}

assets/config/config.ts

const config = require("./config.json");
export const URLS = Object({

  "apiBaseUrl": config.urls.apiBaseUrl,
  "path": config.urls.path
})

environment.prod.ts

import { URLS } from '../assets/api-url/config';
export const environment = {
  production: true,
  
  apiBaseUrl: URLS.apiBaseUrl,
  path: URLS.path,
};

Answer №1

It is definitely possible and it appears that you are heading in the right direction. By having your API url separated out into config.json, you have the ability to modify the API url without the need to redeploy or rebuild your project as long as you are correctly loading the JSON file. A helpful solution can be found here,

Is it achievable to update the root APIURL in angular 8 without rebuilding the project using environment settings in CLI

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

javascript Issue with styling when creating new elements

Today, I created a new function: function zoom(obj){ var img = (!document.getElementById(obj))?false:document.getElementById(obj); var fullImage = (img.getAttribute("image") == null)?false:img.getAttribute("image"); if ...

Transitioning from using a jQuery get request to utilizing Vue.js

Looking to transition from JQuery-based js to Vue as a newcomer to JavaScript. Seeking guidance on making a get request and displaying the retrieved data. What approach would you recommend for this task? Here's the HTML snippet: <div> <di ...

Convert radio input and label into a clickable URL text

Apologies for my lack of experience. I am simply trying to wrap my head around something. <span class="button"> <input type="radio" id="button-2" name="button-group-1"> <label onclick="changeButton('2');" f ...

Jackson: breaking down the nested array structure

I am currently working on parsing an array of arrays in my code. Here is what I have so far: package android.app; import android.support.annotation.Nullable; import com.fasterxml.jackson.annotation.JsonCreator; import com.fasterxml.jackson.core.JsonPars ...

Angular: Compilation of SCSS/SASS results in unexpected whitespace issues

I am encountering an issue with whitespace being added to the CSS after compiling a *.scss file in my Angular 7 project. This unwanted whitespace is causing incorrect results in the UI. To replicate the problem, you can visit... ...and copy and paste the ...

Generating a vibrant list with the help of JSON and the power of jquery

JSON file { "subject": "title", "level": [ { "title":"Test1", "sub":[{ "title":"Test1 sub_1", "links":[{ "title":"Test1sub1.1link_title", "address":"linkAddress" },{ "title":"Test1sub1.2_link_title", "address":"linkAddress" ...

Requesting information from a model using a JavaScript variable in a cshtml file in an ASP.NET application

Is there a way to use a JavaScript variable to retrieve a specific item from an array stored in a model? Below is a code snippet: function CreateCategoryList() { var limit = @(Model.CategoriesCount.ToString()); for (i=0; i<limit; ...

How come event handlers/listeners don't seem to work for elements I create using jQuery?

I'm currently working on improving my jQuery skills by creating a simple to-do list. I've run into an issue where event handlers aren't activating for elements I create in jQuery, but they work just fine for elements I've created in my ...

Adding a file filter in Kendo v2016 is a simple process that can greatly enhance

I'm exploring how to implement a file filter in Kendo.Mvc.UI.FileUpload. I've come across some examples online that utilize a method called 'select', but it seems that the current version of Kendo I'm using doesn't have this m ...

The issue with zone.js remains unresolved

Since updating to the most recent version of Angular cli, I have encountered an error when trying to run ng serve: ./node_modules/@angular-devkit/build-angular/src/webpack/es5-polyfills.js:106:0-37 - Error: Module not found: Error: Can't resolve &apo ...

What is the best method for transferring JSON between two Node servers for optimal efficiency?

I am at an intermediate level in node.js and I need to transfer JSON data from one independent server to another independent server. The size of the JSON data can range from 200 bytes to 50 kilobytes, with up to 500 requests per second. Initially, I was u ...

Unable to deserialize the current JSON.Net array in C#

As a programming novice, I still have a lot to learn and would appreciate some guidance! Despite reading through similar posts discussing the same error, I am struggling to find a solution. The error message that I encountered states: Newtonsoft.Json.Js ...

Sveltejs template not displaying on M1 MacBook Air after running - stuck on blank screen

Currently, I am in the process of learning Sveltejs and have been utilizing for the tutorial, which has been quite effective. However, I decided to work on developing and testing Sveltejs applications locally on my MacBook Air M1. I downloaded the provid ...

Is there a way to make images load only when the navigation buttons are clicked in a scrollable (jquery tools) rather than loading all images at once?

I came across this great demo tutorial that I'm currently following: The issue with the tutorial is that it loads all the images at once, which significantly impacts performance. My goal is to have it load a set of images each time you click the arro ...

Encoding a string in JSON that contains the "#" symbol along with other special characters

The client side javascript code I have is as follows: <html> <script type="text/javascript" src="js/jquery.min.js"></script> <script> $(document).ready(function() { //var parameters = "a=" + JSON.stringify( ...

Extract intricate nested data from the server

I am faced with the challenge of parsing and displaying data from the server in a UIPicker view. The complexity of the data makes it difficult for me to parse and present it correctly in the UIPickerView. Can someone guide me on the most efficient way to p ...

Updating checkboxes in Vue.js

I'm struggling a bit with VueJS states. Here is the setup for my simple app: new Vue({ el: '#media-app', data: { activeTypes: [], activeCategories: [], medias: [] }, methods: { getFilteredDat ...

Demonstrating the Parent-Child relationship in Angular with .NET 6

I'm currently working on displaying a Client along with their list of contracts using Angular 13 and .NET 6. Here is the model I have in my WebApi: namespace CompanyApi.Models { public partial class Societaire { public Societaire() ...

error message: when running `prisma generate`, the installed package `@tsed/prisma` cannot be located

Attempting to integrate Ts.Ed v7.35 with prisma v5.2 by following this official tutorial. Upon running npm install, encountered an error during npx prisma generate: Environment variables loaded from .env Prisma schema loaded from prisma/schema.prisma Erro ...

Are there any methods available to adjust the size of a View component in react-native?

My react-native application includes a View that contains several components. The layout displays perfectly on iPhone 6 and 5 models, but on an iPhone 4s, the bottom of one component is being clipped slightly. I'm aware of scaling base64 icons, but I ...