iOS-Chrome .USDZ File Opens as Unicode Text

[CanerErdogan]

Description

I have the following error after tapping View in AR button specifically in Chrome browser on iOS.
iOS+Safari works fine as well as Android, so I believe the model should be fine too.

I replaced the ios-src parameter with the following model which is Google's astronaut and it works fine.
https://cdn.glitch.com/36cb8393-65c6-408d-a538-055ada20431b/Astronaut.usdz?v=1569545377878

The model works on other platform/OS combinations, also on Chrome+iOS as redirection to the .usdz file link. I was able to reproduce the same error with several export methods, results in little change in the "text", but still no view.

I have been going through similar issues here and elsewhere on the web, but could not solve it yet. Can anyone help or at least tell me what might be the cause? Thanks a lot!

Version

• model-viewer: v0.9.0 and some newer

Browser Affected

• Chrome 87.0.4280.77
• Edge
• Firefox
• IE
• Safari

OS

• Android
• iOS 14.3
• Linux
• MacOS
• Windows

[CanerErdogan]

Figured it out. I was using Google Firebase and that was the problem! It somehow meddles with the .usdz files. @firebase

[pbmonster]

This is a content media type issue per #626 (comment), Chrome and Firefox on iOS require the server to specify correct content type. On Firebase hosting you can correct by adjusting your firebase.json file:

{
  "hosting": {
    ...
    "headers": [
      {
        "source": "**/*.@(usdz)",
        "headers": [
          {
            "key": "Content-Type",
            "value": "model/vnd.usdz+zip"
          }
        ]
      }
    ]
  }
} 

[xavi0007]

Still getting the same error after changing the content type. Do I need to clean up anything? Mine already works on local server. So im pretty sure its firebase's issue

[elalish]

Can you give any more detail about the error you see and the setup you're using? @firebase for visibility.

[elalish]

see #3292

[AdrianTabacaru]

Hey, I have had the same problem and I asked for help on this forum. The fix was this in my case:
On my webpage root folder, there is a file named .htaccess. Mine was empty and it has to contain this code:
<FilesMatch ".+\.(usdz)$"> Header set Content-Type "model/vnd.usdz+zip" Header set Content-Disposition "attachment" </FilesMatch>
After that the ASCII was gone and the USDZ model was displayed correctly.
Hope this helps.