HTML mobile redirection - avoid opening in the app - html

I have a website redirecting traffic to Kayak.com, lately I noticed users that have the Kayak app installed (iOS / Android) on their device, are being redirected to the app, instead of remaining in the browser.
Sometimes the users would get a question "Open in the kayak app?", while for others it will immediately open the Kayak app.
I wanted to ask how to disable this behavior?
I want all users to remain within the browser, just open the URL in the browser without opening the app (similar behavior to Desktop).
The HTML redirection code:
<!DOCTYPE html>
<html>
<head>
<h1> HTML redirection - how to avoid opening on the app / offering "open in the app?" </h1>
</head>
<body>
<meta http-equiv="Refresh" content="1;url=https://www.kayak.com" />
</body>
</html>
I don't have control of app installations or Kayak's website behavior.
I have tried replacing the HTML redirection with PHP redirection,
And tried JS redirection as well.
Both approaches result in the same outcome (opens in the app / offers to open the app).
For convenient testings I added this code to a web page :
http://www.hotels-bargains.com/htmlredirection.php
Any idea on how to keep the users inside the browser?

Related

Why is iframe blank only with iOS?

There is an html page that works correctly on any Windows and Android (shows content of iframe). Hosting by Github Pages. It works on iOS version 12.5.1, but no on 14.6 (blank page on Chrome, Safari, Opera). Why?
Tried src with wikipedia - ok everything. The problem narrows down to a combination of iframe and src of apps script (that opens separately correctly)
Assume that the problem was mixed http/https according to post. Just http was in style http://www.w3.org/2000/svg, I changed to https (even removed all styles). No effect.
No log errors, just blank page. Seems like trying to load, but break and stop. I haven't ios device to debug. Feedback user.
If you have iOS 14, can try open this site. What you see blank page or access error?
Error like the next is right. It tell about you haven't access.
Refused to display 'accounts.google.com/…' in a frame because it set 'X-Frame-Options' to 'DENY
If you sign in Google Account and try again, will be error from Google Drive. I have all this on any platform in incognito mode. Don't pay attention to them.
Only interested in the case of a blank screen/stop loading like screenshot below
iOS 14.6
Windows
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Goofy</title>
<style>
html, body, iframe { width: 100%; height: 100%; margin: 0; border: 0; }
</style>
</head>
<body>
<iframe src="https://script.google.com/macros/s/AKfycbzmAfVL_ozEP69vpYvMo3t1Qlc4orPfk7eV5rWT/exec"></iframe>
</body>
</html>
Apps Script render page with XFrameOptionsMode.ALLOWALL
function doGet() {
return HtmlService.createHtmlOutputFromFile('launch.html')
.addMetaTag('viewport', 'width=device-width, initial-scale=1')
.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
}
Cookies for cross-site resources are now blocked by default (iOS 13+). Source. Other platform (iOS 12, Windows, Android) while aren't do this. Such cookies need to verify user on github.io with iframe and google src. That's why I see the blank page on iOS 14.
Solve is go to browser's setting and allow 3rd party cookies.
Thanks Shivam's answer
It’s browser side problem. Due to 3rd party cookies, Safari will block the content. Unless user set on their own, the preference to allow all cookies. Until now, I only know Safari that will do this action. Other browser, i think all okay with content in iframe that come from 3rd party.
You can't frame certain websites, because the server won't allow you for security reasons (Imagine that a random page iframes your gmail and steals all your data). So you will have to modify the macro on google scripts and maybe ask other question for what you are trying to do. X-Frame-Options
i have create an iframe look like this :
<iframe src="https://mychatbot.com/chat?token= adadasdasd>
it doesn't work/load in IOS device
But when i change that iframe to
<iframe src="//mychatbot.com/chat?token=adadasdasd>
And bammm, it work !!! i think we just need get rid of http/https out of our "src"

How can I use Web App Manifest and Application Cache at the same time?

I'm trying to build a simple single HTML page that can be launched when offline (on Android, if that matters).
I'm using the Web App Manifest to give the app a name for adding to the home screen and display fullscreen with no browser chrome. This much works.
<!DOCTYPE html>
<html>
<head>
<link rel="manifest" href="mf.webmanifest">
<meta name="mobile-web-app-capable" content="yes">
</head>
...
</html>
This does not appear to be cached when offline. Separately, I can make a page which is cached offline using the application cache:
<!DOCTYPE html>
<html manifest="mf.appcache">
<head>
<meta name="mobile-web-app-capable" content="yes">
</head>
...
</html>
However, when I try to combine these two (so I can have an offline-cached page that launches fullscreen), the Web App Manifest is ignored and I only get the offline behaviour as in the second example.
What I ultimately want is a single page that can be added to the home screen, that opens full screen with no browser/OS chrome at all, and is cached for use offline. A solution that works just on Android using Chrome 65 is acceptable.
That's an interesting dilemma! I wonder if you would have better luck using
<link rel="manifest" href="/manifest.json"> as described by Google. Here's a link to their recommendations for the Web App Manifest.
The Web App Capable meta tag is primarily for full screen capabilities. If you want caching specifically, I think using the http-equiv="cache-control" header tag and its directives is closer to what you're trying to accomplish. Especially since Service workers aren't globally supported yet. I found a decent explanation on HTML caching here on stack: "How to set HTTP headers for cache-control."
Edit: another user has pointed out that Chrome will not honor this tag if a display is set up in the manifest file
The Service Workers feature provides the same capabilities as the deprecated Application Cache.
MDN has an article on Using Service Workers which I found very helpful in implementing what I needed to replace the Application Cache.

Editing Google App Script manifesto to add to home screen?

I have been following this codelab to fit my purpose of adding a Google App Script html service page to home-screen on a mobile device:
https://codelabs.developers.google.com/codelabs/add-to-home-screen/#1
However I am not creating a Web Server for Chrome, is it possible to achieve this with the html service?
At the moment of editing the manifesto and republishing as web app it reverts any changes done to it. I have attempted to host my json manifesto on external sites and DevTools still cannot detect it.
My index.html from App Script.
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<link rel="manifest" href="https://api.myjson.com/bins/1gst5h">
</head>
<body>
Some HTML..
</body>
</html>
My Google App Script Web App is fully functional and can be accessed through a the /exec link, I want to implement it to mobile home-screen but I don't know if the manifesto is truly being edited as upon publishing it reverts any changes done to it.
Google Apps Scripts are published in iframes. Where is your manifesto located? In the Play store or in the App Script? If it is in the Apps Script it it is likely the the manifesto doesn't make it to the client.

Auto refresh in Mac not working for some site

I got a code that refreshes the html page as per the seconds I desire. I am on an Mac and I use the TextEdit app to make the HTML file. This code works for www.apple.com but it does not work for say, https://www.bitcointalk.org or http://www.macrumors.com.
I am not sure why this is happening. All I am doing is replacing the apple URL with bitcointalk url. I know I can also do this refreshing via Safari extension, but I need this code to work.
Thanks a lot
The code I am using is:
<html>
<head>
<meta http-equiv="refresh" content="5">
</head>
<FRAMESET>
<FRAME src="http://www.apple.com/">;
</FRAMESET>
</html>
EDIT: What I am trying to do is, create this html and move it to my iPhone, so that I can do the web refresh through my phone. Right now there are only paid apps in the App store that lets you refresh a page automatically every few seconds/minute and they are not really that good.
As #esqew pointed out in their comment, the sites that aren't showing up forbid access via frames by setting the X-Frame-Options HTTP header to DENY or SAMEORIGIN.
See https://developer.mozilla.org/en-US/docs/Web/HTTP/X-Frame-Options

Website fails to load, but on refresh loads?

So my domain is pointed at a redirect file which in turn loads the first page in a website.
It has worked in the past. The host recently switched servers though and said it would be seamless. Now when you navigate to www.AiySlumlords.com it hits the redirect then fails to load the second page. HOWEVER, if you hit refresh after it fails then it loads?
I have no clue why this isn't working. Here is the redirect file
<html>
<head>
<title>A web page that points a browser to a different page after 2 seconds</title>
<meta http-equiv="refresh" content="0; URL=./Home/f1.html">
<meta name="keywords" content="automatic redirection">
</head>
<body>
<p>If your browser doesn't automatically go there within a few seconds, you may want to go to the destination manually.</p>
</body>
</html>
Since your server is powered by IIS and ASP.NET, it's better to use ASP.NET to redirect your client, e.g. create an index.aspx page with the following content:
<%
Response.Redirect("~/Home/f1.html", false);
Response.StatusCode = (int)System.Net.HttpStatusCode.MovedPermanently;
Response.End();
%>