Category: javascript

I’m getting an error when trying to initialize WebGLRenderer:
(I removed some unnecessary lines)

import * as THREE from "https://cdn.skypack.dev/[email protected]/build/three.module.js";
import { OrbitControls } from "https://cdn.skypack.dev/[email protected]/examples/jsm/controls/OrbitControls.js";
import { GLTFLoader } from "https://cdn.skypack.dev/[email protected]/examples/jsm/loaders/GLTFLoader.js";


async function load() {
    // THREE JS
    window.scene = new THREE.Scene();
    window.camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);

    // Loader
    window.loader = new GLTFLoader();
    window.loader.load(
        "/assets/shotgun/scene.gltf",
        function (gltf) {
            const model = gltf.scene;
            scene.add(model);
            window.shotgun = model;
        },
        function (xhr) {
            console.log((xhr.loaded / xhr.total) * 100 + "% loaded");
        },
        function (error) {
            console.error(error);
        }
    );

    // Renderer   Getting error here
    window.renderer = THREE.WebGLRenderer({
        canvas: document.getElementById("shotgun"),
        antialias: true,
        alpha: true
    });
    renderer.setSize(window.innerWidth, window.innerHeight);
    renderer.setPixelRatio(window.devicePixelRatio);
    camera.position.set( 10, 0, 0 );

    // Light
    var light = new THREE.PointLight(0xffffff);
    light.position.set(-5, 10, 10);
    scene.add(light);

    // Help
    window.ctrl = new OrbitControls(camera, renderer.domElement);
    scene.add(new THREE.PointLightHelper(light), new THREE.GridHelper(200, 50));

}

load().then(() => {
    document.getElementById("loading").animate({ opacity: 0 }, { fill: "forwards", duration: 1000 });
    render();
});

DevTools say that error occurs in this line:

function WebGLRenderer(parameters) {
  parameters = parameters || {};
  const _canvas2 = parameters.canvas !== void 0 ? parameters.canvas : createCanvasElement() // ...
  let currentRenderList = null;
  let currentRenderState = null;
  const renderListStack = [];
  const renderStateStack = [];
  this.domElement = _canvas2; // <----
  this.debug = {
    checkShaderErrors: true
  };
  this.autoClear = true;
  this.autoClearColor = true;
  this.autoClearDepth = true;
  ...
}

Also, how can I pause code execution while the model is loading? (Without putting it into loader’s function)

“It looks like your post is mostly code; please add some more details.“
Like what else can I add?

If I switch too fast in 5 seconds on mobile chrome, useEffect will not fetch data from openWeatherAPI.
But wait it for 5 second and reswitch page, it is ok to fetch and display.

My weather app by Next.js app route deploy on vercel has two pages “/”, “/week”.
I use getPosition() get lat and lon, fetchApi() get weather data, and <Link> to switch pages.

homePage(“/”)

"use client";

import { fetchApi } from "@/api/fetchApi";
import InfoBox from "@/components/InfoBox";
import RainChart from "@/components/RainChart";
import TempChart from "@/components/TempChart";
import { getPosition } from "@/utils/getPosition";
import { unixToDate } from "@/utils/unixToDate";
import { unixToTime } from "@/utils/unixToTime";
import { useEffect, useState } from "react";

export default function Home() {
  const [date, setDate] = useState<string>("");
  const [time, setTime] = useState<string>("");
  const [desc, setDesc] = useState<string>("");
  const [feel, setFeel] = useState<number>(0);
  const [hourFeel, setHourFeel] = useState<number[]>([]);
  const [hourRain, setHourRain] = useState<number[]>([]);

  useEffect(() => {
    getPosition()
      .then((position) => {
        fetchApi(position.coords.latitude, position.coords.longitude, "metric")
          .then((data: any) => {
            setTime(unixToTime(data.current.dt));
            setDate(unixToDate(data.current.dt));
            setDesc(data.current.weather[0].description);
            setFeel(Math.round(data.current.feels_like));

            const hourFeelData: number[] = [];
            const hourRainData: number[] = [];

            for (let i = 0; i < 24; i++) {
              hourFeelData.push(Math.round(data.hourly[i].feels_like));
              setHourFeel(hourFeelData);

              hourRainData.push(Math.round(data.hourly[i].pop * 100));
              setHourRain(hourRainData);
            }
          })
          .catch((err) => {
            console.error(err);
          });
      })
      .catch((err) => {
        console.log(err);
      });
  }, []);

  return (
    <main>
      <div className="mt-5 flex justify-evenly">
        <InfoBox date={date} time={time} content={desc} />
        <InfoBox label="現在體感" content={`${feel}℃`} />
      </div>
      <TempChart data={hourFeel} />
      <RainChart data={hourRain} />
    </main>
  );
}

weekPage(“/week”)

"use client";

import { fetchApi } from "@/api/fetchApi";
import { getPosition } from "@/utils/getPosition";
import { unixToDate } from "@/utils/unixToDate";
import { useEffect, useState } from "react";
import DaysDetails from "@/components/DaysDetails";

const WeekPage = () => {
  const loop = [];
  for (let i = 0; i < 8; i++) {
    loop.push(i);
  }

  const [date, setDate] = useState<string[]>(["", "", "", "", "", "", "", ""]);
  const [desc, setDesc] = useState<string[]>(["", "", "", "", "", "", "", ""]);
  const [dayFeel, setDayFeel] = useState<number[]>([0, 0, 0, 0, 0, 0, 0, 0]);
  const [eveFeel, setEveFeel] = useState<number[]>([0, 0, 0, 0, 0, 0, 0, 0]);
  const [rain, setRain] = useState<number[]>([0, 0, 0, 0, 0, 0, 0, 0]);

  useEffect(() => {
    getPosition()
      .then((position) => {
        fetchApi(position.coords.latitude, position.coords.longitude, "metric")
          .then((data: any) => {
            const dateData: string[] = [];
            const descData: string[] = [];
            const rainData: number[] = [];
            const eveFeelData: number[] = [];
            const dayFeelData: number[] = [];

            for (let i = 0; i < 8; i++) {
              dateData.push(unixToDate(data.daily[i].dt));
              setDate(dateData);

              descData.push(data.daily[i].weather[0].description);
              setDesc(descData);

              dayFeelData.push(Math.round(data.daily[i].feels_like.day));
              setDayFeel(dayFeelData);

              eveFeelData.push(Math.round(data.daily[i].feels_like.eve));
              setEveFeel(eveFeelData);

              rainData.push(Math.round(data.daily[i].pop * 100));
              setRain(rainData);
            }
          })
          .catch((err) => {
            console.error(err);
          });
      })
      .catch((err) => {
        console.log(err);
      });
  }, []);

  return (
    <div className="flex h-[43.75rem] flex-col items-center justify-evenly">
      {loop.map((i) => (
        <DaysDetails
          key={i}
          date={date[i]}
          desc={desc[i]}
          rain={`${rain[i]}%`}
          dayFeel={`${dayFeel[i]}℃`}
          eveFeel={`${eveFeel[i]}℃`}
        />
      ))}
    </div>
  );
};

export default WeekPage;

pageSwitch in Layout

"use client";

import Link from "next/link";
import { useState } from "react";

const PageSwitcher: React.FC = () => {
  const [page, setPage] = useState("now");

  return (
    <div className="flex justify-center">
      <Link
        href="/"
        onClick={() => setPage("now")}
        className={`flex h-14 w-[11.5rem] items-center justify-center ${page === "now" ? "bg-slate-300" : "bg-inherit"}`}
      >
        NOW
      </Link>
      <Link
        href="/week"
        onClick={() => setPage("7days")}
        className={`flex h-14 w-[11.5rem] items-center justify-center ${page === "7days" ? "bg-slate-300" : "bg-inherit"}`}
      >
        7 DAYS
      </Link>
    </div>
  );
};

export default PageSwitcher;

I think the problem is useEffect dependencies([]), maybe <Link> to page not means the initial render?

I try to link my phone to desktop with USB debug to see real mobile chrome devTool Network page.

mobile devTool-Network page

And compare with desktop devTool-Network page.

desktop devTool-Network page

I just hope it normally fetch data on android like desktop.
Please give me some advice, thanks!

I need to dynamically set the font size of the <span> element relative to the 10% height of the div.

HTML:

<div>
  <span>Example text</span>
</div>

CSS:

div {
  height: 20vh;
  width: 100vh;
  background-color: #f0f0f0;
  position: relative;
}

I tried using vh, vmin, rem, em, % units with no luck.
Is there a way to achieve this with pure CSS? Without relying on JavaScript?

Please help me out. I am required to create a code using Ajax without PHP, JQeury or anything like that.
I can only make use of HTML, Bootstrap and Javascript. It should be a registrion form(name, surname,email,username and password).

I have looking at different videos and they all make use of IQuery or php or other servers.

I read information on bootstrap, HTML and Ajax, that I understood.
I watched different videos, they were helful. Problem is, they all make use of other servers such as PHP.
I am knew to programming hence I first had to watch vides and research.
I wanted explanations or a video that only uses Ajax, boostrap, HTML and Javastript. Thanks

I have a library https://splade.dev/docs/using-vue-libraries. I’m using the Splade table.
I have app.js:

import { Carousel, Slide, Pagination, Navigation } from 'vue3-carousel';

const el = document.getElementById("app");

const app = createApp({
    render: renderSpladeApp({ el }),
})
.use(SpladePlugin, {
    "max_keep_alive": 10,
    "transform_anchors": false,
    "progress_bar": true,
})
.component('Carousel', Carousel)
.component('CarouselSlide', Slide)
.component('CarouselCharts', Chart)
.component('CarouselPagination', Pagination)
.component('CarouselNavigation', Navigation)
.mount(el);

There are also test data in the controller:

$products = [
    [
        'id' => 1,
        'name' => 'T-shirt',
        'price' => 20.99,
        'description' => 'Simple T-shirt',
    ],
    [
        'id' => 2,
        'name' => 'Jeans',
        'price' => 39.99,
        'description' => 'Classic jeans',
    ], 
];

And I don’t know what to display in Blade.”

I tried adding this, but it doesn’t work:

<Carousel>
    @foreach($charts as $key => $chart)
        <CarouselSlide key="{{ $key }}">
            <CarouselCharts :chart-data="$chart" />
        </CarouselSlide>
    @endforeach

    <template #addons>
        <CarouselNavigation />
        <CarouselPagination />
    </template>
</Carousel>

I’m trying to use node-canvas npm package to generate an image from canvas.
But the texts(TITLE 1 and TITLE 2) are appearing below the image. I want the image to be a background spanning across the canvas size and then put the texts over the image.

Here is my code:

const { createCanvas, loadImage } = require("canvas");
const fs = require("fs");

// Dimensions for the image/canvas
const width = 848;
const height = 600;

// Instantiate the canvas object
const canvas = createCanvas(width, height);
const context = canvas.getContext("2d");

context.font = "bold 70pt 'PT Sans'";
context.textAlign = "center";
context.fillStyle = "#764abc";

context.fillText("TITLE 1", 600, 170);

context.font = "bold 100pt 'PT Sans'";
context.textAlign = "center";
context.fillStyle = "#764abc";

context.fillText("TITLE 2", 600, 270);

// Write the image to file
loadImage("./assets/jimp-cert-template.jpg").then((image) => {
  const pattern = context.createPattern(image, "no-repeat");
  context.fillStyle = pattern;
  context.fillRect(0, 0, width, height);
  const buffer = canvas.toBuffer("image/jpeg");
  fs.writeFileSync("./image.jpeg", buffer);
});

I’ve tried putting the loadImage function before drawing the texts in the canvas, but that also didn’t work. I want the image to be a background spanning across the canvas size and then put the texts over the image.

I’m currently experiencing buffering interruptions when seeking forward or backward in a video streamed using HLS.js with Cloudflare Stream. Despite configuring HLS.js with various optimizations, I’m still facing this issue, particularly during seek operations. My goal is to implement a smooth seeking feature without buffering interruptions.

HLS Configuration:

const hls = new Hls({
  startFragPrefetch: true,
  // abrMaxWithRealBitrate: true,
  // abrBandWidthUpFactor: 2,
  initialLiveManifestSize: 10,
  abrBandWidthFactor: 0.1,
  maxBufferLength: 120,
  maxFragLookUpTolerance: 0.05,
});

Description:

I’m using HLS.js to stream videos from Cloudflare Stream, and while the playback itself is generally smooth, I encounter buffering interruptions when seeking forward or backward in the video. These interruptions occur every 2-4 seconds after seeking, leading to a suboptimal viewing experience for users.

I’ve tried adjusting various HLS.js configurations, such as increasing the buffer length (maxBufferLength) and adjusting the Adaptive Bitrate (ABR) parameters (abrBandWidthFactor). However, these changes haven’t resolved the buffering issue during seek operations.

Objective:

My primary objective is to implement a smooth seeking feature that allows users to navigate through the video timeline without encountering buffering interruptions. I’m seeking advice or suggestions on how to achieve this using HLS.js and Cloudflare Stream, whether through configuration optimizations, code adjustments, or other techniques.

Request for Assistance:

• Are there any specific HLS.js configurations or optimizations that I should consider for implementing smooth seeking functionality?
• Are there any best practices or techniques for reducing buffering interruptions during seek operations in HLS video streams?
• Is there any additional information or context that I should provide to better diagnose and address this issue?

Before a form can be submitted to the server, it must await file uploads to finish and return their metadata. I imagine this is a common scenario for many apps.

The sendForm() function is this:

async function sendForm(){

  // The async function that is uploading files and must be awaited upon
  await fileUploader(); 

  // The FormBody is all the fields in the form. This should not run until fileUploader() has resolved.
  axios.post('/api/form', FormBody); 

}

The fileUploader() function takes the files and should await each one:
async function fileUploader() {

for (let i = 0; i < Form.Files.length; i++) {

    if (!Array.isArray(Form.Files[i])) {
        // If item in Form.Files is not an array then skip it.
        // This is because the first element of the array is the binary file and the second element is metadata     
        continue;
    }

    // Only add files to the upload queue if they are not already uploaded or currently being uploaded
    if (!Form.Files[i][1].IsUploaded && !Form.Files[i][1].IsUploading) {
        try {
            Form.Files[i][1].UploadPromise = uploadFile({
                File: File,
                FileIndex: i
            });

            await Form.Files[i][1].UploadPromise;

        } catch (error) {
            console.log(`error: ${error}`);
        }
    }
}

}

The uploadFile() function is just an axios patch to the server:

async function uploadFile({File, FileIndex}){

   FormBody.append("UploadFile", File);

   const Response = await axios.post('/api/form', FormBody);

   console.log(Response.data); // This provides metadata I need before sendForm() can post to the server

   // It adds the metadata to the second element of the array here.
  Form.Files[FileIndex][1].IsUploading = false;
  Form.Files[FileIndex][1].IsUploaded = true;
}

For some reason, when the user clicks to the submit the form, the sendForm() function is not awaiting for the fileUploader() to resolve. It instead skips and posts the form which causes errors.

Why is it not awaiting fileUploader() to finish? I even tried using Promise.all() after pushing all the promises in the function to an array first but it didn’t help.

I have a student report card application developed in Laravel
This report card is a competency-based education Report card
I’ve been trying to find a way whereby you can be able to fit content into the white spaces as shown in the image belowenter image description here

I have this code that creates h1 element in JS.
When I resize the window, I want to reset the properties from text gradient, and then add the gradient them when window is bigger than 800px. I am calling this function every time window resizes.

While this works perfectly in Chrome, in Safari the background property resets -webkit-background-clip = text to border-box, removing the gradient text effect. I see the whole box filled with gradient, and it is not clipped to the text.

Does anybody know how to fix this?
Thanks!

<body></body>
<script>
    let h1 = document.createElement("h1");
    h1.style.fontSize = "7rem";
    h1.style.fontFamily = "Arial";

    let t = document.createTextNode("Hello");
    h1.appendChild(t);
    document.body.appendChild(h1);

    const resize = () => {
        h1.style['-webkit-text-fill-color'] = '';
        h1.style.background = '';
        h1.style['-webkit-background-clip'] = 'text';

        if (window.innerWidth > 800) {
            h1.style['-webkit-text-fill-color'] = 'transparent';
            h1.style.background = "linear-gradient(to left, #3498db, #1abc9c)";
            h1.style['-webkit-background-clip'] = 'text';
        }
    }

    window.addEventListener("resize", resize);
</script>

I am using Mirth Connect to automate healthcare data processes, and part of my task involves sending a PDF file over HTTP. I receive the PDF as a base64 string, which I then convert into a file and send as part of an HTTP request. However, I keep receiving a 415 error code with the message that the PDF attachment file type is unsupported. Here is the error response I receive:

{
    "StatusCode": 415,
    "Message": "Unsupported tempFile8297956747860069271.pdf attachment file",
    "Success": false,
    "UserMessage": "The tempFile8297956747860069271.pdf attachment is unsupported, please select PDF files only.",
    "MemberValidation": null,
    "Error": []
}

I’ve checked that the base64 string represents a valid PDF file by converting it manually. I am unsure why the server does not recognize it as a valid PDF. Has anyone encountered this issue, or can anyone suggest what might be causing this error and how to resolve it?

    function base64ToBytes(base64String) {
        var decoder = java.util.Base64.getDecoder();
        return decoder.decode(base64String);
    }

    function writeBytesToFile(bytes) {

        var tempFile = java.io.File.createTempFile("tempFile",".pdf");
        var outputStream = new java.io.FileOutputStream(tempFile);
        outputStream.write(bytes);
        outputStream.close();

        return tempFile;
    }

    function postFileToUrl(file) {

        var url = "https://....";
        var username = $('USERNAME'); 
        var password = $('PASSWORD'); 

        var httpClient = new org.apache.commons.httpclient.HttpClient();
        var postMethod = new org.apache.commons.httpclient.methods.PostMethod(url);

       
        postMethod.setRequestHeader("Username", username);
        postMethod.setRequestHeader("Password", password);
    
        var filePart = new org.apache.commons.httpclient.methods.multipart.FilePart("file",file.getName(),file,"application/pdf","UTF-8");
    
        filePart.setContentType("application/pdf"); 
        var multipart = new org.apache.commons.httpclient.methods.multipart.MultipartRequestEntity([filePart],postMethod.getParams());

        postMethod.setRequestEntity(multipart);

        var responseCode = httpClient.executeMethod(postMethod);
        var responseBody = postMethod.getResponseBodyAsString();

        if (responseCode == 200) {
            logger.info("File uploaded successfully. Response: " + responseBody);
        } else {
            logger.error("Failed to upload file. Response: " + responseBody);
        }
        return responseBody;
    }

    var base64String = $('file');
    var bytes = base64ToBytes(base64String);
    var tempFile = writeBytesToFile(bytes);
    response = postFileToUrl(tempFile)
    tempFile.delete();

    return response;

Currently I can retrieve a HMAC-Secret and AES-key with a Python script by running an html fragment in a headless browser, parsing the browser page returned and obtaining said secret and key.

The html fragment is this:

<head>
    <script src="https://player.akamaized.net/html5player/core/html5-c5-player.js"></script>
    <script>
        fetch("https://player.akamaized.net/html5player/core/html5-c5-player.js")
            .then((r) => r.text())
            .then((b) => {
                const dfnm = /x72x65x74x75x72x6ex20x74x79x70x65x6fx66x20([a-z0-9]+)[(d+)].([a-z0-9]+)x20x3dx3dx3dx20x27x66x75x6ex63x74x69x6fx6ex27/gi.exec(b);
                const krm = /x27\x68x27:[a-z0-9]+.[a-z0-9]+((d+)),'\x61':[a-z0-9]+.[a-z0-9]+((d+))/gi.exec(b);
                document.write(JSON.stringify({ HMAC_SECRET: window[dfnm[1]][dfnm[2]][dfnm[3]](krm[1]), AES_KEY: window[dfnm[1]][dfnm[2]][dfnm[3]](krm[2]) }));
            });
    </script>
</head>

The whole operation takes over 7 seconds to run because of the time overhead of starting a headless browser. I would like to execute the JavaScript from within Python code using a module such as js2py.

I am now confused as to how to apply the ‘fetch … then’ construct to the JavaScript downloaded.

I have this Python so far:-

import requests
import js2py

js2 = b""".then((r) => r.text())
            .then((b) => {
                const dfnm = /x72x65x74x75x72x6ex20x74x79x70x65x6fx66x20([a-z0-9]+)[(d+)].([a-z0-9]+)x20x3dx3dx3dx20x27x66x75x6ex63x74x69x6fx6ex27/gi.exec(b);
                const krm = /x27\x68x27:[a-z0-9]+.[a-z0-9]+((d+)),'\x61':[a-z0-9]+.[a-z0-9]+((d+))/gi.exec(b);
                document.write(JSON.stringify({ HMAC_SECRET: window[dfnm[1]][dfnm[2]][dfnm[3]](krm[1]), AES_KEY: window[dfnm[1]][dfnm[2]][dfnm[3]](krm[2]) }));
            });"""

def get_hmac_aes_keys():
    # Fetch HTML content
    response = requests.get('https://player.akamaized.net/html5player/core/html5-c5-player.js')
    if response.status_code == 200:
        js = response.text
        
        # Execute JavaScript code using js2py
        context = js2py.EvalJs()
        context.execute(js + js2)


        
get_hmac_aes_keys()

But that produces a warning – SyntaxWarning: invalid escape sequence ‘[‘
And an error – KeyError: 3 from js2py (Is js2py up to managing this level of complexity?)

So here I am stuck…

I have tried a chatgpt (3.5) session but that wanted to regex the whole thing and appeared out of its depth.

I have a problem with cookies when I make a request.
When I make the first request it’s all ok, the cookies are ok.

first auth request

The same happens for the second request

second auth request

now i successfully authenticated and i can call a web service and here’s the problem:

ws call

the cookies are not sent and I am asked to re-authenticate.

I’m doing this inside an application made with Vue.

The problem happens in this case:

I have a class that does mock of a library

import axios from "axios";
import Cookies from "js-cookie";

export class WAFData {
  constructor() {
    this.defaultRequest = {
      method: "GET",
      headers: {
        "X-Requested-With": "XMLHttpRequest",
        "Content-Type": "application/x-www-form-urlencoded; charset=utf-8",
      },
      data: null,
      async: true,
      type: "",
      timeout: 25000,
      responseType: "text",
      cache: -1,
      proxy: "ajax",
      withCredentials: false,
      onComplete: () => {},
      onFailure: (error, result, headers) => {
        throw error;
      },
      onPassportError: () => {
        throw new Error("Passport error...");
      },
      onTimeout: (error) => {
        throw error;
      },
      onProgress: () => {},
      onUploadProgress: () => {},
    };
  }
  getHeaders(xhr) {
    const headers = {};
    const arr = xhr
      .getAllResponseHeaders()
      .trim()
      .split(/[rn]+/);
    arr.forEach((line) => {
      const parts = line.split(": ");
      const header = parts.shift();
      const value = parts.join(": ");
      if (header) headers[header] = value;
    });
    return headers;
  }
  handleRedirect(xhr, allOptions) {
    const { onFailure, onPassportError, onTimeout } = allOptions;
    const redirRes = this.request(xhr.response.x3ds_auth_url, {
      onFailure: () => {
        const response = JSON.parse(redirRes.xhr.response);
        console.error(response.error_description);
        onFailure(
          new Error(response.error_description),
          redirRes.xhr.response,
          this.getHeaders(redirRes.xhr)
        );
      },
      onPassportError,
      onTimeout,
      headers: {
        Accept: "application/json",
      },
      withCredentials: false,
      onComplete: (resp) => {
        /*  const redirUrlWithServiceTicket =
          JSON.parse(resp)?.x3ds_service_redirect_url;
        if (redirUrlWithServiceTicket)
          this.request(redirUrlWithServiceTicket, allOptions); */
      },
    });
  }
  async request(url, options) {
    const allOptions = {
      ...this.defaultRequest,
      ...options,
    };
    const {
      method,
      headers,
      data,
      timeout,
      responseType,
      withCredentials,
      onComplete,
      onFailure,
      onProgress,
      onUploadProgress,
      params,
    } = allOptions;

    const urlObj = new URL(url);
    if (!urlObj.searchParams.get("xrequestedwith")) {
      urlObj.searchParams.set("xrequestedwith", "xmlhttprequest");
      headers["X-Requested-With"] = "XMLHttpRequest";
    } 

    try {
      const response = await axios({
        method: method,
        url: urlObj.toString(),
        headers: headers,
        data: data,
        timeout: timeout,
        responseType: responseType,
        withCredentials: false,
        onUploadProgress: onUploadProgress,
        params: params,
      });

      const sessionCookie = response.headers["set-cookie"];
      if (sessionCookie) {
        Cookies.set("session", sessionCookie);
      }
      onComplete?.(response.data, response.headers);
    } catch (error) {
      if (error.response) {
        onFailure?.(
          new Error(
            `URL "${url}" return ResponseCode with value "${error.response.status}"`
          ),
          error.response.data,
          error.response.headers
        );
      } else if (error.request) {
        onFailure?.(
          new Error(
            `The request was made but no response was received. ${error.message}`
          ),
          null,
          null
        );
      } else {
        onFailure?.(
          new Error(
            `Something happened in setting up the request and triggered an Error: ${error.message}`
          ),
          null,
          null
        );
      }
    }
  }

  authenticatedRequest(url, options) {
    return this.request(url, options);
  }
}

i’m using **authenticatedRequest ** to make requests ang i got the above error.

But when I do the whole process of authentication and calling the webservice without the authenticatedRequest method of WAFData class but using functions it’s working, for example:

export async function getAuthParams() {
  try {
    const response = await axios.get(
      process.env.VUE_APP_SERVICE_ + "/login",
      {
        //withCredentials: true,
        params: {
          action: "get_auth_params",
        },
        headers: {
          "X-Requested-With": "XMLHttpRequest",
          
        },
      }
    );
  } catch (error) {
    throw error;
  }
}

I have such a code, it is a response from websocket after performing some action on the page, I would like to dig into how it is executed and decrypt this code.

function a0_0x16f1(_0x28eca6,_0x47708f){const _0x42d027=a0_0x42d0();return a0_0x16f1=function(_0x16f13b,_0x164dbe){_0x16f13b=_0x16f13b-0x114;let _0x4049a6=_0x42d027[_0x16f13b];if(a0_0x16f1['MrNQPy']===undefined){var _0x47a4d1=function(_0x3d1e62){const _0x1a0f90='abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789+/=';let _0x56bb9d='',_0x5a534c='';for(let _0x30b786=0x0,_0x22dbb4,_0x13c340,_0xd065b9=0x0;_0x13c340=_0x3d1e62['charAt'](_0xd065b9++);~_0x13c340&&(_0x22dbb4=_0x30b786%0x4?_0x22dbb4*0x40+_0x13c340:_0x13c340,_0x30b786++%0x4)?_0x56bb9d+=String['fromCharCode'](0xff&_0x22dbb4>>(-0x2*_0x30b786&0x6)):0x0){_0x13c340=_0x1a0f90['indexOf'](_0x13c340);}for(let _0x23c6be=0x0,_0x94b667=_0x56bb9d['length'];_0x23c6be<_0x94b667;_0x23c6be++){_0x5a534c+='%'+('00'+_0x56bb9d['charCodeAt'](_0x23c6be)['toString'](0x10))['slice'](-0x2);}return decodeURIComponent(_0x5a534c);};const _0x3ab817=function(_0x4e144e,_0x3e311d){let _0x3050da=[],_0x4ec2e4=0x0,_0x15baef,_0x41fc07='';_0x4e144e=_0x47a4d1(_0x4e144e);let _0x5eeca0;for(_0x5eeca0=0x0;_0x5eeca0<0x100;_0x5eeca0++){_0x3050da[_0x5eeca0]=_0x5eeca0;}for(_0x5eeca0=0x0;_0x5eeca0<0x100;_0x5eeca0++){_0x4ec2e4=(_0x4ec2e4+_0x3050da[_0x5eeca0]+_0x3e311d['charCodeAt'](_0x5eeca0%_0x3e311d['length']))%0x100,_0x15baef=_0x3050da[_0x5eeca0],_0x3050da[_0x5eeca0]=_0x3050da[_0x4ec2e4],_0x3050da[_0x4ec2e4]=_0x15baef;}_0x5eeca0=0x0,_0x4ec2e4=0x0;for(let _0x4f9997=0x0;_0x4f9997<_0x4e144e['length'];_0x4f9997++){_0x5eeca0=(_0x5eeca0+0x1)%0x100,_0x4ec2e4=(_0x4ec2e4+_0x3050da[_0x5eeca0])%0x100,_0x15baef=_0x3050da[_0x5eeca0],_0x3050da[_0x5eeca0]=_0x3050da[_0x4ec2e4],_0x3050da[_0x4ec2e4]=_0x15baef,_0x41fc07+=String['fromCharCode'](_0x4e144e['charCodeAt'](_0x4f9997)^_0x3050da[(_0x3050da[_0x5eeca0]+_0x3050da[_0x4ec2e4])%0x100]);}return _0x41fc07;};a0_0x16f1['RLIrdR']=_0x3ab817,_0x28eca6=arguments,a0_0x16f1['MrNQPy']=!![];}const _0x4d0c1a=_0x42d027[0x0],_0x4c9c3d=_0x16f13b+_0x4d0c1a,_0x432e61=_0x28eca6[_0x4c9c3d];return!_0x432e61?(a0_0x16f1['GPUBEQ']===undefined&&(a0_0x16f1['GPUBEQ']=!![]),_0x4049a6=a0_0x16f1['RLIrdR'](_0x4049a6,_0x164dbe),_0x28eca6[_0x4c9c3d]=_0x4049a6):_0x4049a6=_0x432e61,_0x4049a6;},a0_0x16f1(_0x28eca6,_0x47708f);}

I have tried programs to decrypt obfuscated code online, but nothing is able to decrypt. Is anyone able to step-by-step how to go about decrypting, what programs to use, etc.?

React native metro loading stopped nothing happened ctrl + c or anything how can fix that?

Web C:UserspranjOneDriveDesktopMobile AppFakeStoreFakeStorenode_modulesexpo/AppEntry.js ▓▓▓▓▓░░░░░░░░░░░ 36.1% (179/298)

I want to solve like open up project