编辑 httpd.conf 开启 expires 模块 

# 去除该模块前的 # 号
LoadModule expires_module modules/mod_expires.so

编辑你的虚拟域名配置文件 vhost.conf

<VirtualHost *:80>
    DocumentRoot "D:\phpStudy\PHPTutorial\WWW\tp5-vue\tp5\public"
    ServerName www.tp5.net
    ServerAlias 

    <IfModule mod_expires.c>
      #打开缓存
      ExpiresActive On

      #默认对所有资源缓存600秒
      ExpiresDefault A600

      #png格式的资源缓存600秒
      ExpiresByType image/png A600

      #jpg格式的资源缓存600秒
      ExpiresByType image/jpg A600

      #含这些后缀的资源，都缓存100秒
      <FilesMatch "\.(jpg|jpeg|png|gif|swf|js|json|xml|pdf)$">
        ExpiresDefault A100
      </FilesMatch>
    </IfModule>
  <Directory "D:\phpStudy\PHPTutorial\WWW\tp5-vue\tp5\public">
      Options FollowSymLinks ExecCGI
      AllowOverride All
      Order allow,deny
      Allow from all
      Require all granted

      # 配置允许跨域的域名 同时 定义变量 AccessControlAllowOrigin=域名
      SetEnvIf Origin "http(s)?://(\S*\.)?(tp5\.com|tp5\.net)(.*)$" AccessControlAllowOrigin=$0$1
      # 设置跨域头
      Header set Access-Control-Allow-Origin %{AccessControlAllowOrigin}e env=AccessControlAllowOrigin  
      # 允许跨域操作
      Header set Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS"
      # 跨域cookie传递
      Header set Access-Control-Allow-Credentials true
      # 缓存时匹配的key判断 ， origin 代表判断域名
      Header append Vary Origin
  </Directory>
</VirtualHost>

如果是 google 浏览器，需要设置使用缓存 ， 去除 settings 里面 Disable cache 选项的√

最后访问该域名下的图片，即可看到缓存效果