令牌的 Nuxt 身份驗證參數

Question

伙計們！ 目前我在發送令牌請求時遇到問題。 我正在使用 nuxtJS @nuxtjs/auth-next模塊。 它工作得很好，但我遇到了不發送client_secret的問題。 此授權請求轉至AZURE AD 。 我的配置：

msalAzure: {
    scheme: 'oauth2',
    endpoints: {
      authorization: `${process.env.VUE_APP_AZURE_AUTHORITY}/oauth2/v2.0/authorize`,
      token: `${process.env.VUE_APP_AZURE_AUTHORITY}/oauth2/v2.0/token`,
    },
    token: {
      property: 'access_token',
      type: 'Bearer',
      maxAge: 1800,
      global: true,
    },
    refreshToken: {
      property: 'refresh_token',
      maxAge: 60 * 60 * 24 * 30,
    },
    responseType: 'code',
    responseMode: 'query',
    grantType: 'authorization_code',
    accessType: 'offline',
    // ******** change this for your Application (Client) ID ********
    redirectUri: process.env.VUE_APP_AZURE_REDIRECT_URI,
    clientId: process.env.VUE_APP_AZURE_AD_CLIENT_ID,
    clientSecret: process.env.VUE_APP_AZURE_SECRET,
    codeChallengeMethod: 'S256',
    scope: ['offline_access', 'openid', 'profile', 'User.Read'],
    autoLogout: false,
  },

我需要粘貼client_secret的令牌有效負載：

code: 0.AS8AovV86_Vz5UuO2sAmSstunkCOoPABwrREiFppI0jDAkwvAMU.AgABAAIAAAD--DLA3VO7QrddgJg7WevrAgDs_wQA9P9iCom2SEms5Su-Au0Vl3-GG9W1y4OUDaCIF0y4xmd9H4TIFgNmGW0K425Ji9zN2xAKf6VaQ6q8EiBI9AXdNv8DqZMCDTs9qWBETVF2JftuXIeazYEu-eqmqkNMAp0arJ9Mf7GAnrWHCa5wDYpwXNCI9tQ7nqmuHzp3aRjldsN77_5bq1eqgq7PvU5KaNGmxmkYe96_Xzeqqu-9FlJGpNlJ6y8J1BZtW4wVlRrOn6-n1aIFqOcAGp00kR53uiWExjAIZMdPIdjW8BgD2O6ZY8l_779ArkGrUT6zYEjs_YRb7yg2EqgqnL7ZVBVhoufAxbtsRiGbtvA5_Usp4rPf5Bxft3evNPCYA33PWsJUNSOiq4PeOFfpPHjlA7zwkouwfXnmrswONQatNl8xM3BQuduwf1mAszZQKl-skR9-XlvPxj66aGpdl3_hzIqWCqSbSbmIK0e40-Ob4r7XuNb1qoy7opbJfDp1FmTl6WHRexEE1RPBw_XER7kb6kBrXYnTaYPxHuIcVZeYdYS58o_8kMwVVO-qsTb1N7RyT52DgiHB22yUNZaPwpyB6k1wr9hSbhPT6jkIMbuud__EHrmvRVqQaTY1CHAVG8H1wd3CKJCWTFR9sajos17VybxJ4VT_r7ySRUH2UQarOU0ooTlyO32P7iBO5K9CU3V4XrRAQCiVfIMNcbcU1WWlF_eTkEX9bXnHN6houQtLhVndm8y1XIJ21_qh4pVB3wpm0HrXXSGdYgvrM2Td7zx6EZPKK1CmJMgnEii5w1U09occn-CLHLBZAv6_vE8hNCS3VqN20YAvO2vhiLYalS4JmNHG3Z4CVuJ3K7fz5B23kA
client_id: f0a08e40-c201-44b4-885a-692348c3024c
redirect_uri: http://localhost:8005/login/submit/
response_type: code
audience: 
grant_type: authorization_code 

發送策略請求（此參數僅用於授權）：

@click="$auth.loginWith('msalAzure', { params: { client_secret: process.env.VUE_APP_AZURE_SECRET,},})"

謝謝您的幫助！

Answer 1

您無法在客戶端訪問您的process.env.VUE_APP_AZURE_SECRET 。 動作點擊和事件觸發是客戶端。

請嘗試使用Public Runtime Config進行公共運行時配置 - 客戶端和服務器都可以使用 $config 訪問此對象的值。

在nuxt.config.js

publicRuntimeConfig: {
  azureClientSecret: process.env.VUE_APP_AZURE_SECRET
}

然后，您可以通過在您的代碼中訪問$config.azureClientSecret來使用此值，如下所示：

@click="$auth.loginWith('msalAzure', { params: { client_secret: $config.azureClientSecret,},})"

但我認為你應該避免把你的密鑰放在客戶端。