NEROX Comments - Answer Overflow

Topics

NEROX

•Created by kessius85 on 4/24/2025 in #🙋questions

How to set a different meta tag in the head depending on the page

One solution (external to Wasp) is to use some pre-render service (prerender as an example) or any Open-Source. They act as middleware/proxy between your app and the bots/crawlers. When a bot (Google, Facebook, Twitter, etc.) requests a page from your SPA, Prerender launches a headless browser (like Puppeteer/Chrome), loads your app, waits for the JS to run and the DOM to update (including React Helmet changes), and then returns the rendered HTML to the bot. For normal users, the app works as usual (SPA). But as I said at the beginning, as of today it's not possible with Wasp.

23 replies

•Created by kessius85 on 4/24/2025 in #🙋questions

How to set a different meta tag in the head depending on the page

hm I understand, it's currently not possible as it's SPA. react-helmet-async is a good solution to handle SEO but not perfect: - The head of main.wasp is rendered only in the initial HTML, and then React only manipulates the DOM, but generally (with the exception of Google and some other) bots/crawlers (Linkedin, Facebook, Twitter, etc. ) usually only read the initial HTML, not the DOM modified by JS. - react-helmet-async only changes the head in the browser DOM, but not in the HTML that the bots/crawlers receive, unless you use SSR (Server Side Rendering), which Wasp doesn't support yet. So, even if you change the <meta property="og:image" ...> with Helmet, the bots only see the one in the initial HTML (the one in main.wasp).

23 replies

•Created by kessius85 on 4/24/2025 in #🙋questions

How to set a different meta tag in the head depending on the page

Hey @kessius85 what meta-tags are you trying to show?

23 replies

•Created by Sven on 4/24/2025 in #🙋questions

How to not show fly.io domain on google search

To directly eliminate the root of the problem you can create a small redirection middleware:

import { type MiddlewareConfigFn } from 'wasp/server'
import { type RequestHandler } from 'express'
import { URL } from 'url'

const redirectToPrimaryDomain: RequestHandler = (req, res, next) => {
  // Use WASP_WEB_CLIENT_URL for the canonical domain.
  const primaryDomainUrl = process.env.WASP_WEB_CLIENT_URL
  if (!primaryDomainUrl) {
    // Allow requests if primary domain is not set (e.g., local dev).
    return next()
  }

  try {
    const expectedHost = new URL(primaryDomainUrl).host
    const currentHost = req.headers.host

    // If the request host doesn't match the primary domain, redirect.
    if (currentHost && currentHost !== expectedHost) {
      const redirectUrl = `${primaryDomainUrl}${req.originalUrl}`
      // 301 Permanent Redirect for SEO.
      return res.redirect(301, redirectUrl)
    }
  } catch (error) {
    console.error('Error processing redirect middleware:', error)
    // Continue without redirecting in case of error (e.g., invalid URL in env var).
  }

  // Proceed if hosts match or an error occurred.
  return next()
}

export const serverMiddlewareFn: MiddlewareConfigFn = (middlewareConfig) => {
  // Prepend the domain redirection middleware to the existing middleware chain.
  const newMiddlewareConfig = new Map()
  newMiddlewareConfig.set('redirectToPrimaryDomain', redirectToPrimaryDomain)
  middlewareConfig.forEach((value, key) => {
    newMiddlewareConfig.set(key, value)
  })

  return newMiddlewareConfig
}

import { type MiddlewareConfigFn } from 'wasp/server'
import { type RequestHandler } from 'express'
import { URL } from 'url'

const redirectToPrimaryDomain: RequestHandler = (req, res, next) => {
  // Use WASP_WEB_CLIENT_URL for the canonical domain.
  const primaryDomainUrl = process.env.WASP_WEB_CLIENT_URL
  if (!primaryDomainUrl) {
    // Allow requests if primary domain is not set (e.g., local dev).
    return next()
  }

  try {
    const expectedHost = new URL(primaryDomainUrl).host
    const currentHost = req.headers.host

    // If the request host doesn't match the primary domain, redirect.
    if (currentHost && currentHost !== expectedHost) {
      const redirectUrl = `${primaryDomainUrl}${req.originalUrl}`
      // 301 Permanent Redirect for SEO.
      return res.redirect(301, redirectUrl)
    }
  } catch (error) {
    console.error('Error processing redirect middleware:', error)
    // Continue without redirecting in case of error (e.g., invalid URL in env var).
  }

  // Proceed if hosts match or an error occurred.
  return next()
}

export const serverMiddlewareFn: MiddlewareConfigFn = (middlewareConfig) => {
  // Prepend the domain redirection middleware to the existing middleware chain.
  const newMiddlewareConfig = new Map()
  newMiddlewareConfig.set('redirectToPrimaryDomain', redirectToPrimaryDomain)
  middlewareConfig.forEach((value, key) => {
    newMiddlewareConfig.set(key, value)
  })

  return newMiddlewareConfig
}

And as Franjo has said, add Canonical as well.

10 replies

•Created by Sven on 4/21/2025 in #🙋questions

Seo optimization

Hey Sven, if you want you can share the site so I can take a look at the SEO score?

18 replies

•Created by mb23 on 4/16/2025 in #🙋questions

I'm getting this error when deploying my server to Railway

Try to replace:

import * as Cheerio from "cheerio";
...
const $ = Cheerio.load(data);

import * as Cheerio from "cheerio";
...
const $ = Cheerio.load(data);

by import { load } from 'cheerio';

13 replies

•Created by mb23 on 4/16/2025 in #🙋questions

I'm getting this error when deploying my server to Railway

What version of cheerio do you have in package.json? Something similar happened to me.

13 replies

•Created by NEROX on 4/16/2025 in #🙋questions

Wasp TypeScript configuration - Split Wasp file

Oh yes, thank you Genyus!

6 replies

•Created by NEROX on 4/9/2025 in #🙋questions

API auth with a Chrome Extension (third party)

I have created an issue because I have tried quite a few things and it doesn't fit in a Discord message: https://github.com/wasp-lang/wasp/issues/2646

14 replies

•Created by NEROX on 4/9/2025 in #🙋questions

API auth with a Chrome Extension (third party)

@kapa.ai Explain me the full process of implementing JWT making sure that the JWT is from the device you are currently on. Have a secret also at the user level.

14 replies

•Created by Sven on 3/29/2025 in #🙋questions

Change tab title to what page user is on

woah, since when is this possible?

16 replies

•Created by Sven on 3/29/2025 in #🙋questions

Change tab title to what page user is on

we have also the react-helmet-async solution

16 replies

•Created by NEROX on 3/26/2025 in #🙋questions

[ Wasp ] core/auth.ts(17,7): error TS2742

Well, fixed after several wasp clean and wasp start

6 replies

•Created by pipas on 3/18/2025 in #🙋questions

Best practices to verify files before uploading to S3?

After that I read the Pdf content with pdf.js-extract , maybe you can check if the reading process is successfully finished before uploading to S3.

// PDF extraction function that only checks if extraction is successful
import fs from 'fs';
import { PDFExtract } from 'pdf.js-extract';

export const extractPdf = async (filePath) => {
  try {
    // Check if file exists
    if (!fs.existsSync(filePath)) {
      return {
        success: false,
        message: 'File not found'
      };
    }

    // Read the PDF file
    const pdfBuffer = fs.readFileSync(filePath);
    
    // Initialize PDF extractor
    const pdfExtract = new PDFExtract();
    
    // Attempt to extract content
    const pdfData = await pdfExtract.extractBuffer(pdfBuffer);
    
    // If we got here, extraction was successful
    return {
      success: true,
      message: 'PDF extraction successful (Safe to upload it to S3)',
      pageCount: pdfData.pages.length
    };
    
  } catch (error) {
    // Handle specific errors
    if (error.name === 'TypeError') {
      return {
        success: false,
        message: 'Invalid PDF format',
        error: error.message
      };
    }
    
    // Handle any other errors
    return {
      success: false,
      message: 'PDF extraction failed',
      error: error.message
    };
  }
};

15 replies

•Created by pipas on 3/18/2025 in #🙋questions

Best practices to verify files before uploading to S3?

I use multer to upload files to the server to a temp folder (ensuring it is *.pdf extension) with an API (using import { tmpdir } from 'os';)

// Configure multer for file uploads
const upload = multer({
  dest: tmpdir(), // Use system's temporary directory
  limits: { fileSize: 10 * 1024 * 1024 } // 10MB size limit
});

export const uploadFileApi = async (req, res, context) => {
  // Check if user is authenticated
  if (!context.user) {
    return res.status(401).json({ message: 'Unauthorized' });
  }

  // Set up multer middleware for single file upload
  const singleUpload = upload.single('file');

  singleUpload(req, res, async function(err) {
    // Handle upload errors
    if (err) {
      return res.status(400).json({ message:

File upload error: ${err.message}

 });
    }

    // Check if file was provided
    if (!req.file) {
      return res.status(400).json({ message: 'No file was provided' });
    }

    try {
      // File successfully uploaded to temporary location
      console.log('File uploaded successfully:', req.file.originalname);
      
      // Return success response
      return res.json({ 
        success: true,
        filename: req.file.originalname,
        path: req.file.path
      });
    } catch (error) {
      // Handle any other errors
      console.error('Error processing file:', error);
      return res.status(500).json({ 
        message: 'Error processing uploaded file' 
      });
    }
  });
};

15 replies

•Created by NEROX on 3/21/2025 in #🙋questions

Non-Dev question about APIs

@kapa.ai What would be the difference in the Extension and the Api using wasp:sessionId or for getSessionId() from wasp/client/api? Is the same? Explain the differences, could I get sessionId from API call?

20 replies

•Created by NEROX on 3/21/2025 in #🙋questions

Non-Dev question about APIs

@kapa.ai How secure is wasp:sessionId to use as auth in a Chrome extension that calls the app API?

20 replies

•Created by NEROX on 3/19/2025 in #🙋questions

Property does not exist on type

forgot to refresh browser lol

12 replies

•Created by NEROX on 3/19/2025 in #🙋questions

Property does not exist on type

@kapa.ai wasp 0.15.0 to wasp 0.16.2 Error:

[plugin:vite:import-analysis] Failed to resolve import "wasp/client/webSocket/WebSocketProvider" from "src/index.tsx". Does the file exist?
/home/rootall/apps/ask-the-documents/.wasp/out/web-app/src/index.tsx:12:34
8  |    queryClientInitialized
9  |  } from "wasp/client/operations";
10 |  import { WebSocketProvider } from "wasp/client/webSocket/WebSocketProvider";

Code (wasp 0.15.0):

import { Server } from 'socket.io'
import { type WebSocketDefinition, type WaspSocketData } from 'wasp/server/webSocket'

What's wrong? What should be in latest wasp version? what's new? how to solve import?

12 replies

•Created by NEROX on 3/21/2025 in #🙋questions

Non-Dev question about APIs

@kapa.ai Wait, can I call an operation within an API? Without the need to rewrite the logic I would do?

20 replies