Monday, 6 June 2022

 Read and Write to Google Sheet from your ESP8266 device.

In this article we access our google sheet data from our google drive with our ESP8266 device.

Google Sheet

It is a spreadsheet almost similar to Microsoft Excel as we are accustomed with. The google sheet has its own format, the GUI interface is very user friendly. It is available within Google apps in google.com page at the top-right corner, just left to your sign in icon. You can access it once you signed in to your google account.


Figure1

ESP8266

Esp8266 is a wifi module along with a microcontroller widely used in IOT (internet of things) technology. As the ESP devices has inbuilt microcontroller, this small device can be used as a small computer (without monitor and terminal) at any place at convenient. It just work silently. There are variants of these devices like ESP8266-01, ESP8266 Node MCU, ESP32 etc.

How ESP Devices Collects Data and Outputs Data:

An ESP device collects data through its sensors connected to its pins and send it to the defined internet address. Similarly, it collects data from the defined internet address and send it to its output pins for actions.

Usages: case 1: Suppose, you have a display unit. You want to display records collected from a remote location through various meas like sensors and other input devices. Here you can use an ESP device as the data collector and provider to your display unit.

Case 2: Say, you organized a conference. You want to get the number of total members present at any time in the conference hall from a remote place. You can deploy ESP8266 here to collect the data through the sensors and send it your mobile device silently.

Case 3: Nowadays, Fastag has been introduced in Indian National Roadways. It works through the RFID sensors at traffic gates. The device modules at the gates get the data about the vehicle and do the toll operations without stopping the vehicle any more. We can achieve this type of performances also with these ESP devices.

 

Now, we will follow the steps below to connect he google spreadsheets and do read/write operations on it.

STEP1: Bill of Materials:

(hardwares)

(i) An ESP8266 module device

(ii) An ESP8266 burner (if it is a node mcu, burner is inbuilt)

[Note: burner device is required only for ESP-01 devices, for others, we just need to connect the ESP Node MCU to the computer USB Cables.]

(iii) A Personal Computer to prepare the software and upload it to ESP

Software

(i) We will use Windows 10 to prepare & upload it to ESP8266

[Note: Different versions of Arduino IDE are available for different OS versions]

(ii) We need to install Arduino IDE for our working environment.

STEP2:

(i) Download ReadSheetData zip library from this link.ReadSheetData

(ii) Go to google Sheet. It you can get it in your google.com page inside Google apps at the top right corner region. 


Figure 2

Figure3

(III) create a spread sheet like below

Figure4

(iv) copy the spread sheet id from the url address like below:

See the address bas: docs.google.com/spreasheet… From here copy the part within ‘../d/’ and ‘/edit..’. This will be used as the spreadsheet id in the app script.

 

(v) add another sheet clicking the bottom left (+) button. (we can toggle between sheets clicking the sheet1 and sheet2 tab).


Figure5

(vi) Go to tools>Script editor

(vii) Script editor will be opened in a new tab.

(viii) copy the contents MyAppScript.gs file from the ReadSheetData.zip library and paste it here.https://github.com/subhramukherjee/ESP8266_Logger.git

(ix) Replace the spreadsheet id with that copied at point (iv) in step2.

Figure6

(ix)Now deploy your app script as a web app and collect the ScriptID.  Click Deploy>New Deployment

Follow the following steps:


Figure7



 Figure 8


Figure9

Now select Anyone in ‘Who has access’ drop-down list. Click Deploy. The system will ask for your authorization. Follow the subsequent steps. In the process following a security warning may come. Go ahead and give authorization (as you know, it is your app script & it is not going to case any harm to any system).


Figure10

 

We can now test our App Script in any web browser. Just copy and paste the web address ( we get it on Manage Deployment tab in the drop-down list we get by clicking Deploy button of the App Script window) to the address bar of any web browser.

Remember: Whenever we make any change to our app script and again go to deploy our app, we must select ‘New Deployment’ from the list.

After all are done, we will get the following window:


 Figure11

Now copy the Google App ScriptID to your secure space. This ID will be required in our ESP8266 code.

Now, Google Script setup is over. Follow the net step.

STEP3:

(i) Download HTTPSRedirect zip library from Github (You can download the ConnectSheet.zip file from this link also, unzip it). Now open the Arduino IDE. Go to Sketch>Include Library>Add .ZIP Library…

Here select the HTTPSRedirect.zip file, the HTTPSRedirect library will added to your library list in Sketch>Include Library.

You can import it as a header file in your .ino code file.

(ii) You can also download the ReadSheetData.zip from the following github resource. https://github.com/subhramukherjee/ESP8266_Logger.git

(ii). Click File>Open. Get the ReadSheetData.ino by unzipping the ConnectSheet.zip file you just downloaded.

(iii) Replace the ssid and password with your wifi ssid and password.

(iv) Replace the GScriptId value with the ScriptID you just collected when deploying your Google AppScript.

(v) Do any necessary changes as per your need.

(vi) upload the .ino file to your ESP8266.

(vii) Go to Tools>Serial Monitor

We will see that the spread sheet data is being displayed on the serial monitor of Arduino IDE.

You can use these data in many purposes like operating other devices, display units etc. We can also send valuable data collected through sensors to the Google sheet.

To write to the google sheet input some text in the Serial input bar. And wait. You will see that your input has been inserted in the Google sheet. 





 

Sunday, 22 May 2022

 

EXTRACT ONE BYTE HEX CODE FROM UTF-8 BYTES REPRESENTING A UNICODE CHARACTER (UTF-8 TRICKS)

[This article assumes the reader knows the hexadecimal number system]

What is UTF8?

Multilingual characters are indexed in a table having each a 16 bit address. This is Unicode table. Thus, using two bytes (each having 8 bits) we could represent any character other than English. But as the English characters are represented in a single byte, we need an encoding which is universal for supporting all the scripts accepted worldwide. More over after addition of more charsets from scripts in different parts of the world (as extended Unicode, in a vow to include all the character and symbols around the globe), the 16 bits became insufficient for Unicode. The UTF-8 brought the solution. Utf-8 is such an encoding system which gives us this privilege to represent any character used anywhere within same common encoding system.

 The utf-8 encoding system needs one to four bytes in a stream to represent a character or a symbol.

The Utf-8 byte sequences follow a definite unique pattern. The pattern is used to validate the correct utf8 sequence. Below is the demonstration of the utf8 pattern:

Single Byte UTF-8

For single byte utf-8 encoding, used pattern is:0xxxxxxx (7 bits are used)

Thus it can represent 00000000 to 01111111  i.e. Unicode U+0000 to U+007F. So, these are sufficient to express English characters.

Two Byte UTF-8

For 2 byte utf-8 encoding, used pattern is: 110xxxxx 10xxxxxx. (Here, 5 + 6 = 11 bits are used)

Thus, it can represent U+0080 to U+07FF. This is used for scripts like Greek, Arabic etc.

Three Byte UTF-8

For 3 byte utf-8 encoding, used pattern is: 1110xxxx 10xxxxxx 10xxxxxx. Thus it uses total 4 + 6 + 6 = 16 bits. Thus, we can represent U+0800 to U+FFFF. This is used for scripts like Devanagari, Bengali, Gurumukhi and others Indic language script characters falls in this range.

After this we need more than 16 bits to represent extended Unicode characters.

Four Byte UTF-8

For 4 byte UTF-8 encoding, used pattern is: 11110xxx 10xxxxxx 10xxxxxx 10xxxxxx. Thus, it uses a total of 21 bits (3 + 6 + 6 + 6).  Thus, it can represent from U+10000 to U+10FFFF.

This unique pattern of utf8 encoding system is required to validate the true utf8 sequence.

Example Decode

In the following example we will extract a single byte hex code from a three byte utf8 stream. The hex code will be unique within the Unicode range used for that script.

The utf-8 sequence for Bengali is E0 A7 80 and the position of in Unicode table is U+09C0.

Now, utf-8 pattern for Bengali characters(3 bytes sequence) is :1110 xxxx  - 10xx xxxx - 10xx xxxx.

Now, 1st byte is E0; thus, in this case 1st byte becomes 1110 0000

The 2nd byte is A7, thus it becomes, 1010 0111

The 3rd byte is 80, thus it becomes, 1000 0000

Thus, the whole bit sequence for becomes 0000 1001 – 1100 0000 (if we extract pattern identification bits). Thus, converting to HEX, it becomes U+09C0 as per the Unicode table.

Now, we will do the same through coding:

For this, we made the third byte as the base, replaced its the leading 10 with the last two bits from the middle byte. The rest leading bits will always form a 9 which is not required for this range of Unicode characters.

.            uint8_t a[3];

.           a[0] = 0xE0;

.           a[1] = 0xA7;

.           a[2] = 0x80;                             [utf8 sequence for ]

.           uint8_t x = a[1]&0x03;            [we take last 2 bits only]

.           x = x<<6;                                  [shift bits by 6 steps left]

.           uint8_t y = a[2]&0x3F;            [resets the left most 2 bits to 0]

.           y = x|y;

This is 0xC0 which is the hex code of , unique up to the required range.

Thursday, 17 February 2022

 

How to implement Phone Verification (OTP Verification) using Firebase Authentication in your Android App (in brief)

1. Create a project in Android Studio.

2. Go Firebase Console, open a firebase account.

3. Sign-in & Add your Android Project to Firebase using package name.

4. Go to Preject Settings>General tab page from the left pane of the firebase console. From here, download the google-services.json. Put this file under the app root folder of your Android Studio project.

5. Now, in your android project add dependency for Firebase Authentication in module level (app level) build gradle file.

   dependencies {

            implementation platform(‘com.google.firebase:firebase-bom:29.1.0’)

            //declare dependencies for Firebase authentication library

            //no need to specify version number if firebase bom is used

            implementation ‘com.google.firebase:firebase-auth’

}

No need to put firebase-auth library version as firebase-bom version is mentioned.

6. Set app’s SHA-1, SHA-256 hash in firebase console. To do so, go to authentication tool from left pane of the project’s firebase console.

To get the SHA-1 & SHA-256 of the Android app, go to signing report from Gradle (right pane of the Android Studio) ->Android->task

7. To enable phone number signing in (OTP verification) for your android app go to Firebase Console à Authentication section.

From the sign-in method page enable Phone number sign-in method.

8. Enable app verification.

To enable app verification, do so through safetyNet , i) enable Android DeviceCheck API from Google Cloud Console. The default firebase API key will be used.

Ii) If SHA-256 is not added, do so from setting page of the firebase console.

Now, we can implement phone verification in our android app.

A. To implements phone verification first create an UI to accept users phone number in our Android Studio platform.

B. Pass this phone number along with other options to request to firebase to verify the phone number through the following method-

PhoneAuthOptions options =
  PhoneAuthOptions.newBuilder(mAuth)
      .setPhoneNumber(phoneNumber)       // Phone number to verify
      .setTimeout(60L, TimeUnit.SECONDS) // Timeout and unit
      .setActivity(this)                 // Activity (for callback binding)
      .setCallbacks(mCallbacks)          // OnVerificationStateChangedCallbacks
      .build();
  PhoneAuthProvider.verifyPhoneNumber(options);    

 

mAuth is an instance of FirebaseAuth class. Get mAuth in the way following,

FirebaseAuth mAuth = FirebaseAuth.getInstance();

FirebaseAuth instance is created depending upon the google-services.json settings file we downloaded in step 4 and saved it in the app root folder of the project.

C. The callback used in firebase phone verification is an instance of OnVerificationStateChangedCallbacks. So, implement it in your Activity.

mCallbacks = new PhoneAuthProvider.OnVerificationStateChangedCallbacks() {

    @Override
    public void onVerificationCompleted(PhoneAuthCredential credential) {
        // This callback will be invoked in two situations:
        // 1 - Instant verification. In some cases the phone number can be instantly
        //     verified without needing to send or enter a verification code.
        // 2 - Auto-retrieval. On some devices Google Play services can automatically
        //     detect the incoming verification SMS and perform verification without
        //     user action.
        Log.d(TAG, "onVerificationCompleted:" + credential);

        signInWithPhoneAuthCredential(credential);
    }

    @Override
    public void onVerificationFailed(FirebaseException e) {
        // This callback is invoked in an invalid request for verification is made,
        // for instance if the the phone number format is not valid.
        Log.w(TAG, "onVerificationFailed", e);

        if (e instanceof FirebaseAuthInvalidCredentialsException) {
            // Invalid request
        } else if (e instanceof FirebaseTooManyRequestsException) {
            // The SMS quota for the project has been exceeded
        }

        // Show a message and update the UI
    }

    @Override
    public void onCodeSent(@NonNull String verificationId,
                           @NonNull PhoneAuthProvider.ForceResendingToken token) {
        // The SMS verification code has been sent to the provided phone number, we
        // now need to ask the user to enter the code and then construct a credential
        // by combining the code with a verification ID.
        Log.d(TAG, "onCodeSent:" + verificationId);

        // Save verification ID and resending token so we can use them later
        mVerificationId = verificationId;
        mResendToken = token;
    }
};

 

 

D. After the user entering the phone number and click to pass the data to firebase through the verification method, the firebase will send a verification code to the user’s phone.

E. Create UI to accept the verification code (OTP).

F. The app will get a verification ID (not OTP) once when the data is sent to firebase through its verification method (look at the onCodeSent() method of the callback). We need to create a PhoneAuthCredential Object using this verificationID and the verification code (OTP) that user will receive in his/her phone.

PhoneAuthCredential credential = PhoneAuthProvider.getCredential(verificationId, code);

 

G. Now the user can be signed in with the credential through the following FirebaseAuth.signInWithCredential method.

private void signInWithPhoneAuthCredential(PhoneAuthCredential credential) {
    mAuth.signInWithCredential(credential)
            .addOnCompleteListener(this, new OnCompleteListener<AuthResult>() {
                @Override
                public void onComplete(@NonNull Task<AuthResult> task) {
                    if (task.isSuccessful()) {
                        // Sign in success, update UI with the signed-in user's information
                        Log.d(TAG, "signInWithCredential:success");

                        FirebaseUser user = task.getResult().getUser();
                        // Update UI
                    } else {
                        // Sign in failed, display a message and update the UI
                        Log.w(TAG, "signInWithCredential:failure", task.getException());
                        if (task.getException() instanceof FirebaseAuthInvalidCredentialsException) {
                            // The verification code entered was invalid
                        }
                    }
                }
            });
}

 

The FirebaseUser object  that we get from the above signInWithPhoneCredential() method holds all related information of the FirebaseUser client.

Sunday, 13 February 2022

 

Install Node.js and NPM on Windows

Step 1: Download the Node.js Installer

From any web browser, navigate to https://nodejs.org/en/download/. Click the Windows Installer button to download the latest default version. At the time when this article is written, version 10.16.0-x64 is the latest version. The NPM package manager is included within the Node.js installer.

You may need the other versions for the older systems (32 bit system). For users, new to Node.js, choose LTS (Long Term Support).

Step 2: Install the Node.js and NPM

1. Once after the installer is downloaded, launch the installer. Double-click it to launch.

2. The system will prompt you whether you want to run the software – click Run.

3. Node.js wizard will open, Click Next.

4. Review the license agreement. Click Next to agree & install the software.

5. The installer will ask for the installation location. Go through the default location, if not you have any special need. Click Next.

6. The wizard will guide you to select components to include or exclude from the installation. Unless you have any special requirement, you should go for the defaults by clicking Next.

7. Finally, click the Install button to run the installer. After installation is finished, click Finish.

Step 3: Verify your Installation

Open the command prompt, and enter the following:

node –v

The system will display the Node.js version installed on your system. Same can be done for NPM:

npm –v