URIError: URI Malformed // app only crashes in dev

Support
1

netlify site name: https://trusting-bose-ebf20b.netlify.app

Whenever I click the Get Liked Tracks button in my app, data is retrieved from the database, and then the app crashes.

This is the error message I’m receiving. This only happens in my development environment. I tried deploying to netlify, and it works fine in production.

Request from ::ffff:127.0.0.1: GET /.netlify/functions/db-get-liked-tracks
Function `db-get-liked-tracks` invoked...
Response with status 200 in 394 ms.
URIError: URI malformed
    at decodeURIComponent (<anonymous>)
    at rewriter (/Users/wyvren/.nvm/versions/node/v16.4.2/lib/node_modules/netlify-cli/src/utils/rules-proxy.js:85:13)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async onRequest (/Users/wyvren/.nvm/versions/node/v16.4.2/lib/node_modules/netlify-cli/src/utils/proxy.js:374:17)
URIError: URI malformed
    at decodeURIComponent (<anonymous>)
    at rewriter (/Users/wyvren/.nvm/versions/node/v16.4.2/lib/node_modules/netlify-cli/src/utils/rules-proxy.js:85:13)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async onRequest (/Users/wyvren/.nvm/versions/node/v16.4.2/lib/node_modules/netlify-cli/src/utils/proxy.js:374:17)

/Users/wyvren/.nvm/versions/node/v16.4.2/lib/node_modules/netlify-cli/node_modules/netlify-redirector/lib/redirects.js:116
      throw ex;
      ^
abort({}) at Error
    at jsStackTrace (/Users/wyvren/.nvm/versions/node/v16.4.2/lib/node_modules/netlify-cli/node_modules/netlify-redirector/lib/redirects.js:1070:13)
    at stackTrace (/Users/wyvren/.nvm/versions/node/v16.4.2/lib/node_modules/netlify-cli/node_modules/netlify-redirector/lib/redirects.js:1087:12)
    at process.abort (/Users/wyvren/.nvm/versions/node/v16.4.2/lib/node_modules/netlify-cli/node_modules/netlify-redirector/lib/redirects.js:8502:44)
    at process.emit (node:events:394:28)
    at processEmit [as emit] (/Users/wyvren/.nvm/versions/node/v16.4.2/lib/node_modules/netlify-cli/node_modules/signal-exit/index.js:175:34)
    at emit (node:internal/process/promises:136:22)
    at processPromiseRejections (node:internal/process/promises:242:25)
    at processTicksAndRejections (node:internal/process/task_queues:97:32)
(Use `node --trace-uncaught ...` to show where the exception was thrown)
2

Hi @wilhsie,

Could we see the repo?

3

Sure, the repo lives here: GitHub - wilhsie/solar-beats-react: SoundCloud Likes re-imagined using React, Netlify, and FaunaDB

4

You’re returning some Image URLs from your database like:

image
image1238×112 19.6 KB

I believe this is causing problems with Decode URl as this is not a valid URI.

I had told this in your helpdesk ticket too. But because of the repo, I could experiment and see the error better.

5

hi @hrishikesh I wasn’t able to work on this issue for a bit, but recently I’ve tried debugging it again and it seems like I’m running into a new issue.

I wanted to repopulate the data in my database by replacing the track_img url with a default url if the track_img url wasn’t properly formatted. So I modified my webscraper code, but when I run my webscraper now the browser won’t stay open. This is weird because it was definitely working a couple months ago.

This is the error message I’m running into now:

Request from ::ffff:127.0.0.1: GET /.netlify/functions/soundcloud-likes-scraper-background
◈ Queueing background function soundcloud-likes-scraper-background for execution
Response with status 202 in 2 ms.
Opening browser...
{"level":"error","message":"End - Error:"}
{"errorMessage":"Navigation failed because browser has disconnected!","errorType":"Error","level":"error","stackTrace":["/Users/wyvren/Documents/code/solar-beats-react/built-lambda/soundcloud-likes-scraper-background.js:6:555916","/Users/wyvren/Documents/code/solar-beats-react/built-lambda/soundcloud-likes-scraper-background.js:6:808554","Array.map (<anonymous>)","Object.emit (/Users/wyvren/Documents/code/solar-beats-react/built-lambda/soundcloud-likes-scraper-background.js:6:808546)","l.emit (/Users/wyvren/Documents/code/solar-beats-react/built-lambda/soundcloud-likes-scraper-background.js:6:286661)","l._onClosed (/Users/wyvren/Documents/code/solar-beats-react/built-lambda/soundcloud-likes-scraper-background.js:6:294297)","d._onClose (/Users/wyvren/Documents/code/solar-beats-react/built-lambda/soundcloud-likes-scraper-background.js:6:292775)","D.<anonymous> (/Users/wyvren/Documents/code/solar-beats-react/built-lambda/soundcloud-likes-scraper-background.js:6:663974)","D.d (/Users/wyvren/Documents/code/solar-beats-react/built-lambda/soundcloud-likes-scraper-background.js:8:89842)","D.emit (node:events:394:28)"]}
◈ Error during background function soundcloud-likes-scraper-background execution: Error: Navigation failed because browser has disconnected!

I thought this might be an issue with the background function, so I created a test function called webscrape-test.js. It looks like this:

const chromium = require('chrome-aws-lambda')
const puppeteer = require('puppeteer-core')

export async function handler(event, context, callback) {

    let executablePath = await chromium.executablePath;

    const browser = await puppeteer.launch({
        args: chromium.args,
        executablePath: process.env.CHROME_EXECUTABLE_PATH || await chromium.executablePath,
        headless: true
    });
    
    const page = await browser.newPage();

    console.log("Opening browser...");

    await page.goto('https://soundcloud.com/shay-leon-2/likes');

    await browser.close();

    return {
        statusCode: 200,
        body: JSON.stringify({
            status: 'Ok'
        })
    }
}

This is basically just the browser launch code from my soundcloud webscraper, but it results in this error:

Error: ENOENT: no such file or directory, open '/bin/swiftshader.tar.br'

I looked into this error and it seems like it’s an issue with chrome-aws-lambda not being able to locate the binaries ( or some file dependencies ) to properly launch chrome. However, it’s at this point where I’m stuck because I’m not sure how to get this file to load properly in Netlify.

Apologies for the long post, but any help / insight would be greatly appreciated.

I think my next step will be to look into webpack, but I thought I’d create this post first before diving into that. Thanks for all your help so far!

7

Hey @wilhsie,

If only file inclusion is going to fix your issue, this might help: