I have used THREE.js GLTFLoader to load glb file then I used USDZ Exporter to export it to usdz then when I tried to open it on browser it opened on saferi but didn't shown on arkit on object mode and on AR Mode appear above my head this is a simple file
https://drive.google.com/file/d/1uAZNZLWI-zdtjcetfT2tIBh9a0tyzGyi/view?usp=sharing
This is my trial
const loader = new GLTFLoader().setPath(`${origin}${folderPath}`);
loader.load(modelName, async function (gltf) {
model = gltf.scene;
scene.add(model);
const exporter = new USDZExporter();
const arraybuffer = await exporter.parse(model );
const blob = new Blob([arraybuffer], { type: 'application/octet-stream' });
const link = document.getElementById('usdz-link');
link.style.display = ''
link.href = URL.createObjectURL(blob);
also I have tried to center the glb model by this code
const box = new THREE.Box3().setFromObject(gltf.scene);
const center = box.getCenter(new THREE.Vector3());
var sceneCopy=gltf.scene.clone();
sceneCopy.position.x += (gltf.scene.position.x - center.x);
sceneCopy.position.y += (gltf.scene.position.y - center.y);
sceneCopy.position.z += (gltf.scene.position.z - center.z);
and then used sceneCopy to be exported to usdz but unfortunately this didn't help me