Buffer is not defined ERR!

[baotran310702]

ReferenceError: Buffer is not defined at Tokens.buildHeader (payjp.js?v=dd4fb741:1074:28) at Tokens.request (payjp.js?v=dd4fb741:1090:43) at Tokens.create (payjp.js?v=dd4fb741:1436:21)

I meet this bug when try calling PayJP createToken, so is there any way to fix it? Or trying to copy a node_modules buffer to this package. Tks I tried npm i buffer either npm install buffer (anything else like --save dev...) but it's not working. Thanks all for reading it. I hope i will receive any supports soon.

[TraLeeee]

@baotran310702 Their's no method name createToken() in payjp package for node. You mean .createToken() for PayJP JS? If that what you mean, then you have to give us more information about your context (your code btw?).

[baotran310702]

This is my code, if you need more i will show you more information, i am working with vue3 with typescript.

This is my package.json file { "name": "xxxxxxxxxx", "version": "0.0.1", "private": true, "scripts": { "dev": "vite", "build": "run-p type-check build-only", "preview": "vite preview", "build-only": "vite build", "type-check": "vue-tsc --noEmit -p tsconfig.json", "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore", "format": "prettier --write src/" }, "dependencies": { "@element-plus/icons-vue": "^2.1.0", "@fortawesome/vue-fontawesome": "^3.0.8", "axios": "^1.6.2", "browserify-zlib": "^0.2.0", "buffer": "^6.0.3", "cors": "^2.8.5", "element-plus": "^2.3.8", "events": "^3.3.0", "lodash": "^4.17.21", "payjp": "^2.2.3", "pinia": "^2.1.3", "process": "^0.11.10", "qrcode.vue": "^3.4.1", "sass": "^1.64.1", "sass-loader": "^13.3.2", "stream-browserify": "^3.0.0", "util": "^0.12.5", "vee-validate": "^4.11.1", "vue": "^3.4.28", "vue-i18n": "^9.2.2", "vue-i18n-lite": "^1.0.2", "vue-router": "^4.3.2", "vue-toast-notification": "^3.1.2", "yup": "^1.2.0" }, "devDependencies": { "@rushstack/eslint-patch": "^1.2.0", "@tsconfig/node18": "^2.0.1", "@types/node": "^18.16.17", "@vitejs/plugin-vue": "^4.2.3", "@vitejs/plugin-vue-jsx": "^3.0.1", "@vue/eslint-config-prettier": "^7.1.0", "@vue/eslint-config-typescript": "^11.0.3", "@vue/tsconfig": "^0.4.0", "eslint": "^8.39.0", "eslint-plugin-vue": "^9.11.0", "npm-run-all": "^4.1.5", "prettier": "^2.8.8", "typescript": "~5.0.4", "vite": "^4.3.9", "vue-tsc": "^1.6.5" } }

[baotran310702]

Thanks for supporting me, hope to receive your anwser soon!

[TraLeeee]

@baotran310702 You are using payjp package the wrong way. You shouldn't use payjp package for nodejs in frontend side source code. Your SPA client only need to create token and send that token to backend server, right? So instead of install payjp package, you have to manually load the PayJP JS script (Which is https://js.pay.jp/v2/ script) on the vue page init.

Remember: Never store your PAYJP Secret Key on Vue client side!

[baotran310702]

Oh, thanks, i am using it in frontend side because of testing this package and i found it it npmjs page. I am currently testing this package, so is it able to use that package instead of loading it as script. It will be more clearly with my code and more flexible using it. And thanks for your reminder.

[TraLeeee]

@baotran310702 If you're using it for the client side, then you can take a look at this article. Using the PayJP package on npmjs is not a good idea for an Vue client :thinking:

[baotran310702]

Oh, I see, thank a lot for supporting me.