我最近在Three.js上工作,但显示错误

时间:2019-12-29 14:44:18

标签: javascript html three.js

new THREE.MeshBasicMaterial({                 map: new THREE.TextureLoader().load(                     'https://www.google.com/imgres?imgurl=https%3A%2F%2Fabout.canva.com%2Fen_in%2Fwp-content%2Fuploads%2Fsites%2F3%2F2016%2F08%2Flogos-1.png&imgrefurl=https%3A%2F%2Fwww.canva.com%2Fen_in%2Fcreate%2)
side:Doubleslide); 
Access to image at 'https://www.google.com/imgres?imgurl=https%3A%2F%2Fabout.canva.com%2Fen_in%2Fwp-content%2Fuploads%2Fsites%2F3%2F2016%2F08%2Flogos-1.png&imgrefurl=https%3A%2F%2Fwww.canva.com%2Fen_in%2Fcreate%2Flogos%2F&docid=r_XhzRCvrSzyuM&tbnid=oAN9k3zJALug4M%3A&vet=10ahUKEwiQzJqt_NrmAhXA8XMBHSLLABMQMwh4KAIwAg..i&w=1200&h=1200&bih=586&biw=1233&q=logo&ved=0ahUKEwiQzJqt_NrmAhXA8XMBHSLLABMQMwh4KAIwAg&iact=mrc&uact=8' from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

这是解决该错误的另一种方法吗?如何使用Textureloader函数在three.js中插入图像?

1 个答案:

答案 0 :(得分:0)

这是一个跨域安全性错误,但是您也具有指向指向托管该图像的页面的URL。 您可能应该首先尝试使用以下图像网址:“ https://about.canva.com/en_in/wp-content/uploads/sites/3/2016/08/logos-1.png” 如果这不起作用,请尝试将该图像托管在与javascript相同的域上。 如果可以将其托管在您控制的其他域上,请尝试将CORS策略设置为允许跨域加载图像。 如果无法实现,则可以将图像转换为base-64并将其作为字符串嵌入到javascript中。 (Embedding Base64 Images