Re: [Dorset] Using a Raspberry Pi as a Network Router
On Wed, 11 Jul 2018 17:14:21 +0100, Terry Coles wrote: > It's worse than that; I've found that every browser that I've tried > on every device that I have access to exhibits different behaviours > with this code: I think this is just something that happens with captive portals. It's not unique to the one you've set up. Given enough time to detect the captive portal, Windows 7 pops up a balloon from the taskbar suggesting that "Additional log on information may be required", which opens a browser when clicked. Captive portals are a bit of a hack, and largely rely on the assumption that, if someone wants to use an internet connection, they will open a web browser and try to access a website on the internet. On desktop browsers, if you have a home page that has to be retrieved from the internet, then the experience is that the sign-in page will appear automatically when your browser tries to load your home page. For some years, it was easy to get away with assuming that most people who wanted to use a WiFi hotspot would open a browser and try to load a web page. Then the iPhone happened and suddenly (seemingly) everyone wanted to run native phone apps and POP/IMAP mail clients, which would (correctly) exhibit error conditions rather than displaying a captive portal sign-in page, because they were not web browsers. And so, workarounds had to be devised by which devices could detect captive portals and display the sign in page to users who might not open a web page as soon as they connected to the network. Almost inevitably, the solutions are not standardised. (And phone and tablet OSes have more highly developed solutions than desktop ones.) > Actually I had problems with the logo, the button text size and the > background image. Your button font size was specified in ems. So, it was specified as a proportion of the size that it would otherwise have defaulted to if you hadn't specified one. Since you hadn't specified any absolute sizes that were inherited by the button, the size was relative to the default font size for buttons, as chosen by the browser. This is fairly sensible, provided the browser has a sensible default font size. It has the advantage of respecting any custom default font size that the end user might have set, which is good for accessibility. However, this approach falls down if a browser has a stupid default (that wasn't set by the end user). Which leads me to wonder; could the overflow you're seeing have to do with the global font size settings (for menus, etc) on the Android device you are using? If this is set larger than default, then perhaps the portal sign-in browser respects that and renders everything larger, while other browsers ignore this setting. If the browser is displaying things larger because you have personal settings that enlarge things, then you just have to bear in mind that that is the enlarged version, not the default, and design it to appear enlarged in that browser but "normal" size in the others. If you are more concerned about whether the buttons fit on the screen than whether they respect the user's font size preference, it might make more sense to specify the font size in viewport width units (vw). That is a design decision more than a technical one. Personally I'd try a smaller em size first. (It sounds like that's what you've done.) -- Next meeting: Bournemouth, Tuesday, 2018-07-17 20:00 Meets, Mailing list, IRC, LinkedIn, ... http://dorset.lug.org.uk/ New thread: mailto:dorset@mailman.lug.org.uk / CHECK IF YOU'RE REPLYING Reporting bugs well: http://goo.gl/4Xue / TO THE LIST OR THE AUTHOR
Re: [Dorset] Using a Raspberry Pi as a Network Router
On Wednesday, 11 July 2018 12:04:26 BST Patrick Wigmore wrote: > I think you've hit the nail on the head there. Android seems to have a > special browser that appears for signing in to captive portals, and it > doesn't render web pages quite the same way as the usual browser. > > It makes sense that there should be a special browser, since users > will not necessarily be using the main browser but might still expect > internet access for other apps that won't show a captive portal log in > page. It's worse than that; I've found that every browser that I've tried on every device that I have access to exhibits different behaviours with this code: 1. On Android Phones, an alert is put up with a message to tap to sign in to the network. This launches the 'fake browser' and once 'Continue' is clicked on the Sign In page, the WMT content is loaded. 2. On my Kubuntu laptop, connecting to the WiFi AP has no visible affect but: a. When Chromium is launched, the Sign in Page is loaded automatically. b. When Firefox is launched, there is no alert sound, but a hardly visible banner at the top of the page tells me to click on a button to sign in. After that the behaviour is the same as on a phone. 3. On my son's Windows 10 PC, Chrome behaves in a similar manner to Chromium on Linux and IE also gives no alert. 4. I currently have no access to an iPhone or Windows phone. > Looking at the home page HTML and CSS, I think the most likely element > to cause overflow off the screen is the image that says Wimborne Model > Town Banner. Actually I had problems with the logo, the button text size and the background image. Using the technique that you suggested, I think I've cracked the logo size. I found some CSS code on the Internet that seems to fix the background image (the html code to do the same job only worked on some browsers) and I've had to simply reduce the font size in the buttons to make that work. The biggest problem that I had is that what worked on my Moto G5 Plus, didn't on my wife's Moto G6 Plus and/or my laptop and vice versa. I've now got it working reasonably well across all devices that I have access to, but more testing will obviously be needed. Thanks for putting me on the right trail. -- Terry Coles -- Next meeting: Bournemouth, Tuesday, 2018-07-17 20:00 Meets, Mailing list, IRC, LinkedIn, ... http://dorset.lug.org.uk/ New thread: mailto:dorset@mailman.lug.org.uk / CHECK IF YOU'RE REPLYING Reporting bugs well: http://goo.gl/4Xue / TO THE LIST OR THE AUTHOR
Re: [Dorset] Using a Raspberry Pi as a Network Router
On Wed, 11 Jul 2018 11:04:29 +0100, Terry Coles wrote: > On Wednesday, 11 July 2018 10:20:49 BST Terry Coles wrote: > > All of the pages appear different in one other respect. Across > > the top of the Splash Page, there is a page Title that reads > > 'Sign in to network'. This appears at the top of all the pages. > > It's this hangover from the Sign In Page that makes me suspect > > that nodogsplash is serving the content. > This statement is actually a load of cobblers. I just used my Linux > Laptop and my son's Windows PC to connect to the WMT pretend AP and > that 'page Title' doesn't appear. On going back to the phones, > I've realised that this is nothing more than a banner inserted by > Android to allow users to decide whether to continue to use the > network or not (it has the three vertical dots to indicate that a > menu is available. So the content is presumably being served by > nginx but somehow Android 7.0's browser is messing with the > content, presumably due to something being done in the Splash Page. > > On the laptop and PC, I don't get the Alert that Android puts up and > which automatically routes the user to the Sign In page when > clicked. Instead, the machine simply connects to the AP in the > normal way and nothing happens until the user opens his browser. > This then puts up the Sign In Page and everything works fince from > then on. I think you've hit the nail on the head there. Android seems to have a special browser that appears for signing in to captive portals, and it doesn't render web pages quite the same way as the usual browser. It makes sense that there should be a special browser, since users will not necessarily be using the main browser but might still expect internet access for other apps that won't show a captive portal log in page. Looking at the home page HTML and CSS, I think the most likely element to cause overflow off the screen is the image that says Wimborne Model Town Banner. The buttons have been given no specified width, so they should just get squashed to fit, but the image has an implicit width of 507px, with is inconveniently absolute. (And if the image pushes the page that wide, then the buttons might go off the screen too.) Now, I'm a bit rusty on this, but I believe that most mobile browsers, encountering this page, with no specified viewport size, would set the viewport (representing the visible portion of the page) to the width of the widest element (the image). The browser would then scale the viewport so that it fits on the screen (i.e. zoom out a bit to make everything fit). So, perhaps the captive portal sign-in browser does not support viewports in the same way that a normal mobile browser would. One option to fix this might be to specify the max-width (as opposed to the width) of the image to be 100%. Then it doesn't matter how big or small the viewport is. Another option might be to explicitly set the viewport to the width of the widest item on the page. This might be interesting from the point of view of seeing whether the captive portal sign-in browser actually supports viewports of this nature at all. I imagine this strategy is probably not considered best practice, since it's kind of a cheat to avoid having to fix the page to work with arbitrarily sized screens. -- Next meeting: Bournemouth, Tuesday, 2018-07-17 20:00 Meets, Mailing list, IRC, LinkedIn, ... http://dorset.lug.org.uk/ New thread: mailto:dorset@mailman.lug.org.uk / CHECK IF YOU'RE REPLYING Reporting bugs well: http://goo.gl/4Xue / TO THE LIST OR THE AUTHOR
Re: [Dorset] Using a Raspberry Pi as a Network Router
On Wednesday, 11 July 2018 07:27:21 BST Ralph Corderoy wrote: > Try simplifying splash.html, e.g. > > > > ... I tried using a much simplified page based on this, but it made both the Splash Page and the Home Page oversized. A copy of my current splash.html may be found at: http://www.hadrian-way.co.uk/Misc/Pi_Router/ This page fills the screen correctly and centres the text and objects the way that I want them. I have played around with formatting in this page, but so far have only manged to make things worse ;-( -- Terry Coles -- Next meeting: Bournemouth, Tuesday, 2018-07-17 20:00 Meets, Mailing list, IRC, LinkedIn, ... http://dorset.lug.org.uk/ New thread: mailto:dorset@mailman.lug.org.uk / CHECK IF YOU'RE REPLYING Reporting bugs well: http://goo.gl/4Xue / TO THE LIST OR THE AUTHOR
Re: [Dorset] Using a Raspberry Pi as a Network Router
On Wednesday, 11 July 2018 10:20:49 BST Terry Coles wrote: > All of the pages appear different in one other respect. Across the top of > the Splash Page, there is a page Title that reads 'Sign in to network'. > This appears at the top of all the pages. It's this hangover from the Sign > In Page that makes me suspect that nodogsplash is serving the content. This statement is actually a load of cobblers. I just used my Linux Laptop and my son's Windows PC to connect to the WMT pretend AP and that 'page Title' doesn't appear. On going back to the phones, I've realised that this is nothing more than a banner inserted by Android to allow users to decide whether to continue to use the network or not (it has the three vertical dots to indicate that a menu is available. So the content is presumably being served by nginx but somehow Android 7.0's browser is messing with the content, presumably due to something being done in the Splash Page. On the laptop and PC, I don't get the Alert that Android puts up and which automatically routes the user to the Sign In page when clicked. Instead, the machine simply connects to the AP in the normal way and nothing happens until the user opens his browser. This then puts up the Sign In Page and everything works fince from then on. -- Terry Coles -- Next meeting: Bournemouth, Tuesday, 2018-07-17 20:00 Meets, Mailing list, IRC, LinkedIn, ... http://dorset.lug.org.uk/ New thread: mailto:dorset@mailman.lug.org.uk / CHECK IF YOU'RE REPLYING Reporting bugs well: http://goo.gl/4Xue / TO THE LIST OR THE AUTHOR
Re: [Dorset] Using a Raspberry Pi as a Network Router
On Wednesday, 11 July 2018 07:27:21 BST Ralph Corderoy wrote: > Is this the content of the web page being served? > https://github.com/nodogsplash/nodogsplash/blob/master/resources/splash.html I am using that page as the basis of my Splash Page, which authorises the user and tells him/her that they won't have Internet access through the WMT WiFi AP. When the button is clicked the user is redirected to the WMT Home Page, where the buttons to access the content are held. It's the Home Page, not the Splash Page that is being rendered oversize. If you go to http://www.hadrian-way.co.uk/WMT_Webserver/WMT/ you will see what the Visitor is supposed to see once they been authorised (and does see on the deployed system). > Does the page appear different between nodogsplash's HTTP server and > nginx in any other way that the size it's viewed at? I don't think the All of the pages appear different in one other respect. Across the top of the Splash Page, there is a page Title that reads 'Sign in to network'. This appears at the top of all the pages. It's this hangover from the Sign In Page that makes me suspect that nodogsplash is serving the content. The map page is also oversized, but the Quiz and Audio Guide pages seem to work (even though they carry the Sign In title). > Try simplifying splash.html, e.g. Splash works OK, as related above. > Does the user need to see a splash page? If not, then it could probably > redirect to `$authtarget' without the user having to read or click > `Continue'. Yes. so that I can inform them of the lack of internet access and one or two other things. > way the HTML is served can make a difference, but perhaps one of those > two isn't serving some other resource that the page references, e.g. an > image, due to misconfiguration and that's making the page size > different. I've been thinking about this problem and after sleeping on it, I think I need to find the answers to some basic questions. 1. If the nodogsplash webserver is serving the WMT content pages; how does it manage that? The Splash Page is located at /etc/nodogsplash/htdocs, which is the default location. The WMT content is at /var/www/html, which is the default location for nginx. The nodogsplash config file points the webserver at the Splash Page for the initial signin and the redirects to WMT-Guest.com. The nginx config file includes 'sites-enabled' and a file called WMT-Guest is located in 'sites-available' This is then linked to 'sites-enabled'. The Pi is set up to be a DNS Server, which simply says that the page WMT-Guest.com may be found at the IP Address of the Pi (192.168.0.1). All this has worked well since the Webserver was installed in March 2017. The only problem has been the Android issue. 2. A repeat of question 1. really; when the browser surfs to 192.168.0.1 how does it know to get the content from nginx and not the nodogsplash web server? My understanding is that you can run two webservers at the same IP Address providing that they use different ports. nodogsplash is using the default port 2050 and nginx is using port 80. So that ought to work, but I'm still not sure how the content gets to the browser if the nodogsplash webserver is serving it since it won't be reading the nginx config file. -- Terry Coles -- Next meeting: Bournemouth, Tuesday, 2018-07-17 20:00 Meets, Mailing list, IRC, LinkedIn, ... http://dorset.lug.org.uk/ New thread: mailto:dorset@mailman.lug.org.uk / CHECK IF YOU'RE REPLYING Reporting bugs well: http://goo.gl/4Xue / TO THE LIST OR THE AUTHOR
Re: [Dorset] Using a Raspberry Pi as a Network Router
Hi Terry, > On my wife's Moto G6 Plus (Android 8.0), this works well. On my Moto > G5 Plus (Android 7.0), the Home Page is too big and overflows the > screen. Is this the content of the web page being served? https://github.com/nodogsplash/nodogsplash/blob/master/resources/splash.html > I suspect this is to do with the built-in webserver that nodogsplash > uses, because if I surf to the Home Page with nodogsplash disabled it > works correctly. I used nginx for the original content. Does the page appear different between nodogsplash's HTTP server and nginx in any other way that the size it's viewed at? I don't think the way the HTML is served can make a difference, but perhaps one of those two isn't serving some other resource that the page references, e.g. an image, due to misconfiguration and that's making the page size different. Try simplifying splash.html, e.g. $gatewayname Entry $gatewayname Hotspot Gateway. Welcome! For access to the Internet, please click Continue. Does the user need to see a splash page? If not, then it could probably redirect to `$authtarget' without the user having to read or click `Continue'. Cheers, Ralph. -- Next meeting: Bournemouth, Tuesday, 2018-07-17 20:00 Meets, Mailing list, IRC, LinkedIn, ... http://dorset.lug.org.uk/ New thread: mailto:dorset@mailman.lug.org.uk / CHECK IF YOU'RE REPLYING Reporting bugs well: http://goo.gl/4Xue / TO THE LIST OR THE AUTHOR
