Corsでサーバかフロントのどちらで失敗しているのか
環境
フロント
Three.js/Nuxt.js
サーバー
Laravel6
サーバーはphp artisan serve
にて起動
エラー内容
Access to XMLHttpRequest at 'http://localhost:8000/storage/example/bunny.obj' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. GET http://localhost:8000/storage/example/bunny.obj net::ERR_FAILED
ネットワークタブ
Responese Header Connection: close Content-Length: 205915 Content-Type: application/x-tgif Date: Wed, 29 Apr 2020 12:13:45 GMT Host: localhost:8000 Request Header Accept: */* Accept-Encoding: gzip, deflate, br Accept-Language: ja,en;q=0.9 Cache-Control: no-cache Connection: keep-alive Host: localhost:8000 Origin: http://localhost:3000 Pragma: no-cache Referer: http://localhost:3000/pages/admin/storages/1581315433ra05d0 Sec-Fetch-Dest: empty Sec-Fetch-Mode: cors Sec-Fetch-Site: same-site User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.122 Safari/537.36
フロントの対象コード
js
1const path = "http://localhost:8000/storage/example/bunny.obj" 2const objLoader = new THREE.OBJLoader() 3objLoader.load(path, (obj) => { 4 const objmodel = obj.clone() 5 objmodel.scale.set(100, 100, 100) // 縮尺の初期化 6 objmodel.rotation.set(0, 0, 0) // 角度の初期化 7 objmodel.position.set(0, 0, 0) // 位置の初期化 8 9 // objをObject3Dで包む 10 const obj3d = new THREE.Object3D() 11 obj3d.add(objmodel) 12 13 this.scene.add(obj3d) // sceneに追加 14})
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/04/29 13:19