Non-issue - Question

[kevinabouhanna]

Heya Michael,

You have one of the coolest portfolio websites.

I'm really interested in that spotify widget that shows the currently playing song, but I could not for the life of me figure out where you are getting SPOTIFY_REFRESH_TOKEN.

I'm trying to implement it in my own portfolio and would awesomely appreciate your help!

Thank You!

[mah51]

Hi kevin,

Thank you!

I can't actually remember how I did it specifically, but I found this https://documenter.getpostman.com/view/583/spotify-playlist-generator/2MtDWP and if you follow the setup the environment section i think it shows you how to get your refresh token using postman. Then all you have to do is save it under the variable SPOTIFY_REFRESH_TOKEN in the .env file.

Good luck and if you need any more help just comment here :).

Michael

[orangemn6]

@mah51, I was wondering how I could setup this site. I keep getting errors when deploying with vercel. Hope you can help. Thanks!

[mah51]

Yeah of course. What errors do you seem to be getting?

[orangemn6]

@mah51 The spotify api, and all the backend.

[mah51]

Have you filled out a .env file? I have just committed a .env.example file which will show the required variables to get the backend working. You need a refresh token etc to make the spotify backend work.

[karthikvinayan]

@mah51 But wouldn't making such an .env file publicly available expose the API keys?

[mah51]

If you commit a .env file to a public repo then yes (my .env.example doesn't have real values it just shows the keys you need to fill out), however this should only be used for your development environment and if you want it to work on vercel you go and fill out the env variables on the dashboard under project settings. Using the Key / values from the .env file.

Don't commit your .env file to a public repo

[karthikvinayan]

I thought of the same way too. Thanks for the reply @mah51

[orangemn6]

@mah51 I'm getting this error on vercel deploy

Error occurred prerendering page "/spotify". Read more: https://nextjs.org/docs/messages/prerender-error
--
10:41:26.628 | FetchError: invalid json response body at https://vercel.com/login?next=%2Fdeployments%2Fportfolio-v5-real-or7cio91c-orangemn6.vercel.app%3Fhost%3Dportfolio-v5-real-or7cio91c-orangemn6.vercel.app%26redirect%3D1%26section%3D reason: Unexpected token < in JSON at position 0
10:41:26.629 | at /vercel/path0/node_modules/node-fetch/lib/index.js:272:32
10:41:26.629 | at processTicksAndRejections (internal/process/task_queues.js:95:5)
10:41:26.629 | at async getStaticProps (/vercel/path0/.next/server/pages/spotify.js:436:16)
10:41:26.632 | at async renderToHTML (/vercel/path0/node_modules/next/dist/server/render.js:329:24)
10:41:26.633 | at async /vercel/path0/node_modules/next/dist/export/worker.js:273:36
10:41:26.633 | at async Span.traceAsyncFn (/vercel/path0/node_modules/next/dist/telemetry/trace/trace.js:60:20)
10:41:26.682 | info  - Generating static pages (8/11)
10:41:27.726 | info  - Generating static pages (11/11)
10:41:27.729 |  
10:41:27.729 | > Build error occurred
10:41:27.731 | Error: Export encountered errors on following paths:
10:41:27.731 | /spotify
10:41:27.732 | at /vercel/path0/node_modules/next/dist/export/index.js:487:19
10:41:27.732 | at runMicrotasks (<anonymous>)
10:41:27.732 | at processTicksAndRejections (internal/process/task_queues.js:95:5)
10:41:27.733 | at async Span.traceAsyncFn (/vercel/path0/node_modules/next/dist/telemetry/trace/trace.js:60:20)
10:41:27.733 | at async /vercel/path0/node_modules/next/dist/build/index.js:833:17
10:41:27.733 | at async Span.traceAsyncFn (/vercel/path0/node_modules/next/dist/telemetry/trace/trace.js:60:20)
10:41:27.734 | at async /vercel/path0/node_modules/next/dist/build/index.js:707:13
10:41:27.734 | at async Span.traceAsyncFn (/vercel/path0/node_modules/next/dist/telemetry/trace/trace.js:60:20)
10:41:27.734 | at async Object.build [as default] (/vercel/path0/node_modules/next/dist/build/index.js:77:25)
10:41:27.790 | Error: Command "npm run build" exited with 1

[mah51]

Hi @orangemn6 I am going to move this to another issue so everyone doesnt get notification spammed 😆 this is now assigned to issue #24.