最近一個vue項目用到百度圖片識別api,涉及到跨域問題,找了一個nginx的解決方案。html
配置以下:vue
server { listen 80; server_name localhost; location / { root C:\git\youseniu\ops\dist; index index.html; } error_page 500 502 503 504 /50x.html; location = /50x.html { root html; } location /baiduapi { rewrite ; proxy_pass https://aip.baidubce.com; } }
- 由配置信息可知,咱們讓nginx監聽localhost的80端口,網站A與網站B的訪問都是通過localhost的80端口進行訪問。
- 咱們特殊配置了一個「/baiduapi」目錄的訪問,而且對url執行了重寫,最後使以「/baiduapi」開頭的地址都轉到「https://aip.baidubce.com」進行處理。
- rewrite ^/baiduapi(.)$ /$1 break; 表明重寫攔截進來的請求,而且只能對域名後邊以「/baiduapi」開頭的起做用,例如http://localhost/baiduapi/rest/2.0/ocr/v1/business_license?access_token=24.72ebec102414,rewriter到https://aip.baidubce.com/rest/2.0/ocr/v1/business_license?access_token=24.72ebec102414。只對/apis重寫。rewrite後面的參數是一個簡單的正則 ^/baiduapi(.)$ ,$1表明正則中的第一個(),$2表明第二個()的值,以此類推。break表明匹配一個以後中止匹配。