Table of Contents
Using Camera from WebView
The task is:
- find out whether/how it is possible to use (hardware) camera from the web control
Marcel means it would be possible, when we use HTTPS for communication between our server and mobile client. The question is to:
- find out whether is possible
- test it
- use certificates properly
- find out how we can use the “keystore from Windows”
So:
- 1. find out how to use the camera
- HTTPS only?
- 2. use HTTPS ?
- 3. use certificates properly
Current status
- the HTTPS is implemented and can be used
- my work is saved in special branches (see the following text)
- I wrote a document about using HTTPS with efc ERP:
- currently (18.04.2023) :
- I can leave my work “as is” (saved in branches and documented in the previously described document) and wait until Marcel will implement certificate handling in the Tomcat
- Marcel (maybe) will implement a “switch” to have the possibility to use both (HTTP and HTTPS)
Found facts and solution
- I wrote a document about using HTTPS with efc ERP: https://docs.google.com/document/d/1mSJM13utIdbfc2HvGzOJXUl34SmSqvnplsa54T_-T9A/edit?usp=sharing
- to use camera from WebView all communication should be done over HTTPS
- to scan barcodes we can use a library for it
- we chose zxing
- see
efc_client_mobile/build.gradle... "@zxing/browser": "latest", "@zxing/library": "latest", "@zxing/ngx-scanner": "latest",
- to enable scanner the parameter
scanner-enabledfor componentefc-fieldwas implemented - I've tested it in the file
auth.component.htmlfor fieldloginUsername:<efc-field [focus]="true" [(ident)]="loginUsername" label="login_username" tabindex="0" [scannerEnabled]="true"> </efc-field>
- for test purposes an “independent” component
scanner-dialog-examplewas developed. Example:<scanner-dialog-example></scanner-dialog-example>
- my work is saved in two branches
feat/barcodereader- for project
efc_client_mobile
feat/https- for projects
efc_serverefc_client
Reading Bar code
The following bar codes should be supported (sorted by priority):
- Code39
- EAN13
- DataMatrix
- QRCode
- PDF417
- Code128
See also the email from Klaus Gebauer “ClientMobile: Barcodes” (sent at 13.03.2023).
I found the following libraries:
-
- based on ZXing
- supported bar codes are listed here: https://github.com/zxing/zxing
-
- based on QuaggaJS
Misc
- To have the “.war” of
client_mobilein Tomcat it should be built first- Open view “Gradle tasks”
- Open project
efc_tools- Open folder
efc- Execute task
build_client_mobile
- TODO
- the ng-component efc-field is not yet “bug free”. There is a small CSS-problem with scanner symbol, which should be fixed.
-
- ask Torsten where / how to do it
- clean
- documentation/examples of
Dialog:
- A very helpful tool to debug in Chrome is the “Developer Console”. To use it remotely on an Android device see: Is it possible to open developer tools console in Chrome on Android phone?
- see also : Remote debug Android devices
- to check devices in Chrome:
chrome:/ /inspect/#devices← (remove blank in the URL)
- Icons library used by
efc_client_mobile: https://github.com/marella/material-icons. - This is the Demo (with search functionality)
- Show Corners / Get coordinates of barcode
Settings
- On Eclipse project
efc_client_mobile- Open context menu and 'Properties' in it
- Open “Deployment”
- Add one entry:
- Source
build/angular→ Deploy path/
- In the file
proxy.conf.json- edit entry
“target”: “http://PC-LS:8080/efcserver”,- to
“target”: “https://PC-LS:8443/efcserver”,
Useful reading
- Let's Encrypt for intranet servers
- Using WebView with HTTPS
- Our MainActivity from efc_client_mobile_android project
-
- HTTPS should work with standard WebView (?)
-
- Proper solution (?)
-
- is it a workaround?
-
- add parameters “sslKey”, “sslCert”, and “ssl” to “/efc_client_mobile/angular.json”
- SSL/TLS Configuration How-To (for Apache Tomcat 9.0)
SSL/TLS Configuration How-To (for Apache Tomcat 9.0)
Original: SSL/TLS Configuration How-To (for Apache Tomcat 9.0)
SSL/TLS and Tomcat
- It is important to note that configuring Tomcat to take advantage of secure sockets is usually only necessary when running it as a stand-alone web server.
Certificates
- Certificate - “digital passport” of an internet address
- Organization and some contact information
- This certificate is cryptographically signed by its owner
- For the certificate to work in the browsers without warnings, it needs to be signed by a trusted Certificate Authorities (CAs).
- To obtain a signed certificate, you need to choose a CA and follow the instructions your chosen CA provides to obtain your certificate.
- A range of CAs is available including some that offer certificates at no cost.
- Java provides a simple command-line tool
keytool, which can easily create a “self-signed” Certificate. - Self-signed Certificates not really guaranteed to be authentic at all, but can be useful for some testing scenarios (⇒ they are not suitable for any form of production use).
General Tips on Running SSL
…
Configuration
Prepare the Certificate Keystore
Tomcat currently operates only on keystores in following formats:
- JKS → standard Java format (can be manipulated by
keytool) - PKCS11 or PKCS12 → internet standard (can be manipulated via (among other things) OpenSSL and Microsoft's Key-Manager)
To create a keystore with keytool:
"%JAVA_HOME%\bin\keytool" -genkey -alias tomcat -keyalg RSA -keystore \path\to\my\keystore
Edit the Tomcat Configuration File
Tomcat can use three different implementations of SSL:
- JSSE implementation provided as part of the Java runtime
- JSSE implementation that uses OpenSSL
- APR implementation, which uses the OpenSSL engine by default
…
The final step is to configure the Connector in the $CATALINA_BASE/conf/server.xml file, where $CATALINA_BASE represents the base directory for the Tomcat instance. An example <Connector> element for an SSL connector is included in the default server.xml file installed with Tomcat. To configure an SSL connector that uses JSSE, you will need to remove the comments and edit it so it looks something like this:
<!-- Define an SSL Coyote HTTP/1.1 Connector on port 8443 -->
<Connector
protocol="org.apache.coyote.http11.Http11NioProtocol"
port="8443" maxThreads="200"
scheme="https" secure="true" SSLEnabled="true"
keystoreFile="${user.home}/.keystore" keystorePass="changeit"
clientAuth="false" sslProtocol="TLS"/>
