2017-07-17 128 views
1

因此,我正在使用Vue CLI在我的mac上使用webpack-dev-server開發vue.js本地站點。我想使用Vue Resource從我的後端獲取託管在流浪虛擬機(local.dev)上的數據。我想在我的配置添加代理/ index.js文件中像這樣:WebPack&Vue.js代理虛擬機不能正常工作

proxyTable: { 
    '/pf': { 
    target: 'local.dev/portfolioVue/public', 
    secure: false, 
    changeOrigin: true, 
    pathRewrite: { 
     '^/pf': '' 
    } 
    } 
}, 

然後我就裝在SRC/App.vue

mounted() { 
this.$http.get('/pf').then(response => { 
    console.log('tutu'); 
}, response => { 
    console.log('erreur'); 
}) 

}

在添加了這個功能SRC/main.js我說:

Vue.http.headers.common['Access-Control-Allow-Origin'] = 'local.dev/portfolioVue/public'; 
Vue.http.headers.common['Access-Control-Request-Method'] = 'GET'; 

這是對https://laracasts.com/discuss/channels/vue/cors-and-vuejs?page=1

發現個

但現在我得到這些錯誤

Refused to set unsafe header "Access-Control-Request-Method" 


XMLHttpRequest cannot load http://local.dev/portfolioVue/public/. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:9080' is therefore not allowed access. 

我symply試圖讓一個PHP文件(公開/ index.php文件)返回的Json

<?php echo json_encode('tutu') ?> 

可它是一個probleme在VM配置?

在此先感謝您的幫助

+0

應該不正確的屬性名稱'proxy',而不是'proxyTable'? https://webpack.js.org/configuration/dev-server/#devserver-proxy我會強烈建議採取一個配置示例,並複製粘貼一個來看看實際發生的事情。像這些'pfVue_2.0'這樣的名字也不是一個好主意。 –

+0

感謝您的幫助。 但現在我得到這個錯誤 '''XMLHttpRequest無法加載http://local.dev/portfolioVue/public/。對預檢請求的響應不會通過訪問控制檢查:請求的資源上不存在「訪問控制 - 允許來源」標頭。原因'http:// localhost:9080'因此不被允許訪問。 ''' 我不知道如何讓acces工作... –

+0

這是一個CORS問題。基本上你不允許默認從一個域到另一個域的XHR請求。我不熟悉Webpack的代理屬性,但我猜測它可以通過調整你的配置來修復。這可能是一個好的開始:https://webpack.github.io/docs/webpack-dev-server.html#proxying-local-virtual-hosts可能會更新您的問題,以顯示您嘗試過的配置。 –

回答