0

我正在 NuxtJS 中创建一个应用程序，我集成了 Auth0 依赖项，我可以建立连接！但我希望我的应用程序与内部 API 进行通信，以从 MongoDB 数据库中检索用户数据。为了安全地执行此操作，我想将 JWT 令牌作为参数传递以验证用户的身份。问题是，通过遵循关于该主题的 Auth0 文档，我找到了一个函数this.$auth.strategy.token，但它返回未定义，因此该函数this.$auth.strategy.token.get()也不起作用：/。这是我的配置文件

package.json 文件：

{
  "name": "journal-web",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "dev": "nuxt",
    "build": "nuxt build",
    "start": "nuxt start",
    "generate": "nuxt generate",
    "test": "jest",
    "format": "prettier --write .",
    "lint": "eslint -c ./.eslintrc . --fix"
  },
  "dependencies": {
    "@nuxtjs/auth": "^4.9.1",
    "@nuxtjs/axios": "^5.13.1",
    "@nuxtjs/vuetify": "^1.11.3",
    "cookie-universal-nuxt": "^2.1.4",
    "core-js": "^3.9.1",
    "net": "^1.0.2",
    "nuxt": "^2.15.3",
    "tls": "^0.0.1"
  },
  "devDependencies": {
    "@nuxtjs/eslint-config": "^6.0.0",
    "@vue/test-utils": "^1.1.3",
    "babel-core": "7.0.0-bridge.0",
    "babel-jest": "^26.6.3",
    "eslint": "^7.24.0",
    "eslint-config-prettier": "^8.1.0",
    "eslint-plugin-prettier": "^3.3.1",
    "jest": "^26.6.3",
    "prettier": "^2.2.1",
    "vue-jest": "^3.0.4"
  }
}

nuxt.config.js：

import colors from 'vuetify/es5/util/colors'

export default {
  // Global page headers: https://go.nuxtjs.dev/config-head
  head: {
    titleTemplate: '%s - Journal Web',
    title: 'Journal Web',
    htmlAttrs: {
      lang: 'fr'
    },
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: '' }
    ],
    link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }]
  },

  // Global CSS: https://go.nuxtjs.dev/config-css
  css: [],

  // Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
  plugins: [],

  // Auto import components: https://go.nuxtjs.dev/config-components
  components: true,

  // Modules for dev and build (recommended): https://go.nuxtjs.dev/config-modules
  buildModules: [
    // https://go.nuxtjs.dev/vuetify
    '@nuxtjs/vuetify'
  ],

  // Modules: https://go.nuxtjs.dev/config-modules
  modules: [
    // https://go.nuxtjs.dev/axios
    '@nuxtjs/axios',
    '@nuxtjs/auth',
    'cookie-universal-nuxt',
  ],
  auth: {
    redirect: {
      login: '/', // redirect user when not connected
      callback: '/auth/signed-in'
    },
    strategies: {
      local: false,
      auth0: {
        domain: process.env.AUTH0_DOMAIN,
        client_id: process.env.AUTH0_CLIENT_ID,
        logoutRedirectUri: 'http://localhost:3000',
        responseType: 'code',
        grantType: 'authorization_code'
      }
    }
  },

  // Axios module configuration: https://go.nuxtjs.dev/config-axios
  axios: {},

  // Vuetify module configuration: https://go.nuxtjs.dev/config-vuetify
  vuetify: {
    customVariables: ['~/assets/variables.scss'],
    theme: {
      dark: false,
      themes: {
        dark: {
          primary: colors.blue.darken2,
          accent: colors.grey.darken3,
          secondary: colors.amber.darken3,
          info: colors.teal.lighten1,
          warning: colors.amber.base,
          error: colors.deepOrange.accent4,
          success: colors.green.accent3
        }
      }
    }
  },

  // Build Configuration: https://go.nuxtjs.dev/config-build
  build: {},
  target: 'server',
  ssr: true
}

如果有人有解决方案，那将非常有帮助！

4

0 回答 0