What steps are involved in creating a local unleash client for feature flagging?

Currently attempting to implement a feature flag for a Typescript project using code from the Unleash Client. Here is where I am creating and connecting to an instance of unleash with a local unleash setup as outlined in this documentation: Unleash GitHub Repository. Despite confirming that the unleash instance is running locally within a docker container as directed, I seem to be encountering a connection error. The service appears to be up and running when accessed through my browser. Can anyone shed light on why I am receiving the following error message upon connection attempt?

Snippet of CODE:

import express from 'express';
import { Unleash } from 'unleash-client';

const unleash = new Unleash({
  url: 'http://localhost:4242/api/',
  appName: 'default',
  customHeaders: { Authorization: 'default:development.unleash-insecure-api-token' },
});

Error LOG:

FetchError: Unleash Repository error: request to http://localhost:4242/api/client/features failed, reason: connect ECONNREFUSED 127.0.0.1:4242
app-local-backend                  | [1]     at ClientRequest.<anonymous> (/app/node_modules/minipass-fetch/lib/index.js:130:14)
app-local-backend                  | [1]     at ClientRequest.emit (node:events:517:28)
app-local-backend                  | [1]     at Socket.socketErrorListener (node:_http_client:501:9)
app-local-backend                  | [1]     at Socket.emit (node:events:517:28)
app-local-backend                  | [1]     at emitErrorNT (node:internal/streams/destroy:151:8)
app-local-backend                  | [1]     at emitErrorCloseNT (node:internal/streams/destroy:116:3)
app-local-backend                  | [1]     at process.processTicksAndRejections (node:internal/process/task_queues:82:21) {
app-local-backend                  | [1]   code: 'ECONNREFUSED',
app-local-backend                  | [1]   errno: 'ECONNREFUSED',
app-local-backend                  | [1]   syscall: 'connect',
app-local-backend                  | [1]   address: '127.0.0.1',
app-local-backend                  | [1]   port: 4242,
app-local-backend                  | [1]   type: 'system'
app-local-backend                  | [1] }

Oddly enough, I have the ability to access the endpoint using Postman following the provided documentation image below:

https://i.sstatic.net/uG2LN.png

Any guidance or assistance regarding this matter would be highly appreciated!

typescriptfeature-flagsunleash

Answer №1

I attempted to replicate the issue, but unfortunately, I was not successful. From what I can see, your code appears to be accurate.

Could it be that you are executing your application in isolation, perhaps within a distinct Docker container, causing it to be unable to connect to localhost:4242 on your machine?

If you are able to access Unleash at localhost:4242 using your browser and Postman, my recommendation would be to begin by creating a new local project just to test if that resolves the issue. You could try something along these lines:

import { initialize } from 'unleash-client'

const TOGGLE = 'unleash-node-test'

const unleash = initialize({
  url: 'http://localhost:4242/api',
  appName: 'unleash-node-test',
  customHeaders: {
    Authorization:
      'default:development.unleash-insecure-api-token'
  }
})

const checkToggles = () => {
  const enabled = unleash.isEnabled(TOGGLE)
  const variant = unleash.getVariant(TOGGLE)
  console.log(TOGGLE)
  console.log('isEnabled', enabled)
  console.log('getVariant', variant)
  setInterval(checkToggles, 5000)
}

unleash.on('ready', checkToggles)

If this method proves successful, you may need to investigate any unique aspects of the environment where your other application is operating and make adjustments accordingly.

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

Are you struggling with perplexing TypeScript error messages caused by a hyphen in the package name?

After creating a JavaScript/TypeScript library, my goal is for it to function as: A global variable when called from either JavaScript or TypeScript Accessible via RequireJS when called from either JavaScript or TypeScript Complete unit test coverage Th ...

javascripttypescriptnpmumd

Exploring the depths of complex objects with the inclusion of optional parameters

I've been working on a custom object mapping function, but I've encountered an issue. I'm trying to preserve optional parameters as well. export declare type DeepMap<Values, T> = { [K in keyof Values]: Values[K] extends an ...

typescript

In Typescript, it mandates that a string value must be one of the values within the object

There is a constant declaration mentioned below: export const Actions = { VIEW: 'view', EDIT: 'edit', }; Imagine there's a function like this: // Ensuring that the action variable below is always a string with value either ...

typescript

Is it possible to pass a Styled Components Theme as Props to a Material UI element?

After spending 9 hours scouring the internet for a solution, I am at my wit's end as nothing seems to work. Currently, I am developing a React component using TypeScript. The issue lies with a simple use of the Material UI Accordion: const Accordion ...

reactjstypescriptmaterial-uiaccordionstyled-components

In Angular 7, where can the controller be found within its MVC architecture implementation?

From what I understand, Angular adheres to the MVC architecture. In the components, there is a .ts file which serves as the model and a .html file for the view, but my question is: where is the controller located? ...

javascriptnode.jsangulartypescriptsingle-page-application

How to troubleshoot the issue of "Error: (SystemJS) module is not defined" in Angular 2?

I am a beginner in the world of Angular2. It is known that in Angular2, there is a way to reference a file using a relative path by defining moduleId : module.id in the component meta data. However, I have tried doing it this way and keep encountering the ...

angulartypescript

Pattern matching for validating multiple email addresses

I need assistance with validating multiple email inputs using regex in Angular. I am looking to enforce a specific format for the emails, such as: Examples: *****@zigurat.com *****@test.com *****@partlastic.com The ***** can be any characters, but the ...

angularregextypescript

Looping through each combination of elements in a Map

I have a Map containing Shape objects with unique IDs assigned as keys. My goal is to loop through every pair of Shapes in the Map, ensuring that each pair is only processed once. While I am aware of options like forEach or for..of for looping, I'm s ...

javascriptarraystypescriptobject

TypeScript function object argument must be typed appropriately

In the code, there is a function that I am working with: setTouched({ ...touched, [name]: true }); . This function accepts an object as a parameter. The 'name' property within this object is dynamic and can be anything like 'email', &ap ...

reactjstypescript

Select one of 2 parameters and begin typing

I recently encountered a situation where I needed to define a type with an id field (string) and an oldId field (number), but I wanted these fields to be exclusive. For example: { id: "1234", name: "foo" } { oldId: 1234, name: "b ...

typescript

Webpack may suggest, "An extra loader might be needed" within a React.js project

I recently created a React project with two separate workspaces, named 'webmail' and 'component'. In the 'component' workspace, I added a small tsx file that I wanted to utilize in the 'webmail' workspace. Below is t ...

reactjstypescriptwebpackbabeljs

Using TypeScript to eliminate duplicate values when constructing an array with various properties

Recently, I received an array from an API that has the following structure: results = [ {name: 'Ana', country: 'US', language: 'EN'}, {name: 'Paul', country: 'UK', language: 'EN'}, {name: & ...

arraysangulartypescript

What is the best way to transfer props between components using typescript?

I have a unique button component that I need to include in another component. The button type and interface I am using are as follows: type IButton = { className?: string, onClick?: MouseEventHandler; children: React.ReactNode; props: IButt ...

reactjstypescript

Input a new function

Trying to properly type this incoming function prop in a React Hook Component. Currently, I have just used any which is not ideal as I am still learning TypeScript: const FeaturedCompanies = (findFeaturedCompanies: any) => { ... } This is the plain fun ...

javascriptreactjstypescript

Establish a connection between MongoDB and the built-in API in Next.js

I've been working on integrating a MongoDB database with the Next.js built-in API by using the code snippet below, which I found online. /api/blogs/[slug].ts import type { NextApiRequest, NextApiResponse } from 'next' import { connectToData ...

typescriptmongodbnext.js

Is it possible to showcase a unique date for every item that gets added to a list?

I am new to using React, so please bear with me. I want to be able to show the date and time of each item that I add to my list (showing when it was added). I am struggling to get this functionality working with my current code. Any help or explanation o ...

reactjstypescriptreact-hooks

Setting up pagination in Angular Material can sometimes present challenges

After implementing pagination and following the guidelines provided here. This is my code from the app.component.ts file - import { Component, OnInit, ViewChild } from '@angular/core'; import {MatPaginator} from '@angular/material/paginat ...

angulartypescriptangular-material

React TypeScript: The properties of 'X' are not compatible. 'Y' cannot be assigned to 'Z' type

I am currently working on a React-TypeScript application, specifically creating a component for inputting credit card numbers. My goal is to have the FontAwesome icon inside the input update to reflect the brand image as the user enters their credit card n ...

reactjstypescriptfont-awesome

Typescript: Securing Data with the Crypto Module

I am currently working on encrypting a password using the built-in crypto module. Previously, I used createCipher which is now deprecated. I am wondering if there is still an effective way to achieve this. Here is the old code snippet: hashPassword(pass: ...

javascripttypescriptcryptojs

Generate a fresh class instance in Typescript by using an existing class instance as the base

If I have these two classes: class MyTypeOne { constructor( public one = '', public two = '') {} } class MyTypeTwo extends MyTypeOne { constructor( one = '', two = '', public three ...

typescript