Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
    paul van bladel
    @paulvanbladel

    // === DEFAULT / CUSTOM STYLE ===
    // WARNING! always comment out ONE of the two require() calls below.
    // 1. use next line to activate CUSTOM STYLE (./src/themes)
    // require(./themes/app.${__THEME}.styl)
    // 2. or, use next line to activate DEFAULT QUASAR STYLE
    require(quasar/dist/quasar.${__THEME}.css)
    // ==============================

    import Vue from 'vue'
    import Quasar from 'quasar'
    import router from './router'
    import vuelidate from 'vuelidate'
    import VueResource from 'vue-resource'
    import VueAuthenticate from 'vue-authenticate'
    Vue.use(Quasar) // Install Quasar Framework
    Vue.use(vuelidate)

    // TODO use axios instead of vueresource
    Vue.use(VueResource)

    // TODO move to separate file
    Vue.use(VueAuthenticate, {
    baseUrl: 'http://localhost:8080',
    providers: {
    oauth2: {
    name: 'oauth2',
    url: 'Token/Exchange',

      authorizationEndpoint: 'http://localhost:5000/connect/authorize', // if this ends with slash --> game over
    
      redirectUri: window.location.origin || window.location.protocol + '//' + window.location.host,
      scope: ['profile', 'openid', 'PanelButlerApi'],
      responseParams: {
        code: 'code',
        clientId: 'clientId',
        redirectUri: 'redirectUri'
      },
      responseType: 'code',
      // responseParams: {
      //   code: 'code',
      //   token: 'access_token',
      //   state: 'state',
      //   sessionState: 'session_state',
      //   clientId: 'clientId',
      //   redirectUri: 'redirectUri'
      // },
    
      scopePrefix: '',
      scopeDelimiter: ' ',
      // defaultUrlParams: ['client_id', 'scope', 'response_type', 'redirect_uri', 'state', 'nonce'],
      defaultUrlParams: ['response_type', 'client_id', 'redirect_uri'],
    
      requiredUrlParams: ['scope', 'nonce'],
      optionalUrlParams: ['display', 'state'],
      state: function () {
        var val = ((Date.now() + Math.random()) * Math.random()).toString().replace('.', '')
        return encodeURIComponent(val)
      },
      display: 'popup',
      oauthType: '2.0',
      clientId: 'PanelButlerVueJs',
    
      nonce: function () {
        var val = ((Date.now() + Math.random()) * Math.random()).toString().replace('.', '')
        return encodeURIComponent(val)
      },
      popupOptions: { width: 452, height: 633 }
    }

    }
    })
    Quasar.start(() => {
    / eslint-disable no-new /
    new Vue({
    el: '#q-app',
    router,
    render: h => h(require('./App'))
    })
    })

    Davor Grubelić
    @dgrubelic
    so, you are saying that authenticate is ok and you get token stored in local storage, right?
    paul van bladel
    @paulvanbladel

    yes indeed, and this is how I make call to api:

    <template>
    <!-- root node required -->
    <div>
    <!-- your content -->
    <div class="layout-padding">
    <div>Identity</div>
    <pre>{{identityData }}</pre>
    </div>
    </div>
    </template>

    <script>
    export default {
    data () {
    return {
    identityData: {}
    }
    },
    created () {
    let url = '/api/Identity'

    // let token = this.$auth.getToken()
    debugger
    this.$http
    // .get(url, {headers: {'Authorization': 'Bearer ' + token}})
    .get(url)
    .then(response => { this.identityData = response.data })
    }

    }
    </script>

    <style>

    </style>

    Davor Grubelić
    @dgrubelic
    that means that response interceptor is working since this is the way library collects token during auth proces
    paul van bladel
    @paulvanbladel
    so when I comment out //let token = .. and add the header manually everything works perfect.
    yes but the request interceptor fails :)
    Davor Grubelić
    @dgrubelic
    thanks for reporting this, i'll see to investigate this issue later today. Can't really make time right now...
    paul van bladel
    @paulvanbladel
    Sure, I'm already very thankful for what you did during this conversation. I'll jump also into your code . We'll speak later. Enjoy the weekend.
    Davor Grubelić
    @dgrubelic
    thx, u 2 :)
    vejja
    @vejja
    Hi guys, joining here on the interceptor subject. @dgrubelic thanks a lot for your library. This is exactly what we need for SSO with Vue. Awesome.
    vejja
    @vejja
    I am wondering whether this is an issue that comes from vue-resource itself
    pagekit/vue-resource#532
    pagekit/vue-resource#621
    Davor Grubelić
    @dgrubelic
    I'm thinking that this is the problem with interceptors being called on VueResource (this.$http) instance, rather than Vue.http object.
    for that reason, i plan to remove vue-resource as a default library and leave up to whoever wants to use it
    Davor Grubelić
    @dgrubelic
    And that is very stupid issue. Imho, why wouldn't you be able to dynamically assign interceptors once in runtime.
    Nati323
    @Nati323
    Hi, someone here?
    I have a problem with vue-auth
    Miljko Miljkovic
    @miljko1984
    Zdravo Davore,
    Jesi mozda jos aktivan ovdje? Trebala bih mi pomoc oko twitter login-a... Ako imas mozda neki primjer kako da to odradim bio bih ti jako zahvalan!
    Pozdrav
    Davor Grubelić
    @dgrubelic
    Pozdrav Miljko, jesam, tu sam.. bio sam na GO zadnjih par tjedana...
    hey @Nati323 , sorry for delayed response.. i was on a vacation..
    @miljko1984 ako hoćeš, javi mi se na DM, ovdje ćemo pričati isključivo eng jezik :)
    MangirdasKazlauskas
    @MangirdasKazlauskas
    Hey guys, can anyone paste the code for vue.app of facebook login using axios? The problem for me: as mentioned in documentation, I've overwritten bindRequestInterceptor and bindResponseInterceptor, and the request which goes to the baseUrl is a very long code and I have no idea what to do with it :/
    p.s. yes, I've read about facebook login flow in Facebook login documentation, but maybe there is an easier way?
    mkdesign82
    @mkdesign82
    Hi guys, I'm wondering how authenticate to facebook account using vue-authenticate, it says you need app id ?
    Davor Grubelić
    @dgrubelic
    Hey @mkdesign82
    Yes, you'll need to create facebook app in your FB developers dashboard
    Hi @MangirdasKazlauskas
    You can check out example app i built here: https://github.com/dgrubelic/vue-authenticate-site
    Oh, i just realized i haven't published API for that app..
    i can paste you code for FB auth
    This is how API code for FB auth looks like...
    var config = require('../../config.json');
    var Axios = require('axios')
    
    module.exports = function (req, res, next) {
      Axios.post('https://graph.facebook.com/v2.4/oauth/access_token', {
        client_id: config.auth.facebook.clientId,
        client_secret: config.auth.facebook.clientSecret,
        code: req.body.code,
        redirect_uri: req.body.redirectUri
      }, { 'Content-Type': 'application/json' }).then(function (response) {
        var responseJson = response.data
        res.json(responseJson)
      }).catch(function (err) {
        res.status(500).json(err)
      })
    }
    norotico
    @norotico
    hello @dgrubelic and others. I'm trying to implement linkedin auth. I managed to get the request interceptors working for axios, but I'm not sure what to do after that. I do get an object with clientId, code, redirectUri and state, but the auth fails for some reason (the promise ends up in the catch block).
    Davor Grubelić
    @dgrubelic
    Hi @norotico , i just released new version of vue-authenticate, v1.3.0 which has axios as a default request library.. give it a try.
    Juan Marval
    @guamacherox
    Hey there guys, what happened with the vue-authenticate-site repository? i'm getting 404.
    Davor Grubelić
    @dgrubelic
    I temporarily put it in private mode since there were a lot of requests for change and inquires for help with implementation. Currently i don't have time for maintaining two repos (due to active work on main library repo)
    Davor Grubelić
    @dgrubelic
    Unfortunately, i had to do this since, but i plan to publish it live again as soon as i make some time to implement needed changes
    Juan Marval
    @guamacherox
    is understandable... thank you Davor.
    Алексей Данчин
    @Aleksey-Danchin
    bindRequestInterceptor and bindResponseInterceptor really necessary?
    In server side I have koa with koa-passport, and succeed authentication return ctx.body = {success: true} to client. Needed more? Needed token?
    Алексей Данчин
    @Aleksey-Danchin
    What do ctx.login(user)?
    Алексей Данчин
    @Aleksey-Danchin
    All session data in cookies? 0_o
    Davor Grubelić
    @dgrubelic
    binding request interceptors are introduced so you can use any library for handling requests like vue-resource or axios
    this is because they handle headers differently
    this library is made for JWT based authentication systems. This means that you need to return authentication token to the client app. That token will then be send to your application api in each request
    @Aleksey-Danchin what does this mean: > What do ctx.login(user) ?
    Same question is for All session data in cookies? 0_o - JWT is stored in either localStorage, sessionStorage or in app memory. Custom made cookieStorage is yet to be released in some future version.
    SeoRoman
    @SeoRoman
    Following the guide on installation with Vuex, it states.... VueAuthenaticate.factory is not a function