剪辑路径在ios 12之下的工作方式如何？

Question

我想剪切img以获得自定义路径，所以我使用剪切路径并编写了一个内嵌svg，它可以在ios12版本的chrome和safari中使用。但不适用于ios12以下版本

#hexagon1-head {
  transform: scale(1.09, 1.13);
}
.pic-head{
  clip-path: url(#hexagon1-head);
}

<svg class="hide" width="207px" height="232px"  viewBox="0 0 166 186" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  <defs>
    <clipPath id="hexagon1-head" clipPathUnits="userSpaceOnUse">
      <path d="M90.5945604,2.15099508 L157.18757,40.6084273 C162.137113,43.4667862 165.186019,48.7483286 165.186019,54.4639381 L165.186019,131.385967 C165.186019,137.101577 162.137113,142.383119 157.18757,145.241478 L90.5945604,183.69891 C85.6433549,186.558229 79.5426637,186.558229 74.5914582,183.69891 L7.99844888,145.241478 C3.04890578,142.383119 3.55271368e-14,137.101577 3.55271368e-14,131.385967 L1.0658141e-14,54.4639381 C5.32907052e-15,48.7483286 3.04890578,43.4667862 7.99844888,40.6084273 L74.5914582,2.15099508 C79.5426637,-0.708323841 85.6433549,-0.708323841 90.5945604,2.15099508 Z"></path>
    </clipPath>
  </defs>
</svg>

<div class="head-wrap">
  <div class="pic-head"  >
    <div :style="{'background-image': `url(${item.userInfo.headPicUrl})`}" ></div>
  </div>
</div>