Grafana没有通过AJAX做出回应
我有Grafana设置在一个Docker容器(来自Docker repo的grafana/grafana
图像),并将端口3000转发到我的本地主机。 我docker-compose.yml
如下:
version: '2.1' services: grafana: image: grafana/grafana ports: - 3000:3000
最初我也有链接到Graphite和一些卷和环境configuration(只有GF_SECURITY_ADMIN_PASSWORD
),但我想这没有关系。
我可以通过简单的curl
调用来获得Grafana的回复:
$ curl http://localhost:3000 <a href="/login">Found</a>.
但是,当我试图通过AJAX调用,它给了我一个奇怪的结果:
$.ajax({url: 'http://localhost:3000', beforeSend: function(xhr, settings) {alert('before setting header'); xhr.setRequestHeader('Access-Control-Allow-Origin', '*'); alert('after setting header');}}); [many JSON fields] responseText:"" [many JSON fields] statusText: "error" [many JSON fields]
警报说,头被设置为接受来自任何来源的请求。
当我直接调用Docker容器地址时,会发生同样的情况(curl工作,但不是)。
在后台发生了什么? 为什么第二个请求不起作用? 如何通过AJAX调用从Grafana获得响应?
问题是默认情况下,CORF在grafana上没有启用。 curl请求不检查CORS,但浏览器。 它是保护一个网站调用其他网站的API。
所以你的解决scheme是将一个反向nginx代理放在Grafana前面。 以下是docker-compose.yml
的相同
version: '2.1' services: grafana: image: grafana/grafana nginx: image: nginx volumes: - ./nginx.conf:/etc/nginx/nginx.conf ports: - "3000:80"
而下面的nginxconfiguration会添加CORS到它,但它是非常开放的,将允许每个人访问
events { worker_connections 1024; } http { # # Acts as a nginx HTTPS proxy server # enabling CORS only to domains matched by regex # /https?://.*\.mckinsey\.com(:[0-9]+)?)/ # # Based on: # * http://blog.themillhousegroup.com/2013/05/nginx-as-cors-enabled-https-proxy.html # * http://enable-cors.org/server_nginx.html # server { listen 80; location / { #if ($http_origin ~* (https?://.*\.tarunlalwani\.com(:[0-9]+)?$)) { # set $cors "1"; #} set $cors "1"; # OPTIONS indicates a CORS pre-flight request if ($request_method = 'OPTIONS') { set $cors "${cors}o"; } # Append CORS headers to any request from # allowed CORS domain, except OPTIONS if ($cors = "1") { add_header Access-Control-Allow-Origin $http_origin always; add_header Access-Control-Allow-Credentials true always; proxy_pass http://grafana:3000; } # OPTIONS (pre-flight) request from allowed # CORS domain. return response directly if ($cors = "1o") { add_header 'Access-Control-Allow-Origin' '$http_origin' always; add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE' always; add_header 'Access-Control-Allow-Credentials' 'true' always; add_header 'Access-Control-Allow-Headers' 'Origin,Content-Type,Accept' always; add_header Content-Length 0; add_header Content-Type text/plain; return 204; } # Requests from non-allowed CORS domains proxy_pass http://grafana:3000; } } }
也为testing你不应该使用
xhr.setRequestHeader('Access-Control-Allow-Origin', '*');
删除和testing,它应该工作