title: cors blocked errors when loading iframe in vue component, maybe use axios to mimic iframe?
body: <p>I'm doing some testing locally so my dev url is <code>http://localhost:3000</code>, I'm wanting to add an <code>iframe</code> into my <code>vue</code> component to bring in data from an outside domain. But I'm getting a <code>cors</code> errors being blocked, etc.</p>
  <p>I do have access to the domain and server I'm accessing so I have added</p>
  <pre><code>&lt;VirtualHost *:443&gt;
  ...
      Header add Access-Control-Allow-Origin &quot;*&quot;
      Header add Access-Control-Allow-Headers &quot;origin, x-requested-with, content-type&quot;
      Header add Access-Control-Allow-Methods &quot;PUT, GET, POST, DELETE, OPTIONS&quot;
  
  ...
  
  &lt;Directory ...&gt;
    RewriteEngine On
    RewriteCond %{REQUEST_METHOD} OPTIONS
    RewriteRule ^(.*)$ $1 [R=200,L]
  </code></pre>
  <p>but even with that I still get <code>cors</code> error</p>
  <p><code>Uncaught DOMException: Blocked a frame with origin &quot;http://localhost:3000&quot; from accessing a cross-origin frame.</code></p>
  <p>so <code>iframes</code> won't work for me or will they?</p>
  <p>My second thought was maybe I can use <code>axios</code> to pull in the markup from the domain and mimic an iframe and dump and render the html? but even so, I'm not completely sure how to render the html from the <code>axios</code> call in vue.</p>
  <p>anyone have any suggestions on a possible solution?</p>