Internal Errigal Collaboration Wiki

User Tools

Site Tools

Trace: • rdf_server_setup
toolsandtechnologies:device_emulator

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision		Previous revision
toolsandtechnologies:device_emulator [2019/04/05 15:21] – rahulpatiltoolsandtechnologies:device_emulator [2021/06/25 10:09] (current) – external edit 127.0.0.1
Line 1: Line 1:
 +====== Device-Emulator ======
 +
 +Device-Emulator is an application which emulates the behavior of controllers so they don't need to be hit multiple times for data fetching. This application will be primarily used by developers at Errigal on top of their internal apps like RDF, SNMP manager, and can be extended to work with other with minimal/no changes in the existing code-base.
 +
 +The purpose of the Device Emulator is to provide reliable testing mocks for network devices. This is achieved by establishing a proxied connection between the development machine and the device to be tested and caching the responses corresponding to each request. In practice, this means that the first of any particular request goes straight through to the device, while all subsequent requests receive a cached copy of the response.
 +
 +The emulator is divided into two parts: the proxy server itself, and the proxy api server for modifying the database of requests and responses.
 +
 +===== Repositories =====
 +[[https://bitbucket.org/errigal/device_emulator/src/node-proxies/ |BackEnd Proxy Server & Express API]]
 +
 +[[https://bitbucket.org/errigal/device-emulator-frontend/src/master/ |FrontEnd]]
 +
 +===== Primary Documentation =====
 +[[https://docs.google.com/document/d/1HQ5aSC3sINXBoyM5teJfLsz8xPT7is2aYzJZTAgugXQ/ |Device Emulator]]
 +
 +==== Show & Tell Slides =====
 +[[https://docs.google.com/presentation/d/1rGz3QRxf0EgmV6gV3zg8_hRVplGKhoXaUSekxhP6myA/edit?usp=sharing
 +| Presentation]]
 +The slides were presented on Wednesday, 3rd April 2019. They give a concise definition of the problem statement and other relevant details regarding the project. 
 +
 +==== Live Versions ====
 +The apps are deployed on scotty as follows 
 +
 +Proxy Server - ''Hostname : 10.5.5.30 Port : 3000''
 +
 +Express Api - ''Hostname : 10.5.5.30 Port : 8080''
 +FrontEnd - 
 +
 +==== Device-Emulator Architecture ====
 +{{:toolsandtechnologies:architecture.png?800|}}
 +
 +=== Running the Back-End/Proxy Server locally ====
 +Prerequisite
 +
 +Ensure you have Node.js latest stable build installed. The build should be accompanied with ''npm'' to install the packages.
 +
 +  * Git clone ''https://bitbucket.org/errigal/device_emulator/src/node-proxies/''
 +  * CD into device_emulator and make sure you're on the ''node-proxies'' branch
 +  * Run npm install in the project root directory. Once the install completes, the proxy can be started with node express_proxy and the server with node express_server [they will be served on different ports respectively]
 +  * The device emulator expects details of the database to be provided on launch. This can be accomplished with a dbparams file in the working directory, or preferably using environment variables as follows:
 +DBHOST The host url of the database
 +
 +username DBUSER The user which the device emulator will be logged in to MySQL as
 +
 +password DBPASS The password for the database user
 +
 +database DBNAME The name of the database where our data will be stored
 +  * Additionally, the details can be passed directly using a command line argument like DBNAME=proxy DBHOST=localhost DBUSER=proxy DBPASS=notsame1 node express_proxy.js
 +  * If the above steps are completed successfully, the proxy should be running and ready to use.
 +
 +==== Connecting to the Proxy ====
 +To use the device emulator, the end user must adjust their network settings to forward all traffic to the proxy server
 +
 +Windows
 +If you are using Windows, open the Internet Options dialog by launching the Control Panel, selecting "Network and Internet", and then selecting "Internet Options". Select the Connections tab, then the LAN Settings button, which will open the LAN settings dialog. Check the box marked "Use a proxy server for your LAN" Check the box "Bypass proxy server for local addresses" Enter the proxy server's address in the address box, and set the Port number to 3000 Save changes by clicking OK.
 +
 +Mac
 +Open the Network window by opening System Preferences and clicking Network Click the Advanced button with your current network selected Click the Proxies tab and check both HTTP and HTTPS proxies For both protocols, enter the proxy server address and set the port to 3000 Click Ok, then Apply to save the settings
 +
 +
 +==== Running HTTPS on Proxy ====
 +The proxy runs on port 3000 and provides both a HTTP and HTTPS proxy using the hoxy node.js library. HTTPS is achieved by an imposter server certified by a fake CA which must be explicitly trusted by the development computer to work. Once the proxy is running, it records every request-response pair to pass through it and saves them to a MySQL database.
 +
 +==== Trusting the Fake CA certificate ====
 +To use the proxy server to access HTTPS endpoints, it is necessary to have the local computer trust the fake CA used by the Device Emulator. The CA cert and key files are saved in the Drive folder for this project, for the purposes of this guide, only the cert file is needed.
 +
 +[[https://drive.google.com/drive/u/1/folders/1iL7xUjPRjU9NOQ04-QIS_R0HYnW2NJ6F|Fake Certificates]]
 +
 +Windows
 +If you're using Microsoft Windows, click the search box on the taskbar or in the Start menu, and type "mmc" to launch the Microsoft Management Console. Click the "File" menu and click "Add/Remove Snap-In." Click "Certificates" under "Available Snap-ins," then click "Add." Click "OK," then click "Computer account" and the "Next" button.
 +
 +Click "Local Computer," then click the "Finish" button. Double-click "Certificates (Local Computer)" in the tree menu, then right-click "Trusted Root Certification Authorities Store." Click "All Tasks" in the pop-up menu, then click "Import." Follow the instructions to find and import the certificate in question.
 +
 +Mac
 +If you're using an Apple Mac computer, you can import a root certificate for a certificate authority using the Keychain system.
 +
 +Type "Keychain Access" in the Spotlight search box, opened by clicking the magnifying glass in the top right of macOS. Click the icon to launch the app, then click the "File" menu and "Import Items." Browse to find the root certificate file, and choose "System" in the "Destination Keychain" drop-down menu.
 +
 +Enter your password if prompted to do so, and log in and out of the computer, or restart it. If the certificate doesn't seem to be immediately trusted – for example, you're receiving warnings or errors attempting to access resources – reopen "Keychain Access." Right-click the certificate and click "Get Info." Open the "Trust" menu, and under "When Using This Certificate," check "Always Trust."
 +
 +==== Running the Front-End Locally ====
 +
 +## Overview
 +
 +Device-Emulator-Front-End is an easy to use user-interface created for the device-emulator project. The purpose of this project is let developers get an overview of the recently called devices through various internal applications along with their request/response data respectively.
 +
 +## Installation requirements.
 +
 +This application is bootstrapped using [Create-React-App](https://github.com/facebook/create-react-app) and uses [Device-Emulator-API Server](https://10.5.5.30:8080) as an API end-point.
 +To run the project locally,
 +
 +1. Git clone this repository
 +   `git clone git@bitbucket.org:errigal/device-emulator-frontend.git`
 +   Cd into **device-emulator**
 +2. Ensure you've Node/Npm/Yarn installed to download the dependencies. The project uses following versions.
 +   - Node : v8.12.0
 +   - NPM : 6.4.1
 +   - Yarn : 1.9.4
 +3. It is recommended to use Yarn for downloading all the dependencies. But in it's absence, NPM would do the job. Perform the following commands from inside the project folder (directory where package.json is located)
 +   `yarn install` or `npm install`
 +
 +4. Once the dependencies are downloaded, you can run the development project server by `npm start` . This should run the application on one of the available ports and the browser will be directed towards that port.
 +
 +5. The environment variables file needs to be created manually (.env) and the data for the same will be sent to via slack. You can copy,paste that data and re-run the application to get the enviroment varibales working.
 +
 +## Libraries Used
 +
 +  *  [ReactJs](https://reactjs.org/)
 +  *  [Redux](https://redux.js.org/)
 +  *  [React-Redux](https://github.com/reduxjs/react-redux)
 +  *  [React-Router](https://github.com/ReactTraining/react-router)
 +  *  [React-Connected-Router](https://github.com/supasate/connected-react-router) : To keep the routes in-synch with the redux store.
 +  *  [Redux-Thunk](https://github.com/reduxjs/redux-thunk)
 +  *  [Prettier](https://github.com/prettier/prettier) : Code formatting.
 +  *  [ES-Lint](https://eslint.org/) : Code Linting.
 +  * [Husky](https://github.com/typicode/husky) : Pre-Commit Utility.
 +  *  [Axios](https://github.com/axios/axios) : Promise based HTTP client.
 +
 +#### Third Party React Web Components
 +
 +- [Semantic UI React](https://react.semantic-ui.com/) : Component Based Styling library.
 +
 +#### Style-Guide
 +
 +- The application uses Semantic UI React components over the traditional semantic UI classes.
 +- To over-ride the default styles of any component, look for styles.css files inside the components root directory & use '!important' attribute on the class which is suppose to be over-ridden.
 +
 +
 +
  

Page Tools

Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki