鍍金池/ 問(wèn)答/數(shù)據(jù)庫(kù)  HTML/ vue項(xiàng)目訪問(wèn)后臺(tái)接口跨域問(wèn)題

vue項(xiàng)目訪問(wèn)后臺(tái)接口跨域問(wèn)題

問(wèn)題描述

vue項(xiàng)目 axios請(qǐng)求后臺(tái)接口,用webpack代理解決跨域問(wèn)題,報(bào)404

問(wèn)題出現(xiàn)的環(huán)境背景及自己嘗試過(guò)哪些方法

vue項(xiàng)目基于 vue-admin-tempalte搭建
webpack 4.x
vue 2.0

相關(guān)代碼

// 請(qǐng)把代碼文本粘貼到下方(請(qǐng)勿用圖片代替代碼)
config/index.js文件

proxyTable: {
    '/api': {
        target: 'http://127.0.0.1:9000',
        pathRewrite: {'^/api' : ''}
    }
}

config/dev.env.js文件
(此文件為模板寫(xiě)法,用vue-admin-tempalte的小伙伴可參考,此問(wèn)題中可忽略)

module.exports = merge(prodEnv, {
    NODE_ENV: '"development"',
    BASE_API: '"/"'
})

api請(qǐng)求文件

export function fetchList() {
    return request({
        url: '/api/deeplearning/test',
        method: 'get'
    })
}

實(shí)際看到的錯(cuò)誤信息又是什么?

從api請(qǐng)求中可以看到,url為 /api/deeplearning/test,通過(guò)proxyTable設(shè)置可以完成代理轉(zhuǎn)發(fā),
將去掉前綴 /api 從而重寫(xiě)url,目前在瀏覽器中F12看到的請(qǐng)求 為
http://localhost:8080/deeplearning/test/,8080是我的vue項(xiàng)目端口,其中已經(jīng)過(guò)濾掉了/api,說(shuō)明已經(jīng)走了proxyTable配置,但是依然報(bào) 404,而后端接口可以正常訪問(wèn),
訪問(wèn)地址為http://127.0.0.1:9000/deeplearning/test/,現(xiàn)在疑問(wèn)有:
1.在這種已經(jīng)實(shí)現(xiàn)url重寫(xiě)的情況下還可能是代理配置的問(wèn)題嗎?
2.如果代理配置沒(méi)問(wèn)題,那么該如何定位這個(gè)問(wèn)題呢,是否和axios有關(guān)?

期待感謝大家解惑 !

回答
編輯回答
幼梔

你和后臺(tái)是一個(gè)局域網(wǎng)的話,先ping一下他的ip,看看通不通,再把你那個(gè)請(qǐng)求的路徑放到瀏覽器直接打開(kāi),報(bào)405接口是通的,跨域是他后臺(tái)沒(méi)有設(shè)置請(qǐng)求頭,報(bào)403是網(wǎng)關(guān)沒(méi)穿透,需后臺(tái)設(shè)置,還報(bào)404的話是他的ip根本不通,配置完代理記得重啟項(xiàng)目

2017年6月7日 20:42
編輯回答
吃藕丑

配置代理 重新run dev一下 好吧

2017年10月21日 14:22