return not working in server actions beta | TypeScript Community | Page 1

sharp mica Oct 17, 2023, 4:44 PM

#

im making a url shortner using server actions but when i return from the server I get the error Internal error: TypeError: e.getSetCookie is not a function

#

here is the code:

page.tsx

"use client"
import React, { useState } from 'react';
import {makeShortnedUrl} from "@/src/app/urlShortener/server"

const UrlShortener = () => {
  const [inputUrl, setInputUrl] = useState('');
  const [shortenedUrl, setShortenedUrl] = useState('');

  const handleShorten = async () => {
    try {
      const response = await fetch('/api/shorten', {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
        },
        body: JSON.stringify({ url: inputUrl }),
      });

      const data = await response.json();
      setShortenedUrl(data.shortUrl);
    } catch (error) {
      console.error('Error shortening URL:', error);
    }
  };

  const handleClick = async (origin:string, added:string) => {
    const res = await makeShortnedUrl(origin, added)
    console.log(res)
  }

  return (
    <div>
      <h1>URL Shortener</h1>
      <input
        type="text"
        value={inputUrl}
        onChange={(e) => setInputUrl(e.target.value)}
      />
      <input 
        type="text" 
        value={shortenedUrl} 
        onChange={(e) => setShortenedUrl(e.target.value)}
      />
      <button onClick={()=> handleClick(inputUrl, shortenedUrl)}>Shorten</button>
    </div>
  );
};

export default UrlShortener;

#

servers.ts

"use server"

import fs from 'fs';

export async function makeShortnedUrl(OriginalUrl:string, ShortnedUrl:string) {
    let newLink = "";
    let error = "";
    const dbPath = 'src/app/urlShortener/db.json';
    const dbData = JSON.parse(fs.readFileSync(dbPath, 'utf8'));
    
    if (ShortnedUrl == "") {
        newLink = "https://example.url/url/" + Math.random().toString(36).substring(2, 7);
    } else if (OriginalUrl == "") {
        error = "Error: Original URL is null";
    } else if (dbData["https://example.url/url/" + ShortnedUrl]) {
        error = "Error: Shortened URL already exists";
    } else {
        newLink = "https://catblik.tech/url/" + ShortnedUrl;
    }

    if (error == "") {
        console.log("New link: " + newLink);
        dbData[newLink] = OriginalUrl;
        fs.writeFileSync(dbPath, JSON.stringify(dbData));

        return newLink;
    } else {
        console.log(error);
        return error;
    }
}

export async function getOriginalUrl(ShortnedUrl:string) {
    // get the original link from the database "src\app\urlShortener\db.json"
    
    const dbPath = 'src/app/urlShortener/db.json';
    const dbData = JSON.parse(fs.readFileSync(dbPath, 'utf8'));
    const OriginalUrl = dbData[ShortnedUrl];
    return OriginalUrl;
}

#

here is the full error:

Internal error: TypeError: e.getSetCookie is not a function
    at new p (X:\code\multi-app-website-nextjs\multi-app-website\node_modules\next\dist\compiled\next-server\app-page-experimental.runtime.dev.js:2:19511)
    at e5.wrap (X:\code\multi-app-website-nextjs\multi-app-website\node_modules\next\dist\compiled\next-server\app-page-experimental.runtime.dev.js:34:452133)
    at X:\code\multi-app-website-nextjs\multi-app-website\node_modules\next\dist\compiled\next-server\app-page-experimental.runtime.dev.js:34:454090
    at get mutableCookies [as mutableCookies] (X:\code\multi-app-website-nextjs\multi-app-website\node_modules\next\dist\compiled\next-server\app-page-experimental.runtime.dev.js:34:454100)
    at tj (X:\code\multi-app-website-nextjs\multi-app-website\node_modules\next\dist\compiled\next-server\app-page-experimental.runtime.dev.js:36:2392)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async X:\code\multi-app-website-nextjs\multi-app-website\node_modules\next\dist\compiled\next-server\app-page-experimental.runtime.dev.js:36:6338
    at async t$ (X:\code\multi-app-website-nextjs\multi-app-website\node_modules\next\dist\compiled\next-server\app-page-experimental.runtime.dev.js:36:4860)
    at async tV (X:\code\multi-app-website-nextjs\multi-app-website\node_modules\next\dist\compiled\next-server\app-page-

#

experimental.runtime.dev.js:36:32520)
    at async doRender (X:\code\multi-app-website-nextjs\multi-app-website\node_modules\next\dist\server\base-server.js:1294:26)
    at async cacheEntry.responseCache.get.incrementalCache.incrementalCache (X:\code\multi-app-website-nextjs\multi-app-website\node_modules\next\dist\server\base-server.js:1446:28)
    at async DevServer.renderToResponseWithComponentsImpl (X:\code\multi-app-website-nextjs\multi-app-website\node_modules\next\dist\server\base-server.js:1361:28)
    at async DevServer.renderPageComponent (X:\code\multi-app-website-nextjs\multi-app-website\node_modules\next\dist\server\base-server.js:1600:24)
    at async DevServer.renderToResponseImpl (X:\code\multi-app-website-nextjs\multi-app-website\node_modules\next\dist\server\base-server.js:1638:32)
    at async DevServer.pipeImpl (X:\code\multi-app-website-nextjs\multi-app-website\node_modules\next\dist\server\base-server.js:826:25)
    at async DevServer.handleCatchallRenderRequest (X:\code\multi-app-website-nextjs\multi-app-website\node_modules\next\dist\server\next-server.js:623:13)
    at async DevServer.handleRequestImpl (X:\code\multi-app-website-nextjs\multi-app-website\node_modules\next\dist\server\base-server.js:728:17)

unkempt rock Oct 17, 2023, 4:55 PM

#

hard to tell, doesn't seem to be coming from your code, or at least the part you've shown

#

also this server is mainly about TS-related issues, not just gneral programming help

sharp mica Oct 17, 2023, 5:20 PM

#

is there maybe a diffrent method or a work around so i dont encounter this issue

unkempt rock Oct 17, 2023, 5:23 PM

#

https://github.com/vercel/next.js/issues/56949

#

https://github.com/vercel/next.js/issues/56947

#

Upgrading Node.js to 18.16.1 resolved issue.

sharp mica Oct 17, 2023, 5:46 PM

#

#

using npm upgrade worked

unkempt rock Oct 17, 2023, 5:48 PM

#

sharp mica using ```npm upgrade``` worked

that did not do anything

sharp mica Oct 17, 2023, 5:48 PM

#

oh yea your correct

unkempt rock Oct 17, 2023, 5:49 PM

#

sharp mica

just because npm is telling you to upgrade npm doesn't mean

you have to upgrade
you have to upgrade to the latest version, you still need a version that is compatible with your node version

#

also, you need to update nodejs, not npm

sharp mica Oct 17, 2023, 5:51 PM

#

sould i just try to maybe install the latest version from their website

unkempt rock Oct 17, 2023, 5:51 PM

#

yes

sharp mica Oct 17, 2023, 5:52 PM

#

ok il do that and update if that fixes the probllem

unkempt rock Oct 17, 2023, 5:52 PM

#

note there are version managers that exist for node (n, nvm, etc.)

#

don't know if you need to switch version frequently or how experienced you are with the tooling...

sharp mica Oct 17, 2023, 5:58 PM

#

unkempt rock don't know if you need to switch version frequently or how experienced you are w...

il concider using them since in my code im using some experamental fetures so probably best to stay up to day

sharp mica Oct 17, 2023, 5:58 PM

#

sharp mica ok il do that and update if that fixes the probllem

it worked! thank you for all the help!

unkempt rock Oct 17, 2023, 6:08 PM

#

!resolved

#return not working in server actions beta