Axios拦截器只在页面重新加载后工作

时间:2018-05-27 15:33:35

标签: vue.js vuejs2 axios

当用户登录我的应用程序时,我正在尝试在所有请求中发送 @Grapes( @Grab(group='org.codehaus.groovy.modules.http-builder', module='http-builder', version='0.7') ) import groovy.json.JsonOutput import groovy.json.internal.LazyMap import groovy.transform.ToString import groovyx.net.http.HTTPBuilder import static groovyx.net.http.ContentType.JSON import static groovyx.net.http.Method.POST HTTPBuilder http = new HTTPBuilder() Forechart forechart = new Forechart(dayInterval: 3, adultCount: 1, childCount: 0, flightList: [new Flight(departureStation: "WAW", arrivalStation: "CRL", date: new Date(2018, 06, 02)) ,new Flight(departureStation: "CRL", arrivalStation: "WAW", date: new Date(2018, 10, 26))]) def jsonRequest = JsonOutput.toJson( forechart ) LazyMap jsonResponse //BEGIN REST invocation println "Request: " + JsonOutput.prettyPrint(jsonRequest) long start = System.nanoTime() http.request( 'https://be.wizzair.com/7.15/Api/asset/farechart', POST, JSON ) { req -> body = jsonRequest headers.Accept = 'application/json' response.success = { resp, json -> assert resp.statusLine.statusCode == 200 jsonResponse = json } response.'404' = { println 'Not found' } } long end = System.nanoTime() - start //println "Response: $jsonResponse" println "\nDuration: " + end / 1_000_000_000 + " seconds" //END REST invocation ForechartFlights forechartFlights = new ForechartFlights(jsonResponse) //Data Objects @ToString(includePackage = false) class Forechart { boolean wdc List<Flight> flightList int dayInterval int adultCount int childCount boolean isRescueFare } @ToString(includePackage = false) class Flight { String departureStation String arrivalStation Date date } //response @ToString(includePackage = false) class ForechartFlights { List<ForechartFlight> outboundFlights List<ForechartFlight> returnFlights } @ToString(includePackage = false) class ForechartFlight { String departureStation String arrivalStation String priceType String classOfService boolean hasMacFlight Date date Price price; } @ToString(includePackage = false) class Price { BigDecimal amount String currencyCode } 标头。

但是,无论我做什么,它都行不通。

这是我的Authorization实例和拦截器代码。

axios

在我的模块中,我正在导入像这样的import axios from 'axios' import storage from '@/services/storageService' const user = storage.getObject('currentUser') export const http = axios.create({ baseURL: 'http://localhost/api', }) http.interceptors.request.use((config) => { if(user){ console.log(user) config.headers.Authorization = user.token } return config }, (err) => { console.log(err) return Promise.reject(err) }) 实例

http

因此,澄清一下,上面的代码可行,但我的请求中没有标题。

要让import { http } from '@/http' export const getItems = () => { return http.get('items').then( response => response.data) } 正常工作,我需要强制重新加载页面

任何人都知道如何避免这种情况?

1 个答案:

答案 0 :(得分:0)

我在@ jacky的提示之后解决了我的问题。现在我的代码运行如下。

import axios from 'axios'
import storage from '@/services/storageService'

export const http = axios.create({
    baseURL: 'http://localhost/api',
})

http.interceptors.request.use((config) => {
    let user = storage.getObject('currentUser')
    if(user){
        console.log(user)
        config.headers.Authorization = user.token
    }
    return config
}, (err) => {
    console.log(err)
    return Promise.reject(err)
})