Buffer.alloc is not a function (Node.js func inside Browser context issue)

torgeadelin commented 1 year ago

Problem:

It seems that the library doesn't really work with Vite? I'm trying to a setup encryption decryption class in one of my apps, and I'm getting weird errors in the browser after initialising the code.

Locally I'm getting

build_cryptographic_materials_cache_key_helpers.ts:15 Uncaught TypeError: Buffer.alloc is not a function
    at build_cryptographic_materials_cache_key_helpers.ts:15:28
(anonymous) @ build_cryptographic_materials_cache_key_helpers.ts:15

I've also tried creating a Codesandbox to quickly reproduce the issue: https://codesandbox.io/p/sandbox/flamboyant-kowalevski-cmgymq

But it seems we're getting a different error.

Both errors are linked to using Node packages inside the Browser context (which doesn't work). I think some of the dependencies of this package import those and thus it fails.

Solution:

I'm not sure

Out of scope:

Someone else had this issue but posted the issue in the wrong place: https://crypto.stackexchange.com/questions/106579/issue-with-aws-encryption-sdk-for-javascript-in-browser-buffer-is-not-defined

Local project details:

{
  "name": "patch-my-week",
  "private": true,
  "version": "0.0.0",
  "scripts": {
    "dev": "vite",
    "build": "tsc && vite build",
    "preview": "vite preview",
    "generate:component": "plop --cwd ./config/plop --dest ."
  },
  "dependencies": {
    "@aws-amplify/ui-components": "^1.9.6",
    "@aws-crypto/client-browser": "^4.0.0",
    "@radix-ui/react-popover": "0.1.6",
    "@radix-ui/react-progress": "^0.1.4",
    "@react-aria/interactions": "^3.10.0",
    "@react-aria/menu": "^3.10.0",
    "@react-stately/collections": "^3.9.0",
    "@react-stately/tree": "^3.7.0",
    "@reduxjs/toolkit": "^1.9.3",
    "@tippyjs/react": "^4.2.6",
    "@types/luxon": "^2.3.2",
    "aws-amplify": "^4.3.27",
    "classnames": "^2.3.1",
    "formik": "^2.2.9",
    "framer-motion": "^6.4.3",
    "lodash": "^4.17.21",
    "phosphor-react": "^1.4.1",
    "react": "^18.0.0",
    "react-dom": "^18.0.0",
    "react-redux": "^8.0.5",
    "react-router-dom": "6",
    "react-toastify": "^9.0.5",
    "styled-components": "^5.3.5",
    "styled-system": "^5.1.5",
    "yup": "^0.32.11"
  },
  "devDependencies": {
    "@babel/eslint-parser": "^7.18.2",
    "@honkhonk/vite-plugin-svgr": "^1.1.0",
    "@redux-devtools/core": "^3.13.1",
    "@types/eslint": "^8.4.5",
    "@types/lodash": "^4.14.182",
    "@types/react": "^18.0.0",
    "@types/react-dom": "^18.0.0",
    "@types/styled-components": "^5.1.25",
    "@types/styled-system": "^5.1.15",
    "@typescript-eslint/eslint-plugin": "^5.30.5",
    "@typescript-eslint/parser": "^5.30.5",
    "@vitejs/plugin-react": "^1.3.0",
    "eslint": "^8.19.0",
    "eslint-config-airbnb": "^19.0.4",
    "eslint-config-prettier": "^8.5.0",
    "eslint-import-resolver-typescript": "^3.2.4",
    "eslint-plugin-import": "^2.25.3",
    "eslint-plugin-jsx-a11y": "^6.5.1",
    "eslint-plugin-prettier": "^4.2.1",
    "eslint-plugin-react": "^7.28.0",
    "eslint-plugin-react-hooks": "^4.3.0",
    "luxon": "^2.4.0",
    "plop": "^3.1.1",
    "prettier": "^2.7.1",
    "sass": "^1.53.0",
    "typescript": "^4.6.3",
    "vite": "^2.9.9",
    "vite-plugin-eslint": "^1.6.1",
    "vite-plugin-svgr": "^2.2.0"
  }
}

ShubhamChaturvedi7 commented 1 year ago

Hi torgeadelin, We don't explicitly support Vite. But if you can give us the bare minimum setup of your code repo (a Zip file perhaps) required to reproduce the error along with instructions, we can try to check if the issue is on our end.

torgeadelin commented 1 year ago

I've already provided a codesandbox, does that not work? Here's the link again https://codesandbox.io/p/sandbox/flamboyant-kowalevski-cmgymq @ShubhamChaturvedi7

texastony commented 1 year ago

@torgeadelin We would be willing to look at Zip with instructions to reproduce the error. No one on the team is familiar with CodeSandbox, and we would rather use our normal tooling to debug the issue.

(I tried to download the repo from CodeSandbox, but the download to Zip UI kept crashing/failed to download anything.)

aws / aws-encryption-sdk-javascript