[Vuejs]-JWT authentication between Django and Vue.js

-2👍

This is something that I’ve used with laravel, but the principle should be the same.

I’ve placed vue-cli generated code into the subfolder frontend.

This is trimmed content of the file vue.config.js, which you need to add manually to the vue-cli project root.

const path = require('path')

/*
  vue-cli is initialized in project subfolder `frontend`
  and I run `npm run build` in that sub folder
 */
module.exports = {
  outputDir: path.resolve(__dirname, '../public/'),
  /*
    https://cli.vuejs.org/config/#outputdir
    !!! WARNING !!! target directory content will be removed before building
    where js, css and the rest will be placed
   */
  assetsDir: 'assets/',
  /*
    Where `public/index.html` should be written
    - this is example for the laravel, but you can change as needed
    - .blade.php is laravel template that's served trough laravel.
      So you could inject JWT into `index.html`
    - Check https://cli.vuejs.org/guide/html-and-static-assets.html
       for the syntax before adding values
   */
  indexPath: path.resolve(__dirname, '../resources/views/index.blade.php'),
  devServer: {
    host: '0.0.0.0',
    port: 8021,
    proxy: {
      /*
        Proxy calls from
        localhost:8021/api (frontend)
        localhost:8020/api (backend)
       */
      '/api': {
        target: 'http://localhost:8020',
        changeOrigin: true,
      }
    }
  }

};

Leave a comment