`
第五章 grafana使用CDN模式进行页面加速
这个是系列文章中的一部分
- grfana系列文章目录
- 前言
- 一、 需要将那部分放到CDN中
- 1 ） 首先需要明白Grafana到底什么部分需要缓存
- 2 ）怎么找？
- 3 ) 转移它
- 二、使用NGINX方式配置CDN
- 1）将刚才的那个目录放到nginx的web服务下面，注意目录的路径不要错
- 2）在nginx中创建配置部分
- 三、修改Grafana的配置文件
- 1） 配置文件的位置
- 2）需要修改的部分
- 四、解决跨域的问题
- 总结
前言
目前很多项目都在用Grafana来进行系统报告的展示。不管是使用Grafana自带的界面还是嵌入式的显示， 都会遇到一个问题就是页面在加载时的缓慢问题。（毕竟很多用户都要求页面在15-30秒完成初始化加载）
提示：以下是本篇文章正文内容，下面案例可供参考
一、 需要将那部分放到CDN中 1 ） 首先需要明白Grafana到底什么部分需要缓存2 ）怎么找？需要缓存的部分是发布的包，容器
3 ) 转移它 二、使用NGINX方式配置CDN 1）将刚才的那个目录放到nginx的web服务下面，注意目录的路径不要错在本文中使用的是docker方式安装的Grafana，和实际install安装的方式是一样的。在这里使用的Grafana的版本是8.5.2
存放容器的目录:/usr/share/grafana/public
红色框的部分需要放到CDN服务器上的部分就是这个。
2）在nginx中创建配置部分格式为：/grafana-oss/版本号（我的版本是8.5.2）/public/
注意后面的public不要忘记
server {
listen 80;
listen [::]:80;
server_name 192.168.1.122;
access_log /var/log/nginx/host.access.log main;
error_log /var/log/nginx/host.error.log warn;
root /var/www/grafana/cdn; #这里是文件所在的目录
location ~ .*.(jpg|png|ico)(.*){
expires 30d;
}
location ~ .*.(js|css)(.*){
expires 7d;
}
location /{
add_header Access-Control-Allow-Origin *; # 这个就是解决跨域的语句
autoindex on;
autoindex_exact_size on;
autoindex_localtime on;
# proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
# proxy_set_header X-Forwarded-Proto $scheme;
# proxy_set_header X-Forwarded-Port $server_port;
}
}
修改完配置使用命令热加载
nginx -s reload
三、修改Grafana的配置文件 1） 配置文件的位置这是结果
/etc/grafana2）需要修改的部分
#################################### Server #################################### [server] # Protocol (http, https, h2, socket) protocol = http #这里设置为使用http方式访问 # The ip address to bind to, empty will bind to all interfaces ;http_addr = # The http port to use http_port = 3000 # 设置http的端口号为3000（这里是对外服务的端口） # The public facing domain name used to access grafana from a browser domain = localhost # Redirect to correct domain if host header does not match domain # Prevents DNS rebinding attacks enforce_domain = false # The full public facing url you use in browser, used for redirects and emails # If you use reverse proxy and sub path specify full url (with sub path) root_url = %(protocol)s://%(domain)s:%(http_port)s/ #（ 去掉前面的分号） # Serve Grafana from subpath specified in `root_url` setting. By default it is set to `false` for compatibility reasons. serve_from_sub_path = true # 这个一定要打开（去掉前面的分号和改成true） # Log web requests router_logging = false # the path relative working path static_root_path = public # enable gzip ;enable_gzip = false # https certs & key file ;cert_file = ;cert_key = # Unix socket path ;socket = # CDN Url cdn_url = http://192.168.1.122:1341 #（这里是刚才配置的cdn的路径，由于我们给的是跟路径，所以这里就是到端口号就好了） # Sets the maximum time using a duration format (5s/5m/5ms) before timing out read of an incoming request and closing idle connections. # `0` means there is no timeout for reading the request. ;read_timeout = 0四、解决跨域的问题
总结跨域的问题，修改NGINX中的配置文件，看里面的跨域解决的那句话
使用cdn来存储所有的js和公共部分速度大约可以提升10%左右，这个是保守估计。
