javascript - les images echart sont exportées vers iframe, le cross-site se produit

Question

Je souhaite exporter l'image exportée d'un echart dans une iframe, mais une erreur interdomaine se produit. Comment dois-je la corriger ? Utilisez la méthode myChart.getDataURL() fournie par echart.

Answer 1

Habituellement, les images permettent un accès inter-domaines, et les images inter-domaines peuvent également être utilisées dans le canevas, mais cela polluera le canevas. Une fois le canevas pollué, ses données ne seront pas lues. (), toDataURL ne peut pas être appelé () ou méthode getImageData()
Ce mécanisme de sécurité du navigateur évite le risque d'utilisation abusive d'images de serveur distant non autorisées
Par conséquent, si vous devez utiliser plusieurs domaines. ressources d'image dans Canvas, veuillez vous référer à l'extrait de configuration Apache suivant

<IfModule mod_setenvif.c>
    <IfModule mod_headers.c>
        <FilesMatch "\.(cur|gif|ico|jpe?g|png|svgz?|webp)$">
            SetEnvIf Origin ":" IS_CORS
            Header set Access-Control-Allow-Origin "*" env=IS_CORS
        </FilesMatch>
    </IfModule>
</IfModule>

echart lui-même utilise la technologie Canvas. L'inter-domaine est causé par le mécanisme de sécurité du canevas. Il est recommandé de changer la source de l'image.