Select in one device but view on another

Andrew Poulos

unread,

Jul 7, 2021, 6:51:21 PM7/7/21

to

There's an elearning web page I'm working on. It generates a quiz (as a
collection of a HTML page, JavaScript, and images) that gets downloaded.

The quiz needs to be responsive ie also run well on a phone.

Within the elearning page there's a button which will generate a live
version of the quiz for testing purposes.

I work with a desktop computer to test the quiz on a phone I have to
either download the quiz, upload it to a server or to run the elearning
page on a phone and then launch the test from there.

I was wondering if there's a way I can work on a desktop computer but
more easily test on a phone. I have a library that can create valid QR
codes that my phone can read and thought that it might be useful.

Alas I can't really see how I can view a website on one device and have
the output display on another. Perhaps if you click a button in the
elearning page it creates a file on the server (which is the HTML for
the quiz) and a QR code for that page?

Does anyone have any ideas on this?

Andrew Poulos

JJ

unread,

Jul 7, 2021, 7:04:05 PM7/7/21

to

I don't think this can be solved using JavaScript.

Jon Ribbens

unread,

Jul 7, 2021, 7:09:56 PM7/7/21

to

On 2021-07-07, Andrew Poulos <ap_...@hotmail.com> wrote:
> There's an elearning web page I'm working on. It generates a quiz (as a
> collection of a HTML page, JavaScript, and images) that gets downloaded.
>
> The quiz needs to be responsive ie also run well on a phone.
>
> Within the elearning page there's a button which will generate a live
> version of the quiz for testing purposes.
>
> I work with a desktop computer to test the quiz on a phone I have to
> either download the quiz, upload it to a server or to run the elearning
> page on a phone and then launch the test from there.

On the desktop:
Right click -> Inspect -> Responsive Design Mode

Andrew Poulos

unread,

Jul 7, 2021, 10:58:05 PM7/7/21

to

Ok, but is testing within Chrome is as good as testing on a device that
users are using.

Andrew Poulos

Michael Haufe (TNO)

unread,

Jul 11, 2021, 5:33:17 PM7/11/21

to

If you are using basic standards compliant stuff in your webpage and not bleeding edge technologies it's probably fine.

If you want to test things like orientation of the phone in 3d space or some service-worker stuff you might have some challenges.

Thomas 'PointedEars' Lahn

unread,

Jul 13, 2021, 8:28:34 PM7/13/21

to

Andrew Poulos wrote:

> There's an elearning web page I'm working on. It generates a quiz (as a
> collection of a HTML page, JavaScript, and images) that gets downloaded.

This can be easily be tampered with.

> The quiz needs to be responsive ie also run well on a phone.

OK.

> Within the elearning page there's a button which will generate a live
> version of the quiz for testing purposes.

Meaning?

> I work with a desktop computer to test the quiz on a phone I have to
> either download the quiz, upload it to a server or to run the elearning

--------------------------^

> page on a phone and then launch the test from there.

Parse error.

> I was wondering if there's a way I can work on a desktop computer but
> more easily test on a phone.

Set up a Web server either A) on the desktop computer or B) on another
computer that acts as a remote server that can be accessed with the desktop
computer and the mobile phone alike. In case B you will also have to
synchronize your code with the remote server; special possibilities include
opening files on the server in your IDE via SSH, in which case the
synchronization is implicit.

I am occasionally using case A: I am using my mobile phone as an Internet
modem for my laptop (i.e. I am using mobile tethering via WLAN), which also
means that the phone and the laptop are in the same network. I can
therefore use the IP address assigned to the laptop’s WLAN adapter (by the
mobile phone) to access Web sites on the local (development) Web server on
the laptop from the mobile phone. I had to configure the Web server so that
it reacts to that IP address which, fortunately, appears to be static (maybe
it is based on the MAC address of the WLAN adapter of the laptop):

$ head /etc/apache2/sites-available/local
ServerName localhost
ServerAlias 127.0.0.1
[…]

# home
[…]
ServerAlias 192.168.x.y

whereas the latter address is IPv4 address assigned to my laptop’s WLAN
adapter.

> I have a library that can create valid QR
> codes that my phone can read and thought that it might be useful.

QR codes for what?

> Alas I can't really see how I can view a website on one device and have
> the output display on another.

That is something else than you have asked above.

> Does anyone have any ideas on this?

<http://www.catb.org/~esr/faqs/smart-questions.html>

--
PointedEars
FAQ: <http://PointedEars.de/faq> | <http://PointedEars.de/es-matrix>
<https://github.com/PointedEars> | <http://PointedEars.de/wsvn/>
Twitter: @PointedEars2 | Please do not cc me./Bitte keine Kopien per E-Mail.

Thomas 'PointedEars' Lahn

unread,

Jul 13, 2021, 8:53:36 PM7/13/21

to

Thomas 'PointedEars' Lahn wrote:

> I am occasionally using case A: I am using my mobile phone as an Internet
> modem for my laptop (i.e. I am using mobile tethering via WLAN), which
> also
> means that the phone and the laptop are in the same network. I can
> therefore use the IP address assigned to the laptop’s WLAN adapter (by the
> mobile phone) to access Web sites on the local (development) Web server on
> the laptop from the mobile phone. I had to configure the Web server so
> that it reacts to that IP address which, fortunately, appears to be static
> (maybe it is based on the MAC address of the WLAN adapter of the laptop):
>
> $ head /etc/apache2/sites-available/local
> ServerName localhost
> ServerAlias 127.0.0.1
> […]
>
> # home
> […]
> ServerAlias 192.168.x.y
>
> whereas the latter address is IPv4 address assigned to my laptop’s WLAN
> adapter.

Correction: This directive was for another use-case. Apparently the only
directive that is required for case A, is the “Allow” directive below:

<Directory "$DOCUMENT_ROOT">
[…]
Order deny,allow
Deny from all
[…]
# WLAN (Android)
[…]
Allow from 192.168.43
</Directory>

whereas $DOCUMENT_ROOT is the document root of this virtual Apache host, and
192.168.43.0/24 is the subnet that is used by my mobile phone when it is
used for tethering. (I do not find any other configuration file where “.43”
occurs.)

Andrew Poulos

unread,

Jul 14, 2021, 1:15:37 AM7/14/21

to

Thanks.

Andrew Poulos

Thomas 'PointedEars' Lahn

unread,

Jul 14, 2021, 5:20:06 PM7/14/21

to

Andrew Poulos wrote:

> On 14/07/2021 10:53 am, Thomas 'PointedEars' Lahn wrote:

>> [a fracking lot]
>
> Thanks.

Seriously, that is all that you have to say? What about the effort that I
put in to understand what you meant, the question that *I* asked? You do
not inspire people to help you again with this behaviour. :-(

Andrew Poulos

unread,

Jul 14, 2021, 7:01:43 PM7/14/21

to

On 15/07/2021 7:19 am, Thomas 'PointedEars' Lahn wrote:
> Andrew Poulos wrote:
>
>> On 14/07/2021 10:53 am, Thomas 'PointedEars' Lahn wrote:
>>> [a fracking lot]
>>
>> Thanks.
>
> Seriously, that is all that you have to say? What about the effort that I
> put in to understand what you meant, the question that *I* asked? You do
> not inspire people to help you again with this behaviour. :-(

I'm on Windows and the local web server is IIS. I couldn't do the Apache
directives. Instead I gave IIS a "faux" certificate to allow me to use
https though connecting to it from another device on the same network
still meant working through the normal lot of security warnings.

Although the media (images, video, audio...) associated with a generated
quiz must always exist on the server the actual control part of the quiz
only gets generated when the quiz is "published" (in which case the HTML
and associated scripts are written to the server) or when I'm testing
locally (in which case the HTML and associated scripts exist in memory).

I couldn't work out how to access the test version from a separate
device so when I tested locally I wrote the "in memory" files to the server.

Then I generated a QR code to the test version which I printed and
scanned with whatever mobile device I wanted to test with.

The same thing "worked" on the production IIS server.

The downsides are:
- I need to write the files to the server each time I make a change to
the quiz.
- If the files don't eventually get deleted it's possible that some
student will find them and do the test without any tracking.

Sorry if you expected more from my response.

Andrew Poulos