nginx转发请求中的域名和参数-逐码极客

使用场景

前端使用SPA等node服务开发时，往往会出现请求第三方服务器资源，比如请求百度地图API。这时就会出现跨域。

案例：实际项目中需要请求百度API

http://api.map.baidu.com/place/v2/search

参数名	参数含义	类型	示例	是否必须
query	检索关键字。行政区划区域检索不支持多关键字检索。
如果需要按POI分类进行检索，请将分类通过query参数进行设置，如query=美食	string(45)	天安门、美食	必选
region	检索行政区划区域（增加区域内数据召回权重，如需严格限制召回数据在区域内，请搭配使用city_limit参数），可输入行政区划名或对应cityCode	string(50)	北京、131（北京的code）、海淀区、全国，等	必选
ak	开发者的访问密钥，必填项。v2之前该属性为key。	string(50)		必选
output	输出格式为JSON或者XML	string(50)	JSON或XML	可选

那么请求该接口必然跨域。原先通过 nginx 手动增加 location 拦截请求，实现代理转发。现在思考有没有方法动态实现，请求的域名和参数全部由前端传递，nginx动态转发

解决方案

转发域名和参数

http: {
  // 增加resolver，否则前端请求出现502
  resolver 202.102.134.68 114.114.114.114 valid=5 ipv6=off;

  // 拦截前端请求的路径
  location ~/bridge/v1 {
    if ($query_string ~*  ^(.*)url=(.*)$){
      set $imageUrl $2;
      proxy_pass $imageUrl;
    }

    // or
    set $upstream_host $http_upstream_host;
    proxy_pass http://$upstream_host;
  }
}

resolver 的文章 nginx中的resolver语法解释

示例：

// 前端异步请求
axios
  .get(`/bridge/v1?url=http://api.map.baidu.com/place/v2/search?query=${queryString}&region=全国&ak=${this.$yapi.config.apikey.baiduMapAk}&output=json`)
  .then((res) => {
     // 成功
  }, (error) => {
     // 错误
  });