Support Snapchat UA's for in-app webview

Hey there! Can we add support for these other Snapchat UA’s? These are mandatory for a proper website render in Snapchat’s web-view.

  • iPhone: Mozilla/5.0 (iPhone; CPU iPhone OS 13_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0.3 Mobile/15E148 Snapchat/10.72.0.2 (like Safari/604.1)

  • Android: Mozilla/5.0 (Linux; Android 7.0; SM-G950U Build/NRD90M; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/60.0.3112.107 Mobile Safari/537.36 Snapchat/10.17.0.0 (SM-G950U; Android 7.0#G950USQU1AQG4#24; gzip)

They’re listed on Snapchat’s Docs, and my current Netlify website doesn’t get pre-rendered properly (Bootstrap is entirely ignored). However when I use Snapchat’s other UA (Safari UA on iPhone or Chrome UA on Android) by appending a ‘?&snapchat_ua=native’ to the url, it works for some reason. This leads me to believe Netlify isn’t recognizing the UA’s I mentioned at the start, which are the Snapchat defaults; and thus not pre-rendering the site properly. I wouldn’t want my website links on Snapchat always having those query params I mentioned, so is there any way Netlify can support these required Snapchat UA’s?

Screenshots:

Using Snapchat’s default UA (xyz.com) (left pic)
Using the work-around and manually specifying UA (xyz.com?&snapchat_ua=native) (right pic)

You had previously asked this in a different thread, and I was going to respond there, only when I returned I didn’t find the reply. But, soon found this thread.

Anyways, coming back to your situation, it’s happening exactly because we’re returning the Pre-rendered content. Basically, what you’re seeing (in the left picture) is correct and pre-rendered content. We’re pre-rendering for Snapchat too. You could test this by going to Chrome dev tools and changing the user agent to the ones you’ve supplied. You’d see a similar page.

The same page is returned for Googlebot agent too (which is definitely in the pre-render user agent list)

Thanks,

Is there any way you can prerender the web page in a better format? It looks like 2/3 of my styles aren’t even being applied. Do you know if bootstrap is even compatible with prerendering?

If not, then I believe the reason it shows up like this would probably be because node_modules aren’t included in the prerender, is there any way to configure that? Not even standard angular routing with buttons work. Website is an Angular 13 project btw.

That was probably cached content. At the moment, I can see the pre-rendered content is returning slightly better results. However, since your pre-loader never goes away, the site is not accessible.

Are you talking about the loading indicator? I’ll take a look, the main issue that wasn’t working with the SSR was routing which is just standard angular routing.

Yes, I think you can take a look at what I mean exactly by changing user agents in Chrome.