search

websanova / vue-auth

A simple light-weight authentication library for Vue.js
MIT License
2.36k stars 380 forks source link

Router auth issue path is undefined #136

Closed kyoukhana closed 7 years ago

kyoukhana commented 7 years ago

So I upgraded to vue 2.x but I am getting path is undefined. Not sure if its a auth issue or not. 

import Vue from 'vue'
import VueResource from 'vue-resource'
import VueRouter from 'vue-router'
import auth from '@websanova/vue-auth'
import * as App from './components/app.vue'
import mdl from 'material-design-lite'
import VueMdl from 'vue-mdl'
import VueX from 'vuex'
import axios from 'axios'
import VueAxios from 'vue-axios'
import vdropzone from 'vue2-dropzone'
import VueScollTo from 'vue-scrollto'
import VueLazyload from 'vue-lazyload'
import VeeValidate from 'vee-validate';
import VueQr from 'v-qrcode';

Vue.use(VueRouter);
Vue.use(VueResource);
Vue.use(VeeValidate);
Vue.use(VueMdl);
Vue.use(VueAxios, axios);
Vue.use(VueScollTo);

Vue.use(VueLazyload, {
    preLoad: 1.3,
    error: '/images/loose/loader-error.svg',
    loading: '/images/loose/loader.svg',
    attempt: 5,
    listenEvents: [ 'scroll' ]
})

// register custom select
Vue.component('select-c', require('./components/custom/select.vue'));

/*Register Dropzone */
//Vue.component('dropzone', require('./components/custom/dropzone.vue'))

Vue.router = new VueRouter({mode: 'history'}); /*Must be declared before using vue auth */

//let domainUrl='//www.devqi.com';
let domainUrl='http://restorechi.com';

/*
 Custom Driver for vue-auth
 */

var myBaerer = {

    request: function (req, token) {
        this.options.http._setHeaders.call(this, req, {Authorization: 'Bearer ' + token});
    },

    response: function (res) {
        var headers = this.options.http._getHeaders.call(this, res),
            token = headers.Authorization || headers.authorization;

        if (token) {
            token = token.split(/Bearer\:?\s?/i);

            //Vue.axios.defaults.baseURL = domainUrl;
            Vue.axios.defaults.headers.common.Authorization = token ? `Bearer ${token}` : '';

            return token[token.length > 1 ? 1 : 0].trim();
        }
    }
};

/*vue-jwt-auth options */

// const vrouter = new VueRouter({
//     routes: [{ path: '*',meta: {auth: false},name:'signp', component: (resolve) => { require(['./components/views/error.vue'], resolve)} }]
// });

const vrouter = new VueRouter({
    routes: [
        { path: '*',name:'signp', component: (resolve) => { require(['./components/views/error.vue'], resolve)} },
        { path: '404',name:'signp', component: (resolve) => { require(['./components/views/users/login.vue'], resolve)} },
        { path: '/', name:'home', component: (resolve) => { require(['./components/views/home.vue'], resolve)} },
        { path: ':referral',name:'about', component: (resolve) => { require(['./components/views/home.vue'], resolve)} },
        { path: 'signupplan',name:'about', component: (resolve) => { require(['./components/views/singupplans.vue'], resolve)} },
        { path: 'faq',name:'faq', component: (resolve) => { require(['./components/views/faq.vue'], resolve)} },
        { path: 'contact',name:'contact', component: (resolve) => { require(['./components/views/contact.vue'], resolve)} },
        { path: 'privacy',name:'privacy', component: (resolve) => { require(['./components/views/privacy.vue'], resolve)} },
        { path: 'terms',name:'terms', component: (resolve) => { require(['./components/views/terms.vue'], resolve)} },
        { path: 'signupplan/:referral',name:'supplan', component: (resolve) => { require(['./components/views/singupplans.vue'], resolve)} },
        { path: 'signup', component: (resolve) => { require(['./components/views/users/signinup.vue'], resolve)} },
        { path: 'signup/:referral',name:'signp', component: (resolve) => { require(['./components/views/users/signinup.vue'], resolve)} },
        { path: 'yinyangadmin/login',name:'signp',meta: {auth: false}, component: (resolve) => { require(['./components/views/admin/login.vue'], resolve)}},
        {path: 'yinyangadmin/dashboard',name:"dashboardadmin",meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/dashboard.vue'], resolve)},

            children: [
                { path: 'yinyangadmin/dashboard',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/dashboardHome.vue'], resolve)} },
                { path: 'users',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/users/users.vue'], resolve)},

                    children:[
                        { path: 'yinyangadmin/dashboard',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/users/usersHome.vue'], resolve)}},
                        { path: 'users/profile/:userid',name:'accountlanding',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/users/accounthome.vue'], resolve)}},
                        { path: 'add',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/users/add.vue'], resolve)}},
                        { path: 'edit:userid',name:"edituser",meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/users/edit.vue'], resolve)}},
                        { path: 'list',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/users/list.vue'], resolve)}},
                    ]

                },
            ],

            children: [
                { path: 'account',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/account/accounts.vue'], resolve)} },
                {
                   children:[
                        {path: 'account',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/account/accounthome.vue'], resolve)}},
                        {path: 'payment',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/account/payment.vue'], resolve)}},
                        {path: 'profile',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/account/profile.vue'], resolve)}}
                    ]

                }
            ],

            children: [
                { path: 'account',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/account/accounts.vue'], resolve)} },
                {
                    children:[
                        {path: 'account',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/account/accounthome.vue'], resolve)}},
                        {path: 'payment',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/account/payment.vue'], resolve)}},
                        {path: 'profile',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/account/profile.vue'], resolve)}}
                    ]

                }
            ],

            children: [
                { path: 'tracks',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/tracks/tracks.vue'], resolve)} },
                {
                    children:[
                        {path: 'track',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/tracks/tracksHome.vue'], resolve)}},
                        {path: 'add',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/tracks/add.vue'], resolve)}},
                        {path: 'tracks/edit/:trackid', name:'edittrack', meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/tracks/edit.vue'], resolve)}},
                        {path: 'list',meta: {auth: ["1","2"]}, component: (resolve) => { require(['./components/views/admin/tracks/list.vue'], resolve)}},
                    ]

                }
            ]

        },

        { path: 'usr/login/',name:'login', component: (resolve) => { require(['./components/views/users/login.vue'], resolve)} },
        { path: 'login/', component: (resolve) => { require(['./components/views/users/login.vue'], resolve)} },
        { path: 'usr/login/forgot', name:'forgot', component: (resolve) => { require(['./components/views/users/forgot.vue'], resolve)} },
        { path: 'usr/login/reset/:etkn', name:'resettoken', component: (resolve) => { require(['./components/views/users/reset.vue'], resolve)} },
        { path: 'usr/activate/:etkn', name:'useractivate', component: (resolve) => { require(['./components/views/users/activateuser.vue'], resolve)} },
        {path: 'usr/dashboard',name:'dashuser', meta: {auth: true}, component: (resolve) => { require(['./components/views/users/dashboard/dashboard.vue'], resolve)},
            children: [
                {path: 'usr/dashboard',meta: {auth: true}, component: (resolve) => { require(['./components/views/users/dashboard/dashboardHome.vue'], resolve)}},
                {path: 'inviteuser',meta: {auth: true}, component: (resolve) => { require(['./components/views/users/invite/invite.vue'], resolve)}},
                {path: 'myaccount',meta: {auth: true}, component: (resolve) => { require(['./components/views/users/account/accounts.vue'], resolve)},
                    children:[
                        {path: 'myaccount',meta: {auth: true}, component: (resolve) => { require(['./components/views/users/account/accounthome.vue'], resolve)}},
                        {path: 'profile',meta: {auth: true}, component: (resolve) => { require(['./components/views/users/account/profile.vue'], resolve)}}
                    ]

                },

                { path: 'tracks', component: (resolve) => { require(['./components/views/users/tracks/tracks.vue'], resolve)},
                    children: [
                        {path: 'tracks',meta: {auth: true}, component: (resolve) => { require(['./components/views/users/tracks/tracksHome.vue'], resolve)}},
                        {path: 'terms/:trackid',  name:'termstrack',meta: {auth: true}, component: (resolve) => { require(['./components/views/users/tracks/terms.vue'], resolve)}},
                        {path: 'play/:trackid',  name:'playtrack',meta: {auth: true}, component: (resolve) => { require(['./components/views/users/tracks/play.vue'], resolve)}},
                        {path: 'list', meta: {auth: true}, component: (resolve) => { require(['./components/views/users/tracks/list.vue'], resolve)}},
                    ]

                }

            ]

        } /*End User dashboard */

    ]
});

/*CRFC TOKEN For form validations */
Vue.http.headers.common['X-CSRF-TOKEN'] = document.querySelector('#token').getAttribute('content');

//Vue.http.options.root="";

var authOptions = {
    authRedirect:'/',
    auth: require('@websanova/vue-auth/drivers/auth/bearer.js'),
    http: require('@websanova/vue-auth/drivers/http/vue-resource.1.x.js'),
    router: require('@websanova/vue-auth/drivers/router/vue-router.2.x.js'),
    token: [{request: 'token', response: 'token', authType: 'bearer', foundIn: 'header'}],
    tokenName:'token',
    loginData: {url: 'api/auth', method: 'POST', redirect: 'dashboard'},
    logoutData: {url: 'api/logout', method: 'POST', redirect: 'login',  makeRequest: false},
    fetchData: {url: 'api/account', method: 'GET' , authType: 'bearer'},
    refreshData: {enabled: false},
    rolesVar: 'role_id'
};

Vue.use(require('@websanova/vue-auth'),authOptions);

const app = new Vue({ vrouter, el: '#app' });

Here is a list of all my installed libraries.

{
  "private": true,
  "dependencies": {
    "@websanova/vue-auth": "^2.8.2-beta",
    "axios": "^0.15.3",
    "babel-core": "^6.24.1",
    "babel-eslint": "^7.2.1",
    "babel-loader": "^6.4.1",
    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-stage-2": "^6.24.1",
    "bootstrap-sass": "^3.3.7",
    "css-loader": "^0.23.0",
    "dropzone": "^4.3.0",
    "file-loader": "^0.9.0",
    "gulp": "^3.9.1",
    "image-webpack-loader": "^3.3.0",
    "jimp": "^0.2.27",
    "jquery": "^3.1.0",
    "laravel-elixir": "^6.0.0-9",
    "laravel-elixir-vue-2": "^0.2.0",
    "laravel-elixir-webpack-official": "^1.0.2",
    "lodash": "^4.16.2",
    "material-design-lite": "^1.3.0",
    "path": "^0.12.7",
    "responsive-loader": "^0.7.0",
    "style-loader": "^0.13.0",
    "svg-url-loader": "^1.1.0",
    "url-loader": "^0.5.8",
    "v-qrcode": "^1.0.3",
    "vee-validate": "^1.0.0-beta.10",
    "vue": "^2.2.6",
    "vue-axios": "^1.2.2",
    "vue-hot-reload-api": "^2.0.11",
    "vue-html-loader": "1.2.3",
    "vue-lazyload": "^1.0.3",
    "vue-loader": "^11.3.4",
    "vue-mdl": "^1.1.1",
    "vue-progressbar": "^0.7.1",
    "vue-resource": "^1.2.1",
    "vue-router": "^2.4.0",
    "vue-scrollto": "^2.4.2",
    "vue-strap": "^1.0.11",
    "vue-style-loader": "^1.0.0",
    "vue-template-compiler": "^2.2.6",
    "vue2-dropzone": "^2.2.5",
    "vuelidate": "^0.2.0",
    "vuex": "^2.3.0",
    "webpack": "^2.3.3",
    "webpack-dev-server": "^1.16.1"
  },
  "devDependencies": {
    "autoprefixer-loader": "^3.2.0",
    "babel-core": "^6.17.0",
    "babel-loader": "^6.2.5",
    "babel-preset-es2015": "^6.16.0",
    "image-webpack-loader": "^3.2.0",
    "srcset-loader": "^2.0.1"
  },
  "scripts": {
    "build": "webpack --config webpack.config.prod.js"
  }
}
websanova commented 7 years ago

Lol, seems messy. How about disclose and conquer and comment some things out ;)

On Apr 16, 2017 06:05, "kyoukhana" notifications@github.com wrote:

Closed #136 https://github.com/websanova/vue-auth/issues/136.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/websanova/vue-auth/issues/136#event-1044225110, or mute the thread https://github.com/notifications/unsubscribe-auth/ABkcy4oOTwx8yjzfnXrL11LdVYDJm2drks5rwU1GgaJpZM4M-YBZ .

kyoukhana commented 7 years ago

This needs to be re-written. For now as long as I can get working I will be re-writing it for sure