1. 程式人生 > >通過vue dev和nginx反向代理實現跨域

通過vue dev和nginx反向代理實現跨域

一、在vue的開發環境中跨域

1、在config目錄找到index.js檔案
2、這裡寫圖片描述
如圖配置,比如使用百度翻譯api,那麼這樣寫的實際使用等於訪問

yarn run dev之後在位址列輸入
http://localhost:8080/api?from=zh&to=jp&query=愛&simple_means_flag=3
相當於http://fanyi.baidu.com/v2transapi/api?from=zh&to=jp&query=愛&simple_means_flag=3

二、在生產環境中跨域

設定nginx配置檔案:

location /api {
        add_header 'Access-Control-Allow-Origin'
'*'; proxy_pass http://fanyi.baidu.com/v2transapi; }

程式碼不用變,結果ok,