How to use SVG filters and <base> tag together

Question

Below code works on home page where "page URL" == "base URL"

but fails on any other page

<svg>
  <filter id="blur">
    <feGaussianBlur stdDeviation="5"></feGaussianBlur>
  </filter>

  <image id="svg-image" xmlns:href="http://x.com/image.jpg"       
         filter="url(#blur)">
  </image>
</svg>

Is there a way to reference "only the filter" from an external svg file ?

eg:

1.External file @( http://localhost/somewhere/external.svg )

<svg>
  <filter id="blur">
    <feGaussianBlur stdDeviation="5"></feGaussianBlur>
  </filter>
</svg>

2.HTML document @( http://localhost/elsewhere )

<svg>
  <image id="svg-image" xmlns:href="http://x.com/image.jpg"       
         filter="url(/somewhere/external.svg#blur)">
  </image>
</svg>

Answer 1

Using a filename in your url() like that should work. Especially if you are referencing the current file. That will fix your problem with <base> .

However not all browsers support pointing to another file (yet).

Incidentally, your xmlns:xlink attribute is wrong. That should be xlink:hef="" .

Answer 2

Just Don't || !possible

(as suggested by @RobertLongson and @PaulLeBeau)