Meteor: Reuse existing browser tab with each (Android) NFC tap? - javascript

I'm developing a Meteor web app that loads upon tapping an NFC tag (Android). I'm finding that (of course) tapping the same NFC tag (with the same embedded URL) opens a new window or tab in the browser. The problem is three-fold: 1) it clutters the browser with multiple tabs referencing the same web app thus confusing the user, 2) grows browser memory, and 3) forces Meteor to perform a complete (and slow) download for the new tab rather than reusing the same web app already loaded. The appcache package does not seem to make a difference in this case. This delays the page from appearing quickly after a tap because of the app reload.
Is there any (clever) way around this? I would hope to reuse an existing tab with the same hostname/domain to avoid all of the issues above. I don't know enough yet about HTML5 Javascript API that might offer some kind of solution. I'm afraid this might not be possible. I was thinking, if it were possible, I could load a small app first that inspects the browser environment, redirecting to the full Meteor app, or finding an existing window/tab with same hostname and fetching a new url within that window (with the updated tag ID for instance).
Someone might suggest using Meteor native mobile app, but this has several other problems of its own, including the fact the app must be installed via Play store which is friction vs. web app that just loads without installing an app. Thanks in advance.

Related

What's the simplest way to refresh a particular browser tab from a Go application?

I have a client-side Golang application running on my machine. I also have a browser open, and in that browser there might be a tab running my web application (which is completely separate from the Golang app).
From the Golang app, I would like to programmatically refresh the browser tab (and maybe if possible, bring it to front, but that's less important).
I researched quite a lot already, and I concluded this is not possible just by communicating to the browser, there is no standard (especially cross-platform and cross-browser) interface with which we can trigger the refresh of a specific tab of a browser.
So I suppose I'll need to have some custom JS code running on the website with which my Golang application can communicate and trigger the refresh of the tab.
What's the easiest way to do this?
(I was looking at livereload.js and lrserver, but these all start with the premise that there is a folder of content we'd like to watch and automatically reload on any change. But I don't want that, I just programmatically want to trigger the refresh. Also, this Golang app is not hosting the website, it's just a separate client-side application.)
As suggested by some comments, there seems to be no API through which we could connect to a browser from Golang, query the list of tabs, and refresh a particular page (at least not in a cross-browser and cross-platform way).
One possible approach to do this is to host a small WebSocket endpoint in Golang, and connect to it from the site we want to refresh. Then send a message through the WS connection every time we want to reload the site, and in JavaScript call location.reload() when we receive the message.
I described all the details in a blog post, and uploaded a complete working example to GitHub.

How to force external links to open in an existing web app?

I cannot find anything about it but I find it hard to believe no one has ever tried this.
I'm looking for a client-side solution that allows me to re-use an existing web application running in a browser tab/window when a link is 'clicked' externally.
For example, someone sends me en email with 10 links pointing to a web app (http://myapp.com/:id)
I just want a single instance of that web app to avoid opening a new tab when a link is clicked. My app is really heavy to load and already manages its own tabs re-using existing data.
I've currently implemented this using a Chrome extension that closes the tab if there is an existing one with the same domain, but I want a better cross-browser solution (at least Firefox)
Does anyone know how to achieve this using JS?
I was thinking of Shared workers, but I'm sure there is no way to focus a browser tab using JS...
Thanks!

Communicate w/ Javascript running in an iFrame

I'm currently working on an application that uses the Phonegap/Cordova framework to display an online and an offline version of a website. If you're not familiar w/ this framework, it offers a simple way of creating multi-platform applications by displaying local files in a full-screen webview.
When launching the application, the Javascript integrated in the local files of the application detects if Internet access if available, and redirects the user to either another local webpage containing a full-screen iFrame of the live website, or a reduced offline version of the website (contained in the local files of the app) if no Internet connection is detected.
I would like to detect when the user logs in using the various forms on the website (being displayed inside the iFrame), but I have no way of knowing which page the user is on, or interact w/ the website content at all because of the same-origin policy.
Would it be possible though to make the Javascript from the local page (which contains the iFrame) interact w/ the Javascript from the remote page (which is being displayed in the iFrame)? This way, I would be able to obtain the login information, and save it for later use (obviously not w/o using a token system), but also it would help for another planned feature (trigger the guidance system).
Thank you.
Look into HTML5 communication, it's pretty simple and sounds like it fits your needs
http://stevehanov.ca/blog/index.php?id=109
https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

Spotify Advertiser Page

I'm making a Spotify Advertiser page, but recently Spotify updated to version 1.0.1.1060.gc75ebdfd and now all the links with "a href" are opening in the native browser and not in the micro browser inside Spotify. I already tried using the "target='_self'" and that did not work, and as a solution I started using javascript with location.href on onClick event and that works. I need to open the page to share on Facebook and Twitter, but it wont open with JS only with "a href"
Anyone know what might be or how can it be fix?
Unfortunately, this behavior is not supported any longer. The old client (ie, all versions less than 1.0.0) was built from a combination of web and native views, and therefore the web views were less restricted in terms of what type of content they could open since such content would only live in a small frame.
The new client, however, is essentially a single webview with a native wrapper around it. This solves lots of problems (from both a UX and a technical standpoint), but it also means that there is only one browser shared by all components. If the new client supported "target='_self'", the content opened by your banner ad would take over the entire application window area -- including the back/forward buttons, search bar, etc. This is why we now force all external URLs to be opened in the system web browser instead.

How do I prevent a phonegap app from navigating away from it's local files?

I have a PhoneGap application with an iFrame which is loading content from a site I control. (same domain as the app)
The problem is that when using Javascript widgets like Facebook and Twitter, it's possible to navigate away from the local top level frame. I wouldn't mind so much if it were just the iFrame, but it's eating the whole app, and my preference really is to just redirect the user to an external browser to show the site.
How does one prevent this?
I've tried to counter with modification to the webView: shouldStartLoadWithRequest: method, but that won't work on other platforms, and I cannot easily distinguish between external resources loading in iFrames (SNS widgets) and the same scripts replacing the top level frame.
I think ChildBrowser Plugin can work for you. It will not redirect the calls to webbrowser but I believe it will satisfy your needs. It supports iOS and Android.
The child browser allows you to display external webpages within your
PhoneGap/Cordova application.
A simple use case would be:
Users can follow links/buttons to view web content without leaving
your app.
Display web pages/images/videos/pdfs in the ChildBrowser.

Categories