direct-agent v1.6.5

direct-agent

HTTP requests for React or Vite React with an internal useEffect, with a time interval for repeating the request integrated. Also having the option to use it without useEffect or for single calls.

Install

npm:

npm install direct-agent

pnpm:

pnpm install direct-agent

Version 1.2.5

• Fixed memory leaks
• Ajusted tutorial for non useEffect with intervals
• Adjusted tutorial for creating default route
• Added internal interval for non useEffect
• Added option to clear interval (if needed)

Supported frameworks

• React (Vanilla | Full Support)
• React (Vite | Full Support)
• NodeJS (Omit Array to not use useEffect)

Usage

• Credentials are always enabled if a Header is not set (More information in the Headers section).
• Currently, it only supports GET and POST http requests.

import { useState } from 'react'
import pulse from 'direct-agent'

function Home() {

  const [result, setResult] = useState('Loading...')

  pulse.get('/route', data => {
    if (data.status == 200) setResult(data.body)
    if (data.status == 404) console.log('NOT FOUND')
  }, [])

  pulse.post('/route', { id: id }, data => {
    if (data.status == 200) setResult(data.body)
    if (data.status == 404) console.log('NOT FOUND')
  }, [])

  return <span>{result}</span>

}

Use route without env file

• If 'http / https' is detected in the route, the default route in the env file will not be used.

  pulse.get('http://localhost/route', data => {
      if (data.status == 200) setResult(data.body)
      if (data.status == 404) console.log('NOT FOUND')
  }, [])

Add default route

• To add a default route, you should create a .env file with the following content.

• React REACT_APP_API_URL=http(s)://route

• React with Vite VITE_API_URL=http(s)://route

Intervals with useEffect

• The array ([]) must always be present if you want the behavior of a useEffect.
• The parameter after the dependencies is the interval time until it triggers again.
• The parameter after the interval is whether it should trigger on startup or not.
• If useEffect is not used, the dependencies can act as the interval, and the interval can act as an immediate trigger.
• If you're not going to clear the interval you can call only data function, but it will on component dismount.

  pulse.post('/route', { id: id }, (data, clear) => {
    if (data.status == 200) setResult(data.body)
    if (data.status == 404) console.log('NOT FOUND')
    if (data.status == 500) clear() // clear self interval - if not declared, it will be auto on dismount

  }, [], 5000, true)

Intervals without useEffect

• Omitting the array ([]) means not using useEffect.
• You need to manually clear with clear function it when it's done to not have a memory leak.
• If you're not going to clear the interval (be careful), you can call only data function.

  pulse.post('/route', { id: id }, (data, clear) => {

    if (data.status == 200) {

      clear() // clear self interval
      console.log(data.body)

    } else if (data.status == 409) {

      clear() // clear self interval
      console.log('CONFLICT')

    }

  }, 5000, true)

Clearing intervals

• If you are using useEffect behavior, you don't need to clear it if you don't need, it will be cleared on dismount.
• If you are not using useEffect behavior, pay attention and be careful to always clear intervals that already did what sould do.

  pulse.post('/route', { id: id }, (data, clear) => {

    if (data.status == 200) {
      console.log("oh, it's already done")
      clear() // clear self interval
    }

  }, 5000, true)

Add one or multiple headers to the request

• If the first parameter is an array, it will act as multiple headers.
• If there are multiple headers, the second parameter will be the option to toggle withCredentials.
• By default, when using headers, credentials are disabled, you need to set it to true manually.

  pulse.post('/route', { id: id }, data => {
    if (data.status == 200) setResultado(data.body)
    if (data.status == 404) console.log('NOT FOUND')
  }, []).set('Authorization', `Bearer ${token}`)

  pulse.post('/route', { id: id }, data => {
    if (data.status == 200) setResultado(data.body)
    if (data.status == 404) console.log('NOT FOUND')
  }, []).set('Authorization', `Bearer ${token}`, true)

  All usages:

 .set('Authorization', `Bearer ${token}`) - Credentials are disabled by default.
 .set({'Authorization': `Bearer ${token}`}) - Multiple headers and credentials are disabled.
 .set('Authorization', `Bearer ${token}`, true) - Credentials enabled manually.
 .set({'Authorization': `Bearer ${token}`}, true) - Multiple headers and credentials enabled manually.

All possible imports

import pulse from 'direct-agent'
import { get, post } from 'direct-agent'