0
  var lng=result.geocodes[0].location.lng;
            var lat=result.geocodes[0].location.lat;
           $.ajax({
                  url:'https://zhihui.farm/markets/'+lng+','+lat+'?limit=2',
                  type:'get',
                  dataType:'json',
                  beforeSend: function(request) {
                    request.setRequestHeader("Authorization", "JWT eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpZCI6IjUxYTRjNzg5LTc5ODQtNDE4Mi1iZTFlLWYxYWI0M2E5YzU0MyIsImV4cCI6MTUxNTcyMzQ5My41NTJ9.r131dQYaCYO4hK_vzLLZf6NDhBuiARsyS5sw1H3D2ko");
                  },
                  success:function(data){
                    console.log(data);
                  }, 
                  error : function(errorMsg) {
                    alert("数据请求失败");
                }
              });   
浏览器报的错误:Failed to load https://zhihui.farm/markets/117.251587,39.128291?limit=2: Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Ori

gin' header has a value 'http://localhost:3001' that is not equal to the supplied origin. Origin 'http://192.168.11.203:3001' is therefore not allowed access.

怎么解决!?

10个回答

1

服务端无法配置跨域白名单的话,可以使用代理,将其转化为同一个域下,gulp,webpack都有相应的配置

0

其实都是你自己的项目吧,只不过你是在本地开发,访问的线上的接口 如果是的话 考虑部署环境

0

nginx反向代理

0
    dataType:'jsonp',
0

hosts修改

0

我写了一些关于 ajax 的跨域问题和方案总结, 如果真的想知道前因后果,不妨看看。

0

如果楼主是在开发阶段,上线后确定是同一个域名的话,可以让谷歌浏览器取消跨域,
目标设置成: --args --disable-web-security --user-data-dir'

如果必须要处理跨域的话,那么就使用jsonp

0
0

方式很多:

     1:服务端配置cors跨域设置access-control-allow-origin(最推荐!)
     2:通过nginx等转发代理
     3:如果只是开发环境下跨域,生产环境同域,最简单的方式直接装一个chrome插件allow-control-allow-origin
     4:其他jsonp,window.name,iframe之类的方式等,个人不太推荐了,限制太多,有点类似hack的方式
0

你在头部添加了 Authorization ,即需要先发送 OPTION 请求,询问服务器是否允许请求头有 Authorization 这非default 属性,若没有就算你配置了服务器允许跨域访问,但因这个而被拦截了
首先在服务器允许,当然在代码中也可以,我以 nginx 为例子

    location ~ .*\.(php|php5)?$  
    {  
      # 当OPTIONS时允许通过,且返回204
      if ($request_method = 'OPTIONS') {  
        # 允许跨域地址
        add_header Access-Control-Allow-Origin *;  
        # 当该标志为真时,响应于该请求是否可以被暴露
        add_header Access-Control-Allow-Credentials true; 
        # 允许的请求类型 
        add_header Access-Control-Allow-Methods 'GET, POST, PUT,OPTIONS';  
        # 允许的自定义(这里只是列举一些,如题主主要加上 Authorization 就可)
        add_header 'Access-Control-Allow-Headers' 'Authorization,DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';  
       
        return 204;  
      }  
   
      fastcgi_pass   127.0.0.1:9000;  
      fastcgi_index index.php;  
      fastcgi_param  SCRIPT_FILENAME  /usr/local/www/$fastcgi_script_name;  
      include        fastcgi_params;  
    }  

撰写答案