Cannot get the correct token from browser to get userinfo call

I’m developing application with NextJS and AWS HTTP API GW as api GW.
I want to create api closed for unauthorized users.
I’ve created HTTP API Gateway on AWS wiht JWT auth, and I’ve successfully created API and app on auth0.

Now, I’m truing to test JWT Auth on API GW and it successfully tested with the token I’v got manually from /oauth/token link.

Now, I’m truing to get the same result, using JWT token from cookie(to be sure that everything is going to work correctly), from the developer console, to be sure that it’ll work correctly, but I stuck with the “Unauthorized” error calling the API.

The error description says that:
Bearer realm=“Users”, error=“invalid_token”, error_description=“The access token signature could not be validated. A common cause of this is requesting multiple audiences for an access token signed with HS256, as that signature scheme requires only a single recipient for its security. Please change your API to employ RS256 if you wish to have multiple audiences for your access tokens”

But I have RS256 as signing method both on API and App.
Here is a request from the browser
изображение

Here is a token example from cookie:

eyJhbGciOiJkaXIiLCJlbmMiOiJBMjU2R0NNIiwidWF0IjoxNzEyNjQ2NjczLCJpYXQiOjE3MTI2NDY2NzMsImV4cCI6MTcxMjczMzA3M30..IwCP0OlIl4VCl3Y6.NJZT9BfURAwDv2SpfcNONXxdhVYWPSCsmZtx-Nma3hAVi6FF4Qm6dwjxD7GKnKH5Gq-QBhn5pCCr191AADSmt-JuSKtic-U0RfdfPghV1fjyzZUyMnwd4ENvRIQLacKz_TzeH7kQonaZ4MFrAvKylAndeDPuwjBVUCwZrtIqVTXgJA_8RVWaEkuTrTpePpzO-jvbypeOJyf1wAgeOqjeV7z7TAzk6LhPLIprPL1qPnFBa0CwcOPeo5ZGc1E8mdK4VDz2UzU892bOfyAV5P7tEm2dnkaxvkLaQoks804MKgFGKRuih5qWg5zEylBiYb3Ps9FMPR76Hw0FaENi_okvZ76H-8pXHH0w1E6hxlO0Xc6PmUEqLpUv1VTcUo9neIPnnGZx6U4kCec1-TNJMquLGrIfLSl9WhYrXvsiYqEPoaHNLw94Z-bxjQd_BjEtXVjfokwdY0-qedWYCFbNXAp-XI5S4kQk6a9NSuj-jo4QZYoC0XTbQOS35BUpUHxYT9s6fvAxaKMTzbpr8vJ0jGU_XzQkjn4UkA9oExCoPzY3G1dUTlOPCFxIp5WOZnFaYxYkQ0C76wETFcHlu_ZJ7KZCLRV6fjlscdMyWe__4SM2NP97OThmOyNoGIY8FFUAJnk7_uTQWnPH3DMTSlAEEGbbeFf9VWQE_wxcZxD0Ltur_FbpMT1Aybr4fiSCX3LlT8RMg38joBNTJAIY82D_K-p4u-XYw4WaKWOV-nfPBtz2z9XM3cl2prevEggOwHaDgzjhvmizQn9lGVQzIBAKzTtOToInZA_kUtSDfaEpOay4NRPaQ0BD4lPrg4D1K4qZCnAr1Nkgl9rqFLIEi1nnTZK7IpFoqhg_3_ywsrsLL5hiazhDz2I3DScEwx4HzFeUkOCA_6EWHin3F1jo6g9Kvyc3hsOe6kxZAdnGREhkoFvO-5ulWufKyXxanToCS4D4op0-kF8l5H6m3Q_Sna0sE3XjJTHBd3RSFzKNMEuMfN4fBu70DHJg9oD2kKeJpIOTotktFkZ4a7Az59SSNuf_A7jZcsQadteH7NhBfWNLaXVvv4vI7HD356eEBoOjhK0GB4C77jkwIKxF8L_i5kBPEs8LBvaEXwhL2MEptWmJX7ZhRS-DBwILt3hBA2aEQiKydgi3r3n6E-ZaO9--odls31VkpjC8QhPUTc-0nMo9IFGRSJnJv6q-5y_NcEOTRblleWakIaCTKxWw4DOTvewLonzMpvzoi2kYrl1bK1Dvl1mAQUA-G8wBv8wST3dICf24M21h8HYEre5b4OhwqjxdFw6r4s1TZpUkwjJmWAfciEjA-MQlnA-EJe2Q0SJ6zQtMmr5u2ZYXX8-eEbgZmTKGO_ePY99G1WfuLyXukhX_LLnZYTzxCaHDCo4uxwW4GoiYFTeCzlV_sy2s6dhSC_UMTco6djU3gIDdHBUGZdwd1zk4-jKCqVGQR-a4IeaKYiIsX4etZwlwr9i5qkgsmRUEKH0GIvzRN5IzxVB9TYtJvuqUMlBJ9I7_mc51AhHlvoAGVZG7vx9kzFatXQXpuavy-8VaJuAP9WwBkcQZnH2OFhhiWNTwlE-cYOqmjDO1AYabomMOk533t1z3IQNkzw-VfeW7sWqHtZCBAYZXvaLQ2KB3NqBGyqsdEHUnlMtymX-ZQmpe8y7ej5RW9UO0c1XGvwLsvazOg3RbXFYUBxmQCEt_tc9F20Jmkj_TWg-E-YbrDP9_9doPrUPpMJnfeb8rxlZFKtRZqCmgh-XuYBcjtfccBesExmLprW13ZHxp0ge54MquOjKm-ydiBmViTxn-1E8K6wTaFH47lUF-yz64V86N86mTnHNoTDmg8CNNz0DtFNPohbd5NoF8imbJUB2_Zz1mnnsN_ccxQGYheLECBL4OcSh1qoYxjbXn1oqfvRqZWpjI3m1jr_icld3pl9PDnALhYljwDta7KEdAJiRvOMPQRgb0HLn7GGx7Oe1m5nKxFunjc-_xliV_Mlb6wd1jRKwtJ7sHsynEd_dQI6uQKONEF9hMt8s0E9oQXrKkAdS4tc46_vh_HMnN_rQ7Vg-LCED9mbP-VikA7ZKaogJiawV6kIruyaKDk4l53aYvmtHyRRwOMeZ9hL0wdNqsBfOgPrfYJB-7-8OS-f3pbB0zpn9ICfpmWawLPxubOcsoKWV8I_RqWD8BQOyDABK9HNbxfa4JOdhdclwTrYeFZSv0FZp7T0ynBfJfRH_ZbbcrgCxDNLJmQakuYOkCXs8eizcUryib62OIqXRfFdu0U9jESXJ5mxcVUarNCBMvvilRYep5oEyl8A1WPgKXrPtFTm5HtJym8JXTf5bdkFFI5ejBkW8qEVDbqAi11UdvHf5yqvkYQIa3BdpS0_jh69tv1y982Ip-QjTlNYwrJkTmyhJlsNHcmHUAjJMlU5fIs7LJpUAyaQmIV01X1D3w40vnwN5gNfV-RJ19cQx5LrVBx0zn1vIWOTs_iFoskZQHrM-4UMxE7_nzxyODGSMBjuOEzIpqbH7FwY1BvgxlIb93M1XTjgIQ1itgp-USwJ4YNJGctpF52W2jwM1bivGXbX-W_ypFpnCUYR97QOrek7rroRT6xbGoybY2W4PRZSZdxueExmXJ77EgDHdpMOHU7AkWLmAmp_2hqy5CvYS0f6xl17F3Q1yWcKdGtzLXZYrwBdHKW4mQcUOuTVYP1imBav91tyx_a8YJ_vWWNjLv1eGsvMcTjsh-qP49SiGzK4Eh3h-R4Gql4ENS6hPNizgboP-_wWBI08v5fOB6n_MnTtWXgvOoiWQ0SyJpidwPw2AkTRD9ba2VZX2kHFX5G7QJ__3Oxnju1ruLZ-dtyE5iWZ4VFdjbf1aEygStLFl6_n9EuWJMomg5uP7N7FwvZVWZy4-kWH9zAQ2JBbRUKXA987qF-ABYtjUw8mymsCLnI63dKkkKb6sa9H-1GJZmOuxOgHblg6-38oiu2uFvXSETRWAQI2Az7iGCWfHJIioo-9EfVHdNpVuo_DNxXSBwHbFRncnVKnyGfC5vgOlagO5XahUikKCKGckcAxrJG6h0T-VeqjgRIbKb_wMJz8na7NVa7QJOZwGd4GqL16O0mSaVLF0GaeJqc5-r8F0d5XpmzjdefVQSFaQIA3BwauXCFdC_VMV0WyWPE-WqHpyBx2LEVuYy3eLRIFfT8-VRsd9PZDskdDSo3aWYHuCWAkqQFbAo-C62nlW8AKPMCFr5JA.7x_NoRHgqGDxS6gEO6IFzQ

It seems that I don’t understand something with tokens. Can somebody help me with that.

Hey there @iktychinin! Welcome to the Auth0 Community.

I’m happy to help you with the issue you’re experiencing. It sounds like you’ve already authenticated into your app but are having issues authorizing access to your API gateway because there are multiple audiences.

If that’s the case, you should set your API gateway as your audience which allows you to implement a single authorization flow. Then you control access to each API behind the gateway using scopes.

Here’s an article that gives more detail on implementation.

To address your question about getting the correct token from the browser:

I put the token you provided in jwt.io to try and get some answers, but it returns an invalid signature error using both RS256 & HS256 algo’s which leads me to believe you’re not pulling the correct value. I’d need to see where you got this token from to further help.

2 Likes

Hi @kiah.imani, thanks for the help!

You’re right!

I have a problem with JWT token from developer console from Firefox while testing it with my API and with you api /userinfo.
I have no problem with manually obtained token from /oauth/token link call.

Also I use one audience parameter, as you can see on a screenshot from an original post.

I have only one API GW and only one audience.
изображение
Here is a screenshot of a initial login request. There is only one audience parameter.

Thanks, I’ll read that, for better understanding.

I got the token from cookie, from developer console:
изображение

The token:

eyJhbGciOiJkaXIiLCJlbmMiOiJBMjU2R0NNIiwidWF0IjoxNzEyNzQwMjEzLCJpYXQiOjE3MTI3NDAyMTMsImV4cCI6MTcxMjgyNjYxM30..Jr-8VJHSk-jILlBR.TYsfBSkGAaGRWXumiaW_nJrnGDDJLuWYyx9owyw1Rdg1y_ulPYux_UMxVkBOfP9CgO6VWewxlitXzc-quqHAzFgLhArsz3wH9BFe92GRpl1ghfgLvj9cfuE3Tm6KeAnIh6h7oflieq76Fg26D1bbJPOWoo8cEEofWH9W7uWnnstmU1C24wmHBV0JXw55EgydVJkQ77M1NUxHv4maeC2t4VBo-7ZWJ-OO9BPayVZ63ClSVhkqEQHaD7JdJfMz7SZY7zmBAnXY7OPQNqTL_iosTLdIUiNcj8wLne9Y7E4NRhxksN1Qo-6A5_G_Ss_5_DGC0pu0cQpT-b4evNqDJRiCDedPaZ6Bh_DrxxuAoqa3FR9vYJ_KoHSLkLPz-nTVadB6baMUZ0t820ovcQoqPotHPJhU_Veh_U7W4JLoh2Kjkj25XP5Z4EgxeQqcQjDIa35kpWOmB4_oNwjYTIte1Kumvb6NjZCpaB6Ha-RCSi7STfFbrxZfTC12FuTnsqu2o35B3MVw_-lEJf-fcJ6C6j_UuHXmA7_xlG-eX8Fytus-bz342ZEF2iIp5J9FwupfMgzXfUVtfrp0o7FTd-G5Ghs99Fc_Kn_a_hDGE4RbbGtobhZadfRBeX9ZV0-XL9U5ovofhGOw3qeV4NqGt6XHGPbNgeXqHzEqk8ZwQyRALfr6CW21Tmgn6Jw-Mz-XM0UP605IGyC0v5WFV_geYAFdsIkZ_d2xHcnb3pSOTwlKU_T-UC5I_uuP2ir-7utVx0KCBRQ26voFKS_7nVqlBl-nI4euxRNGAv0zo77n0s_MYW_GQZ_fKbyT_x_SGOjGv0fuMVZaHgElD0ANFeV3ln4ImbYdnwTNct7n6a_GXFeJIUIVUX0vvVSLeLWXfIVCvQBy80dN7QJGy9D3UynIte4qKiSMqwOqvLf_dBlnYReL78HNM_Ak2DHHnFkYSeMVfxnfSws4hh1V9zGtFlrRMGegEYbUUJzp4-1Adf4wKd6bffBGPYQaGtEbelSOggclS9mrRjpZstDFQ71jTdXbfDJ9kZiHRN9v297_kZ4E9Yh1smQL3vi5AK1bAcDvp5d3GKedr8M5ZNeriLudGg0kTuW66lKe7Dceku7VcJFHUu3byuBgSP66gwr01bvMWCxDHZp-rRl-74H05SO6hyHmx1GcTxBRQmmNAlBt8bRFYeq5dloo5jQ7vussdaA_fx4l-Xgroei9wk3Be16qHEUh_mHNhbILm512g6Qdy9qi2FBn7PHsLf-M3Hc46xfKhXTq1MjgTZTm6y7D9YPKhUnLY9-_7CjOISp1yOn6FOV8bVaBn-Awl1Wls7zJHcF87FxG0Px4pWX58iYNhbl7qffEouB9OT-BcgEXmqgrb6wPy-4xCtDSGk8qkmJwtx_hwgHITyY13KEnhdHHr1PlKktMhCw92jpu8rPt9U6fS7EtsFuIuD065lJoEoAcCYS6202b5uYmSbtMur80CMGC0k_tIIi_GJ2G1W7hXjcofecEezswamap90e38BDB1JHeFCLjoU6x8KmR2pPJDfAhIPW1g3rRu1HGj5vq5K4BOsay1upCr9yh3AbTKojapNcNjJyErDbKWBosby2kzvs7cKDSc3AIHTBIP7ZsCbtmnM5zllYh8hYF4J4zdrQTzR4tnNds_IyEmTo66kgzWPd7SZRaobT2Y4YY6Uxhp0B72L5PZWTgz-E5ZO60yrWUS1fHd11AN29QTX7bCOhF5pbL3d1xvPkY99nvxU8BrKNBRbhif89qQB1_ZGTwbuSWcwbWROy1UoLYbtneEMyg3xUToG_vTkrkz014fkrhALB0nRpFeeRV5vgbh2Zq5hbQhMeeqvrcWXodn8DO8BKcxJnCbq4jzqNrBdYWsTxzS1npc0xFWfd49Z5pr0JXmwvvEVni8nD6S8TgfZor6zflkmf3bO3on57N4Lo8b_HugAUbWoco50qayVz0TWR80IZHeLo7cC-CQjVpNDOsIYOeCErK18Ioi_IOmSJjqyfG0n625pPjoa6SJgguwLd8xL37D7OE_kVzhq9N-JKNrFT0Oq-q2Yih1J6RJ_giKZl6m78EqJ_pFlsRsKGn04PTttJmqjquh9vrZARsmzrDkNYO5AJ3jB5Wla9rM9WqkpMocjZ_ILqkMvGRslfOkI9iSutyp6fYPYoS1dTiMCuKCbd080LG6_L14RbEyoBFMk0FLcA4uQDhGi0MWCGMlL1efbg_scV5lSpmLO19Adh3i3rIM2AZlTE-eIpsZ7d7MLhXNkUY9S2-KPseb1sVuQCK9smMuj1ggdN7oxX8zPp5okg8z42r8PKU99HpbW-VZD8Ffen5RAgPisFTQ3OiM_fKrOme32qBmDdIeHR-pxFMAtaZkt-yVbo5gFicf8xBJwJjsu7J_M394RiHpbh6wIghB6v75cERSZlK3z_P_HsZ61s_fzTpF2PgbnMk4RlgAJj62UgL-Ybu4sXaKbuwCjGZ_D4258s9nHSdQf7teS7sIgUx7OpmBzwHbaD1oy3oQ4f9YVaQxw1Q7g1mvYzWg9xlFq7hqFFOuG0X87aJn6etXPF1h1VIbCai0gOIZz_k1ZqUi626s_2Bkw03kIrzU0zI1zTetmCYwi6A4DgMz8AYCq86VaO9nlsu28HYKNdPQW6g_VY9yTS7lYuYNQ_rRSZDUOBRa6iiOL26uIoFtXhdgfLak2I_4wRDTS8od1jWJ5Gbfvlv3LY21pSJNTrcTqUULuVv8Y0NCQ9mmXIJLxkanyEqg0Hieh-0Azq2X5FT4yE03kl02bS-uf9ZLK-TIC6mNCaa8Y62Pzxuu1groI3iJjXWpZpNI1OGBKXGuS-QI2Updlpfhmu8wHbvQBrC4objuY2yhRfWOEbUE2p5cfN3Wm6nCeXOkbyvur_ARa4KaIOGoimE1vNWd5mm4gL0ZTHR9Cvtc5r6_UQiz9H2nDz7yUTgb8dO1rYnILjGxRFFuC-SIa4EMPRc2SPU6tOSlBHk7nG8ky6HgNBJTMDAzJ8R-e838a3LUB9de5GKBg-2_uIgs6CbIzhTuIDj3xx245q-PzH4rNUNJq2gl5fxc0z23d6h9D6CmdUlTtwKqf8Y8By1SkLOCpjLlXp-5iBYaZ4hGPKaziAl2XLe3JtsMXvGtyn7MdDEETNzjuRcl3z97eTJTKkbhdv1eCnUhuLD8kjktx4bvC-YOd4HvXIvdyAIinQ6LaOsQ7z_21wuq1s6oeilmnwcmYQWOPGnP9coIU9a3lVa9H7auvrEK0-QODjOiy5lB-_TRIh4oZZk48yjOb2KhrB6cywrx5omQpRF.4jfgZidNsAMwH6BOYGkiTA

Then, when I’m truing to use this token with the /userinfo call I have unauthorised response:

The same problem will be with this token while calling the API

Hi @iktychinin, ok I ran this issue by a colleague and here’s what we came up with.

It appears that the scope that you’re sending read:shows is not a valid scope for the /userinfo endpoint. Here’s an example for how to set the audience when using the Next.js SDK: nextjs-auth0/EXAMPLES.md at main · auth0/nextjs-auth0 · GitHub

Let me know if this helps.

1 Like

Hi, @kiah.imani
Thank you for your answer.

Unfortunately, the solution doesn’t help.

The request:
изображение

I still see the same error.
Unauthorized with
Bearer realm="Users", error="invalid_token", error_description="The access token signature could not be validated. A common cause of this is requesting multiple audiences for an access token signed with HS256, as that signature scheme requires only a single recipient for its security. Please change your API to employ RS256 if you wish to have multiple audiences for your access tokens"

I’m pretty sure that the last part of a problem is linked with encryption of the token. Either I have to change it somehow, or It’s linked with the way I obtain this token (from the developer console of the web browser). But I have no idea how to move on with these issues.

Hi @iktychinin!

I’ve escalated this query to another team for a solution for you. The reason why that token isn’t working is because the NextJS SDK is stateful, and behaves like a classical web-app. The tokens are not exposed to the frontend by default.

Do you plan to do server-side rendering?

Hi @kiah.imani, thanks again for the comment!

Does that mean that I the backend will get different token from that call? Cause I need to call an API with working JWT.

I don’t have any plans for server side rendering.
I need to call the backend API with JWT authorizer and get the user info from /userinfo API.