Wordpress website not displaying images on certain safari browsers - ios

I have a weird situation, I am developing a site I can see all of the images well on my mac as well as an android phone but on my iPhone and my friends mac, and iPad it is not displaying the images when using safari. Is there something I need to add to the files for this to display properly all through out?
Thanks all feedback welcomes

It appears these assets are linked using https but there is not a valid SSL on the site. So on the devices where it works you have either authorized the SSL or bypassed it, but the other devices have not.
If you open up the Developer Tools in Chrome and view the console you can see the assets with issues along with the error message... "Failed to load resource: net::ERR_INSECURE_RESPONSE"

Just in case someone else has the same problem. For me the problem was that a plugin "Ewww image optimizer" converted images to webP, these were then cached and served by cloudflare and wouldn't load in safari

Related

Is there an way to Inspect a broken link in an app?

We have an iOS app that has a Watch Tutorial link to our website. We recently migrated our website and the page it points to is now showing a 404 error. We need to know what page the link points to so we can redirect it. Unfortunately in the app it just opens link to the page in the actual app and not in safari or any other browser so we can't see the website link.
Is there a way to "inspect" the link in our app like you can in a browser to see where it is pointed to? Maybe some debugging software that can pull the app down and let me look at it? Our app developers are unavailable right now and we want to get the app up and running correctly.
You can try with the Safari Web Inspector (Safari mac remotely debugging on an iPhone app/safari).
With this approach, you can inspect from you mac, any WebViews (or related) in actual apps.
Note : It won't work if you app make the request, but does not use web view to display the page.
See any tutorial on how to enable safari web inspector
Maybe some debugging software that can pull the app down and let me look at it?
You can use a web proxy such as Charles to easily see all the traffic going to and from the app:
Install the proxy software on your computer.
Set the device to proxy through your computer.
If needed, install SSL certificates that will let the proxy see the contents of TLS connections.
Fire up the proxy, launch the app, and watch the traffic.

iPad Safari Web Inspector crashing on page load

I have a video focused website made in wordpress. When we go to test the website on iPad we connect it to a mac laptop and open the safari developer tools to check if we have any errors and whatnot. Everything works on our homepage but when we go to any video post we have added, it crashes the developer tools window, and the browser on the iPad has a little drop down at the top saying "A problem occurred with this webpage so it was reloaded".
The page is fine on the iPad, there aren't any PHP errors in our logs, everything works fine functionally, so I can't figure out what is crashing it.
Any ideas? Any way I can troubleshoot this?
Thanks in advance :) And let me know if you need any more information!
I had this exact problem and solved it by updating both OSX Safari and the iPad to the latest versions. Now i can use the Web Inspector again.

iOS 8 Mobile Safari Images Loading Corrupt

Having a very difficult time tracking down a solution to this bug, hoping someone can help me.
My web app http://www.customozer.com loads fine on desktop, but on mobile safari, some images load corrupt (screenshots below in comments).
This issue does not appear when I use chrome on my ipad (iOS 8.1.2), just safari and saved web apps.
What's also interesting is that when loaded directly from my local MAMP stack using an ngrok tunnel (http://alexgoodwinmedia.ngrok.com/Oz-Snowboards/site/app.php), the issue does not appear. Files on my local machine and on the customozer.com server are synced.
From what I've read, there's a mobile safari issue with loading large amounts of AJAX data.. but that's not how these images are being loaded.
Does anyone have some insight into how can this issue be resolved? Happy to provide more details/tests.
Thanks!
After rather extensive testing, I've finally concluded that the PNG images were being corrupt by an old version of PNGlib (a GDlib element). By moving my project to a new server that allowed for a newer version of GDlib to be installed, I was able to fix the problem.

Non-working cache.manifest on iPad and Safari Desktop

I'm trying to create an offline version of a test web app.
This far it had been working perfectly on Chrome and Firefox where I do most of my tests. Meaning I can go to the page, the console is all good, and then when I unplug my ethernet cable (I'm hardcore like that) I can see still all of my page content in browser and in chrome://appcache-internals
Problems arise when I try to test it on the iPad, I go to my webpage, but then when going into Airplane mode it refuses to access the page saying I need an internet connection. So I decided to test on Safari (mac) which is the closest I have, and I do see an error in the console on the cache.manifest mime-type : Application Cache manifest had an incorrect MIME type: text/plain.
Problem is, I do have a .htaccess and it does specify AddType text/cache-manifest appcache manifest, but no. Even when I use a web sniffer on my cache.manifest file it comes out as text/plain, which I think might be the reason it's not getting read on the iPad/Safari.
Anyone can help me on this thing ? I'm completely stuck right now.
add to your manifest file NETWORK and FALLBACK blocks so it will look like this:
CACHE MANIFEST
# Version 1.0
NETWORK:
*
CACHE:
index.html
FALLBACK:
Check if you have Private Browsing enabled in Safari on your iPad:
Settings -> Safari -> Private Browsing
If it is enabled, disable it. When Private Browsing is enabled all cookies and other caching is disabled.
I had a similar problem. My app worked fine with internet disconnected both on Safari and Firefox running on the iMac and even on the iPhone in airplane mode. But when I tried to load it on the iPad in Airplane mode it just wouldn't work. When I turned off Private Browsing it worked! Still got the notice about turning off Aerplane Mode though. But it was possible to browse the App.

iOS: Did Apple disable HTML5 offline capability for web apps saved to the home screen?

I've been doing lots of work in getting a few web apps to work offline on iOS using the HTML5 manifest. I've ran across the typical problems everyone else has and fixed them and everything seems to be working fine—except in the case where I save the web app to the desktop on my iPhone 4.
If I do this and then enable airplane mode, I get the following alert when trying to access the app via the home screen: "your-app-name could not be opened because its not connected to the internet." Accessing the app via Safari browser works fine while offline.
If anyone knows if this is an error on my part, or even the slim possibility of a work around, do tell.
Even downloading the new Financial Times web app (very well done with extensive localStorage support) results in an error when accessing it offline from the home screen.
Technical specs: Running iPhone 4 with iOS 4.3.3 (but also saw the issue in 4.3.2)
After reading the comments (especially Rowan's) I ran more tests and found the answer:
No, Apple did not disable HTML5 offline capability for web apps saved to the home screen, it works - for the most part. There is a bug that will make it not work. It doesn't seem to have anything to do with your manifest setup (unless perhaps it downloaded a bad manifest or incomplete manifest at one point.) We don't know how widespread it is but the fix is to clear your Mobile Safari Cache.
Here's the steps:
Close the web app (make sure its not sticking around in the background).
Cleared Mobile Safari cache: Settings > Safari > Clear Cache
Reopened the app (for caching).
Close the web app again (make sure its not sticking around in the background).
Enabled "Airplane Mode": Settings > Airplane Mode
Reopened the app.
It should now work offline. If it doesn't then its probably a separate manifest issue in your app. Looks like a weird bug with the browser cache - or perhaps the cache was completely full? Who knows, but that's the answer. Thanks guys.
iOS seems to be very sensitive to load issues when offline.
I was getting your "could not be opened" error when offline on a page I was working on. The problem turned out to be that the page created an iframe pointing to a site that didn't have an AppCache. Removing those iframes fixed the issue.
In my case, I handled it using window.navigator.standalone which tells you whether you're running in an iOS homescreen app. The code looked like this:
if (!navigator.standalone) insertFrames();
add this to your html:
https://web.archive.org/web/20170201180939/https://jonathanstark.com/blog/debugging-html-5-offline-application-cache?filename=2009/09/27/debugging-html-5-offline-application-cache/
I found it massively useful - even though I've created my manifest file and compared it to other people's manifests this JavaScript debugging script gave me the clue I would have never found otherwise. I apparently had syntax error in my manifest ... long story short I had to remove everything and add the paths to each file/image one by one. The end result was the same however it worked... how weird!!! does whitespace / comments affect the syntax of the file?

Resources