Alpaca Connection Failed: read ECONNRESET

to place a trade on alpaca using the api keys but this is the response i gotgyrhe yrnvujnjctnbrhnj btjryndbrhjtfvecnbt nbthbyjhbtjyhnbryvhfgdfbvthfgb vbnvc bmvnjhgvfhgvnbcvncbvghfgnvb c

I have a frontend/backend working, but struggling to get the backend to grab a PDF, turn it into an array of bytes, send it to the front end, and have the front end transform it into a blob, and display the working PDF on the front end display. Currently, the error I am getting is that its displaying on the front end as “Error , failed to load PDF document” and not giving much other error info. So its sending the info, but maybe not formatting correctly?

Image of error

I took out some info that I cannot show (what Item is, or how the Item is used on the backend to grab the correct pdf, sorry)

Backend :

[Route("grab-pdf")]
[ApiController]

public async Task <ActionResult> Create(request) {
byte[] pdf = system.IO.File.ReadAllByters("fileexample.pdf");
return File()pdf, "application/pdf","pdfexampletitle");
}

frontend :

var items = [{ id: "1", amount : 100}]

grabPDF(); 

async function grabPDF() { 
const response = await fetch("/grab-pdf", {
method : "POST",
headers : {"Content-Type": "application/json"},
body : JSON.stringify ({items}),
}); 

const {invAmt}  = await response.blob();
//const blob = new blob([(response.blob()], { type: 'application/pdf' });  //I tried using this, but gave same error
const url = URL.createObjectURL(invAmt);
const iframe = document.createElement("iframe");
iframe.src = url
iframe.style.width = '100%';
iframe.style.height = '900px';
document.body.appendChild(iframe);

}

I'm trying to make a login/register page in a slightly unusual way, but I can't figure out how to set up the styles.
I'm using vue3, but I don't think it matters here.

The idea is to have two "windows" visible on the main element (let's say, body ), through which a part of the login page and register page is visible. And when hovered over, this window should expand to full screen, exposing the component that was hidden under the window.
There are a couple of pictures at the end of the message, that can help you to understand me.

However, I can't implement this either with clip-path or with overflow:hidden.

When using overflow, the child element (login page) is positioned relative to the wrapper (the wrapper is the "window" through which a piece of the login page is visible), and I can't position the "window" normally so that only the "login" button is visible through it, and so that it expands normally.

And when using clip-path, the element is cut off so that it cannot be customized - add a border or something else.

I also tried to use a mask, but also failed.

In general, I came up with a task for myself and I can’t figure out how to implement such, at first glance, simple functionality.

I hope someone can help, because chat-gpt is not ready to solve such a problem, and does not even understand what I want from it :(
here some images that can help understand what i imagine
[img1](https://i.sstatic.net/GPuXelzQ.jpg)
[img2](https://i.sstatic.net/JpVfnlJ2.jpg)
[img3](https://i.sstatic.net/WieVikCw.jpg)

i tried iafhbidfb bhfasduofuaf so hard aosjdnipasndkasnd asda sd asd sa vgasd gasdgasdg asd gasd g asdg sadg sad g
asdasdas
asdasdasd

I am trying to animate a “left” to “right”-side rotation using transform-origin. More specifically, I would like to maintain the left side’s rotation position when the transform-origin is switched. Is there a way for me to preserve this positioning despite the rotation being relative to the current origin?

For example,
(1) when left is executed -> [].
(2) when right is executed -> [-], while maintaining left side previous position.

function rotate(direction) {
  const rotatedBox = document.getElementsByClassName("rotatedBox")[0]
  if (direction === "right") {
    rotatedBox.classList.remove("left")
    rotatedBox.classList.add("right")
  } else if (direction === "left") {
    rotatedBox.classList.remove("right")
    rotatedBox.classList.add("left")
  }
}

.bigBox {
  border: solid 1px red;
  height: 80vh;
  width: 70vw;
  position: relative;
}

.rotatedBox {
  border: solid 1px greenyellow;
  background-color: teal;
  height: 10px;
  position: absolute;
  bottom: 0;
  width: 100%;
  transition: transform-origin 0.2s ease-in-out;
}

.rotatedBox.right {
  transform-origin: 0% 50% 0px;
  transform: rotate(-10deg);
}

.rotatedBox.left {
  transform-origin: 100% 50% 0px;
  transform: rotate(10deg);
}

<button onclick="rotate('left')">left</button>
<button onclick="rotate('right')">right</button>
<div class="bigBox">
  <div class="rotatedBox"></div>
</div>

may you help me? I’m trying to create a carousel with pure-react-carousel but I’m getting the error: RangeError: Maximum call stack size exceeded
Below is the MRE:

Index:

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Vite + React</title>
  </head>
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.jsx"></script>
  </body>
</html>

React Component

import React from 'react';
import { CarouselProvider, Slider, Slide, ButtonBack, ButtonNext } from 'pure-react-carousel';
import 'pure-react-carousel/dist/react-carousel.es.css';

const CarouselTest = () => {
    return (
        <CarouselProvider
            visibleSlides={1}
            step={1}
            totalSlides={3}
            isIntrinsicHeight={true}
        >
            <Slider>
                <Slide index={0}>First Slide</Slide>
                <Slide index={1}>Second Slide</Slide>
                <Slide index={2}>Third Slide</Slide>
            </Slider>
            <ButtonBack>Anterior</ButtonBack>
            <ButtonNext>Próximo</ButtonNext>
        </CarouselProvider>
    );
};

export default CarouselTest;

The error seems to be related to an infinite loop, but I can’t find the reason.

An error occurred in the component.

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://react.dev/link/error-boundaries to learn more about error boundaries.

Google Apps Script Web App Not Working When Embedded on Namecheap Website

Problem Overview

I’m trying to create an order tracking feature on my Namecheap-hosted website that searches a Google Sheet when a user inputs an order number and returns the corresponding information.

What Works

• The Apps Script web app functions correctly when accessed directly via its URL in Safari
• The search functionality works as expected when I open the html file, containing the apps script url, on safari.

What Doesn’t Work

• When embedded on my Namecheap website, the JavaScript appears to be treated as a string rather than being executed
• When I try to embed just the Apps Script link on Namecheap, I get a 403 error from Google (“You need access”)

What I’ve Tried

I’ve attempted several variations of my doGet() function to resolve CORS/access issues:

Variation 1: JSONP with CORS headers

function doGet(e) {
  const orderNumber = e.parameter.orderNumber;
  const callback = e.parameter.callback || 'callback'; // Default callback name if none provided
  
  if (!orderNumber) {
    return ContentService.createTextOutput(callback + '(' + JSON.stringify({ success: false, message: "No order number provided" }) + ')')
      .setMimeType(ContentService.MimeType.JAVASCRIPT); // Returns JavaScript JSONP format
  }
  
  const result = searchOrder(orderNumber);
  
  const output = ContentService.createTextOutput(callback + '(' + JSON.stringify(result) + ')')
    .setMimeType(ContentService.MimeType.JAVASCRIPT);
  output.setHeader("Access-Control-Allow-Origin", "*");
  output.setHeader("Access-Control-Allow-Methods", "GET, POST");
  output.setHeader("Access-Control-Allow-Headers", "Content-Type");
  
  return output;
}

Variation 2: Pure JSONP approach

function doGet(e) {
  // Get the order number and callback from the request parameters
  const orderNumber = e.parameter.orderNumber;
  const callback = e.parameter.callback || 'callback'; // Default callback if none provided
  
  // If no order number was provided, return an error
  if (!orderNumber) {
    return ContentService.createTextOutput(callback + '(' + JSON.stringify({ success: false, message: "No order number provided" }) + ')')
      .setMimeType(ContentService.MimeType.JAVASCRIPT); // Returns JavaScript JSONP format
  }
  
  // Search for the order
  const result = searchOrder(orderNumber);
  
  // Return the result as JSONP - this format allows cross-domain requests
  // by wrapping the JSON in a function call that will be executed by the browser
  return ContentService.createTextOutput(callback + '(' + JSON.stringify(result) + ')')
    .setMimeType(ContentService.MimeType.JAVASCRIPT);
}

Variation 3: Pure JSON approach (no JSONP, no callback)

function doGet(e) {
  // Get the order number from the request parameters
  const orderNumber = e.parameter.orderNumber;
  
  // If no order number was provided, return an error
  if (!orderNumber) {
    return ContentService.createTextOutput(JSON.stringify({ success: false, message: "No order number provided" }))
      .setMimeType(ContentService.MimeType.JSON); // Returns plain JSON format
  }
  
  // Search for the order
  const result = searchOrder(orderNumber);
  
  // Return the result as pure JSON (no callback wrapping)
  return ContentService.createTextOutput(JSON.stringify(result))
    .setMimeType(ContentService.MimeType.JSON);
}

Deployment Settings

• Script is deployed as a web app executing as me
• Access is set to “Anyone”
• I’ve even tried changing the Google Spreadsheet access to “Anyone” but that didn’t resolve the issue

Other Information

• Namecheap support suggested that I need to whitelist my server IP, but I was under the impression this isn’t possible with Google Apps Script

Question

How can I successfully integrate my Google Apps Script web app with my Namecheap website to enable the order tracking functionality? Is there a way to resolve the 403 access error or prevent the JavaScript from being treated as a string?

In Javascript the following compiles (I’m particularly referring to the function as the key):

const object = {
  key: 1,
  "key key": 2,
  3: 3,
  [() => undefined]: 4,
};

console.log(Object.keys(object));

Link

My understanding is that is that the function signature will be (like any other key, correct me if I’m wrong) be converted into a string. But it does not compile in Typescript:

It gives error:

A computed property name must be of type ‘string’, ‘number’, ‘symbol’,
or ‘any’.

if I add this anonymous => function multiple times, is it really attached multiple times? and would it execute multiple times?
I.e. it this assignment statement were called 5 times, would I end up with 5 “copies” of the => listening?

 hintCell.addEventListener("click", () => {
   someCode;
   moreCode;
}

I’ve been away from coding for a couple of years but now I’m starting working on a new project.
First Ajax call, first problem (as in the title). I’ve downloaded the newest version of jQuery 3.7.1., I’ve added ‘async: true’ as the first line in $.ajax() function but still get the same error. What else can it be?

there is an feature the downloaded excel sheet should contains the apis response data in dropdown for particular two to three fields is it possible to gnereate using reacts

I’ve tried to implement that feature but the api’s response were not reflecting in as dropdown

I have this async function:

export const GetSearchQueryResults = async (gqlEndpoint: string, gqlApiKey: string, query: string): Promise<any> => {
  console.log(query);
  fetch(gqlEndpoint, {
    method: 'POST',
    headers: new Headers({ sc_apikey: gqlApiKey, 'content-type': 'application/json' }),
    body: query,
  })
    .then((response) => response.json())
    .then((data) => {
      // parse data
      console.log('Results: ');
      const results = data.data.pageOne;
      console.log(results);
      return results;
    })
    .catch((error) => {
      console.log(error);
    });
};

and I’m calling it from another function:

const data = GetSearchQueryResults(gqlEndpoint, gqlApiKey, query).then((data) => {
   console.log('Awaited results:');
   console.log(data);
});

but no matter what I try, the “awaited results” are logging as undefined before the function async function actually completes. I can tell because looking at the console, I see

"Awaited results:"
undefined
"Results:"
{results obj}

So I know that the fetch is in fact getting data, but GetSearchQueryResults is executing the then before the async function actually finishes. What am I doing wrong?

const ErrorHandler = (err, req, res, next) => {
    logging.error(err);
    let message = 'An error occured, please try again.';
    let statusCode = 500;

    const response = {
        success: false,
        message: message,
    };

    
    res.status(statusCode).json(response);
    //  in the future add custom error messages based on error type 
};

export default ErrorHandler;

The above is my custom middleware. I have appropiately imported it on my main app.js file using:

const ErrorHandler = require('./middleware/ErrorHandler');
app.use(ErrorHandler);

And my post route looks like:

router.post('/submit-recipe', getUserMiddleware, upload.any(), async (req, res, next) => {

I have followed along some other posts such as this one, and all my routers are correctly being exported/imported.

Am I missing something obvious here?

I’m trying to detect whether a device that’s running a webpage JavaScript script in a browser has accelerometer data available for devicemotion and deviceorientation access. This is what I have now:

  function onMotion(event) {
    if (event.acceleration.y==null) {
      //there can be null events even on supported devices
      return;
    }
    document.getElementById("support-status-text").innerHTML = "Supported on this device";
    document.getElementById("y-acceleration-text").innerHTML = roundToFixed(event.acceleration.y);
  }

  function roundToFixed(value) {
    return value==null ? value : value.toFixed(2);
  }

  if (!('ondeviceorientation' in window)) {
    document.getElementById("support-status-text").innerHTML = "Orientation not supported on this device";
  }

  if ('ondevicemotion' in window) {
    window.addEventListener('devicemotion', onMotion);
  } else {
    document.getElementById("support-status-text").innerHTML = "Not supported on this device";
  }

<div id="container">
  <p id="support-status-text">Loading...</p>
  <p id="y-acceleration-text">nothing</p>
</div>

On my phone, which has both motion and orientation support, the top text reads “Supported on this device” with the incoming accelerometer data displayed below it (after flashing “Loading…” and “nothing” before non-null events start firing, which is fine for now). However, on my laptop, which does not have motion support, I just see “Loading…” rather than the expected “Not supported on this device”. On my tablet, which I believe has motion support but not orientation support, I see “Loading…” rather than the expected “Orientation not supported on this device”. What am I doing wrong?

I’m having a problem when loading a larger file with ffmpeg in safari mobile, it crashes while doing that.

Currently I’m loading the whole file at once await ffmpeg.writeFile(inputFileName, await fetchFile(file)); and to my understanding safari tries to load it in-memory in one go and fails.

How can I work around this issue? Maybe split the file to chunks? Maybe streaming?

Thank you.

Today i spent all hours with this problem: i would group by and count over json data using JSONata.

This is my json data

var mydata = [
{"OWNED": "A","DOSSIER": "Private","DIP_ID": 8619},
{"OWNED": "B","DOSSIER": "Public", "DIP_ID": 17},
{"OWNED": "C","DOSSIER": "Private","DIP_ID": 27635},
{"OWNED": "A","DOSSIER": "Public","DIP_ID": 111},   
{"OWNED": "B","DOSSIER": "Public","DIP_ID": 110}
];

I would obtain a javascript variable with folowing result data:

grouping on OWNED and DOSSIER fields
and counting DIP_ID field for each group.

I’ve used following approach:

var expr = ‘{“counter”: $count(DIP_ID), “sku”:$distinct(OWNED)}’;

var result = await jsonata(expr).evaluate(mydata);

I can’t understand how make an expression to pass to jsonata function.

I’ve tried to adapt the following examples but i receive always an error from javascript library
jsonata.min.js

Probably i can’t able to make a string with corrected syntax inside var “expr”.

Example
Example 2

Maybe the main problem is understand how integrate JSONata query language in my javascript file.

Thanks in advance.