![](\"/2eaba3e19c661c322acac8ee6fb160ec/Best-SSO-Providers.webp\")
Single Sign-on (or SSO) is a unique authentication method that allows users to access multiple applications with a single set of credentials, like a username and password.
\nSSO products are usually designed to simplify the verification process and create a seamless environment when accessing multiple apps, portals, and servers.
\nOff late, SSO tools have become an integral part of enterprises' and developers' security landscape.
\nSimply put, these implementations have entirely removed the need for users to enter their login credentials for individual applications. Alternatively, users sign in once, and the interface sends the necessary credentials to the assigned systems through various proxies and agents.
\nUsually, identity providers offer SSO as part of their security access protocol. These platforms aren't similar, and the decision to choose the right one should be taken with professional advice.
\nLoginRadius offers the ability to serve a broad range of users to cover everyone in an organization and beyond.
\nWe will breakdown the key features that make LoginRadius a highly rated SSO solution in its space and discuss the implementation process later in this blog.
\nBut first, there are a few things you need to know.
\nSingle Sign-On is the perfect fit for organizations that want to reduce their data protection vulnerabilities, improve consumer experiences, and streamline processes for identity management and log in.
\nWhat else makes single sign-on the best choice for your enterprise? Let's find out.
\nAccording to a survey by Google, 53% of users still reuse the same password for multiple accounts. Therefore, reducing login to a single set of credentials is a good start in reducing the attackers' surface area. Because users log in only once, there are lesser opportunities for mistakes.
\nEnterprises can also go the extra mile with techniques such as two-factor authentication (2FA) and multifactor authentication (MFA).
\nRegulations like HIPAA require users to authenticate before they are allowed to access electronic records along with options like automatic log-off and audit controls to track user access.
\nSSO makes these requirements around data access and control at the granular level. It also allows enterprises and developers to comply with regulations that require provisioning and deprovisioning users.
\nBecause users need not remember multiple credentials for multiple logins anymore, it definitely saves time and improves productivity. Also, remembering one password instead of many miraculously reduces password fatigue. More so, it gives users the perfect opportunity to come up with even stronger passwords.
\nThis one is interlinked. When there are lesser passwords to remember, there will be even lesser chances of users forgetting them—leading to a reduced number of reset help tickets. This will reduce the need for IT involvement and lower IT costs.
\n
Looking for factors to consider when selecting an SSO solution. The following are the top five.
\nA good single sign-on solution will let you customize the user experience. For instance, it will let you transform your login page into something that resonates with your corporate branding.
\nApart from the flexible appearance, it will help you make adjustments to your security practices as well. You should be able to add various authentication factors at your discretion.
\nYou need to ensure that your single sign-on solution offers everything that your company requires (including access to certain custom applications)—however, it takes experience to ascertain the same. Yet, look for options that provide 100% uptime and the tools to monitor usage in realtime.
\nGiven its growing popularity in web applications, any feasible SSO provider should support SAML authentication for applications at a fundamental level.
\nSAML (or Security Assertion Markup Language) allows users to authenticate to web applications without passwords. This authentication approach centralizes and simplifies their login process. It is much better than entering passwords for each application because the end-users no longer enters credentials across third-party websites.
\nYou should also ensure that your MFA solution enables multi factor authentication too. It is one of the security expert's favorite tools to dodge majority data breaches— more than implementing password complexity or expiration requirements.
\nAnother primary requirement of MFA in SSO is because end-users access all their applications through a single portal, it is critical that the portal should be closely guarded for security.
\nThough not an unconditional necessity, it is a good gesture if the SSO solutions offer free trials. It will be a lot easier if you get to assess a solution by testing if it is the right solution. Therefore, make it a point to ask for free trials, if possible.
\n![](\"/d74d21894c656411ec9bbccf0b1f6b2e/Best-SSO-Providers-2.webp\")
LoginRadius goes beyond a single sign-on solution with its broader consumer identity and access management functions, but it is an excellent platform for SSO nonetheless.
\nWith its simple-to-use one-click access, it works great for small to large-scale, consumer-facing deployment. The added 2FA/MFA security protects data—both in-house and consumers.
\nThe LoginRadius Identity Platform offers SSO in the following ways:
\nHere is how the LoginRadius SSO benefits developers and businesses.
\nThe LoginRadius Single Sign-On takes the authentication load off web app developers, as the end-user authentication functionality is transferred outside the app.
\nAnother good reason for developers to shift to LoginRadius is they can embed SSO with LoginRadius. This comprehensive digital identity feature can be implemented with Identity-as-a-Service (IDaaS).
\nBecause developers need not focus on complex authentication anymore, it (kind of) gives the liberty to work on other functions of the application.
\n![\"LoginRadius](\"/ab06ab634e368aaabe85e57dcb6b0699/DS-LoginRadius-Single-Sign-on.webp\")
Why should any enterprise invest in the LoginRadius SSO? We have three main factors that will motivate your decision.
\nLoginRadius guarantees unparalleled uptime 99.99% every month. The cloud-based identity provider manages 180K logins per second, 20 times more than its major competitors!
\nApart from delivering the industry's best consumer, the following are a few ways where the platform excels compared to its competitors.
\nSo far, so good?
\nWilling to try out the LoginRadius SSO for your business? You can register for a free account here.
\nHere is the step-by-step guide on configuring Web Single Sign-On with LoginRadius.
\nStep 1: Log in to the LoginRadius Admin Console account. Navigate to Deployment and click on Apps.
\n![](\"/af213ab7a164995af568e7b73c4d26ce/Best-SSO-Providers-3.webp\")
Step 2: Under the Production Website URL, add the domains you want to implement your Web SSO. There is an Add New Site button at the bottom. Click on it to add the domains.
\n![](\"/59aacaa583fa99352e3cc64acdd0046e/Best-SSO-Provider-4.webp\")
Single Sign-On clearly improves consumer experience and boosts productivity by a considerable margin.
\nBy implementing the benefits of the LoginRadius SSO as a unified solution, you increase business agility, security, convenient and streamlined experience for your business and consumers alike. And, that's awesome!
\n![\"book-a-free-demo-loginradius\"](\"/788a6a84e389edac18728007099fdc1d/Book-a-free-demo-request-1024x310.webp\")
In JavaScript, web workers allow developers to benefit from parallel programming. Parallel programming enables various computations to be performed at the same time by applications. It is helpful to consider the importance of web staff as an example of how humans benefit from parallel tasks.
\nWeb workers give us the ability to write multi-threaded Javascript that doesn't block the DOM. To some extent, even asynchronous operations block the DOM. On the other hand, Web employees help us solve this problem, escape from the single-threaded world, and achieve higher performance on our web pages.
\nWeb Workers are a simple means of running scripts in background threads for web content. Without interfering with the user interface, the worker thread may perform tasks.
\nFurthermore, they can use XMLHttpRequest to perform I/O (although the responseXML and channel attributes are always null) or fetch (with no such restrictions). Once created, by posting messages to an event handler defined by that code, a worker can send messages to the JavaScript code that made it (and vice versa).
\nWeb workers let you build background threads separate from the main execution thread, where the logic of the user interface is usually executed.
\nThe key benefit of this separation of workload is that inside an isolated thread and without interrupting or impacting the main thread's responsiveness and usability, you can perform costly operations.
\nWhen the background thread completes its mission, the main thread is informed of the results seamlessly via an event handled by standard JavaScript event handling.
\n<!DOCTYPE html>\n<html lang="en">\n <head>\n <meta charset="UTF-8" />\n <meta name="viewport" content="width=device-width, initial-scale=1.0" />\n <title>Club JavaScripters</title>\n </head>\n <body>\n <button>Can you click me?</button>\n <h2>Let's do the party. 👯♂️</h2>\n <ul id="club"></ul>\n <script src="./main.js"></script>\n </body>\n</html>We just created a simple HTML page with a link to our javascript file which we will create in a moment.
\nmain.js and worker.js in the same folder.main.js
const persons = [\n {\n name: "Hriday",\n isMember: true,\n },\n {\n name: "Hridayesh",\n isMember: false,\n },\n {\n name: "Bob",\n isMember: true,\n },\n {\n name: "Daisy",\n isMember: true,\n },\n]\n\n// Our club container\nconst club = document.getElementById("club")\nlet worker\n\n/**\n * Function entry allows entry to people coming to our club\n */\nfunction entry(persons) {\n persons.forEach(person => {\n const { isMember, name } = person\n const listItem = document.createElement("li")\n listItem.textContent = name\n // if a person is not registered, register them first\n if (!isMember) {\n // create a new worker thread\n worker = new Worker("worker.js")\n // pass data to worker thread\n worker.postMessage(name)\n // listen to any data passed from worker thread\n worker.addEventListener("message", event => {\n if (event.data) {\n club.appendChild(listItem)\n }\n })\n } else {\n // if they are registered let them in\n club.appendChild(listItem)\n }\n })\n}\n\nentry(persons)worker.js
// addEventListener is directly accessible in worker file\naddEventListener("message", event => {\n // extract person passed from main thread from event object\n let person = event.data\n registerMember(person)\n})\n\nfunction registerMember(member) {\n // generating membership card takes some amount of time\n let i = 0\n while (i < Math.pow(10, 10)) {\n i++\n }\n // send result back to the main thread\n postMessage(true)\n close()\n}Now, the problem I faced when I went to the club with Hriday was that I (and everyone else after me) had to wait for my registration process to complete. We don't want that to happen to our virtual club and therefore we added one more person (thread) who is in charge of the whole registration process. Once registration is done, he will tell the main guy(thread) to let the new person in.
\nnew Worker('path to worker code') and pass that person to the worker thread using worker.postMessage() and add the person as a member after registering them.while loop. In real life this could be some cryptographic code, image processing or anything that is CPU intensive and might block the main thread and make the page unresponsive.postMessage and the main thread listens for it using onmessage handler and lets the person in the club i.e add to DOM.close().They talk to each other by message passing. Both workers and the main thread use postMessage to send data to each other and onmessage event handler to get data. The data is available inside the event's data property.\nYou can only pass one argument to postMessage. If you wish to pass multiple arguments use an object instead.
No you can not update DOM in a worker thread as worker threads run in a separate context from the main window and don't have access to window object and document object but they do have access to some of the window object's capabilities like Websockets and indexedDB.
It's important that the worker code must be in a separate file, which we can use to create a separate worker thread by using the Worker constructor and passing it the path of the file.
You were able to click that button because we did not block the main thread.\nTo see the difference add the following code to main.js and see the difference.
const persons = [\n {\n name: "Joe",\n isMember: true,\n },\n {\n name: "Hriday",\n isMember: true,\n },\n {\n name: "Hridayesh",\n isMember: false,\n },\n {\n name: "Bob",\n isMember: true,\n },\n {\n name: "Daisy",\n isMember: true,\n },\n]\n\n// Our club container\nconst club = document.getElementById("club")\nlet worker\n\nfunction entry() {\n persons.forEach(person => {\n const { isMember, name } = person\n const listItem = document.createElement("li")\n listItem.textContent = name\n if (!isMember) {\n let memeberAdded = registerMember(person)\n if (memeberAdded) club.appendChild(listItem)\n } else {\n club.appendChild(listItem)\n }\n })\n}\n\nentry()\n\nfunction registerMember(member) {\n let i = 0\n while (i < Math.pow(10, 10)) {\n i++\n }\n return true\n close()\n}You can share that answer in the comment section 😉 To get the full code you can visit to Github Repo
\nWe introduced web workers in this article, a technology that helps the web industry keep up with demanding web applications. This is achieved by providing web apps with a way to exploit multiprocessor and multi-threaded machines by granting JavaScript some multi-threaded superpowers.
\nDo you have any tips on web workers and the web as a forum for programming? Let us know in the comment section below.
\n","frontmatter":{"date":"September 09, 2020","updated_date":null,"description":" Learn how web workers help with the success of the web app and get started by creating a simple web worker for JavaScript.","title":"Web Workers: How to add multi-threading in JS","tags":["JavaScript","Web"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.7699115044247788,"src":"/static/2e0bb83a49cc5eb5b04a62c51cf495bb/58556/cover.webp","srcSet":"/static/2e0bb83a49cc5eb5b04a62c51cf495bb/61e93/cover.webp 200w,\n/static/2e0bb83a49cc5eb5b04a62c51cf495bb/1f5c5/cover.webp 400w,\n/static/2e0bb83a49cc5eb5b04a62c51cf495bb/58556/cover.webp 800w,\n/static/2e0bb83a49cc5eb5b04a62c51cf495bb/99238/cover.webp 1200w,\n/static/2e0bb83a49cc5eb5b04a62c51cf495bb/135cd/cover.webp 1280w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Hridayesh Sharma","github":"vyasriday","avatar":null}}}},{"node":{"excerpt":"In this article, we will learn about state management in Angular with NGXS. Here we will understand the basic concept of NGXS and create a…","fields":{"slug":"/engineering/angular-state-management-with-ngxs/"},"html":"In this article, we will learn about state management in Angular with NGXS. Here we will understand the basic concept of NGXS and create a simple TO-DO App.
\nIn the bigger apps, managing the data states is very complicated. In angular, each component has its own state, to share the data/state between the components we normally use @Input and @Output decorators, but when the application goes bigger, its challenging to maintain the data consistency. So to solve this problem, redux was introduced. It provides a central store that holds all states of your application. Each component can access the stored state without sending it from one component to another.
\n![\"Image\"](\"/5ac6cd1b06711301cfa8fe17715dd789/redux.webp\")
NGXS is a state management pattern + library. It provides as a single source of truth for your application's state, providing simple rules for predictable state mutations.
\nNGXS is modeled after the CQRS pattern popularly implemented in libraries like Redux and NgRx but reduces boilerplate by using modern TypeScript features such as classes and decorators.
\nNGXS is very simple to use as compared to other state management patterns like redux and Akita. NGXS takes full advantage of angular and typescript over the redux pattern.\nThere are majors 4 concepts to NGXS
\nIt is a global state container and manages the states of the application.We can dispatch the actions to perform certain operations.
\n this.store.dispatch(new TodoActions.AddTodo(form));An action is a type of command which should be called when something happens or you want to trigger at any event like adding a new todo, listing todos etc.
\nexport class AddTodo {\n static readonly type = '[Todo] Add';\n constructor(public payload: ITodo) { }\n}States are classes along with decorators to describe metadata and action mappings.
\nimport { Injectable } from '@angular/core';\nimport { State } from '@ngxs/store';\n\n@State<ITodoStateModel[]>({\n name: 'todoList',\n defaults: {\n todoList: [],\n },\n})\n@Injectable()\nexport class TodoState {}Selects are functions that slice a specific portion of the state from the global state container i.e. to get the data from the specific global state whenever you want to use.
\n @Select(TodoState) todoList$: Observable<ITodo>;Install the npm install @ngxs/store --save then import the below code in app.module.ts
//File name app.module.ts\nimport { NgxsModule } from '@ngxs/store';\n@NgModule({\n imports: [\n NgxsModule.forRoot([ToDoState], { // here login state \n developmentMode: !environment.production\n })\n ]\n})\nexport class AppModule {}Here we have created a component that dispatches actions to create a to-do and for other operations. Apart from that, we are using a selector TodoState, from which we are listening for the updated to-do list.
Put this code in the app.component.ts
// File name app.component.ts\nimport { Component } from '@angular/core';\nimport { Store, Select } from '@ngxs/store';\nimport { TodoActions } from './state/todo-actions';\nimport { FormGroup, FormControl, Validators } from '@angular/forms';\nimport { TodoState, ITodo } from './state/todo-state';\nimport { Observable } from 'rxjs';\n@Component({\n selector: 'app-root',\n templateUrl: './app.component.html',\n styleUrls: ['./app.component.scss']\n})\nexport class AppComponent {\n title = 'ngxs-todo-app';\n\n @Select(TodoState) todoList$: Observable<ITodo>;\n\n addForm = new FormGroup({\n title: new FormControl('', [Validators.required])\n });\n constructor(private store: Store){}\n onSubmit(form: any){\n this.store.dispatch(new TodoActions.AddTodo(form));\n }\n markDone(id: string, is_done: boolean){\n this.store.dispatch(new TodoActions.markDone(id, is_done));\n }\n}Create a folder state and put the todo-actions.ts file and add below code
// File name todo-actions.ts\nexport class AddTodo {\n static readonly type = '[Todo] Add';\n constructor(public payload: any) { }\n}\n\nexport class EditTodo {\n static readonly type = '[Todo] Edit';\n constructor(public payload: any) { }\n}\n\nexport class FetchAllTodos {\n static readonly type = '[Todo] Fetch All';\n}\n\nexport class DeleteTodo {\n static readonly type = '[Todo] Delete';\n constructor(public id: number) { }\n}Here we have created the state of the todo, it contains the global state of the todo list.\nCreate a folder state and put the todo-state.ts file and add below code
// File name todo-state.ts\nimport { Injectable } from '@angular/core';\nimport { State, NgxsOnInit, Action, StateContext } from '@ngxs/store';\nimport { TodoActions } from './todo-actions';\nimport { patch, updateItem } from '@ngxs/store/operators';\n\nexport interface ITodo {\n id: string;\n title: string;\n is_done: boolean;\n}\nexport interface ITodoStateModel {\n todoList: ITodo[];\n}\n@State<ITodoStateModel>({\n name: 'todoList',\n defaults: {\n todoList: [],\n },\n})\n@Injectable()\nexport class TodoState implements NgxsOnInit {\n ngxsOnInit(ctx) {\n ctx.dispatch(new TodoActions.FetchAllTodos());\n }\n @Action(TodoActions.markDone)\n markDone(\n ctx: StateContext<ITodoStateModel>, \n { payload, is_done }: TodoActions.markDone\n ) {\n ctx.setState(\n patch({\n todoList: updateItem(\n (item: ITodo) => item.id === payload, \n patch({ is_done: !is_done })\n )\n })\n );\n }\n\n @Action(TodoActions.AddTodo)\n add(\n ctx: StateContext<ITodoStateModel>,\n { payload }: TodoActions.AddTodo,\n ) {\n const state = ctx.getState();\n ctx.setState({\n ...state,\n todoList: [\n ...state.todoList,\n {\n ...payload,\n id: Math.random().toString(36).substring(7),\n is_done: false\n }\n ],\n }\n );\n }\n\n}Here we have created a form that we use to create todo and listed all todos.\nput this code in your app.component.html
<!-- File name app.component.html -->\n<form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)">\n <input type="text" formControlName="title" class="form-control todo-list-input" placeholder="What do you need to do today?">\n <button class="add btn btn-primary font-weight-bold todo-list-add-btn">Add</button> \n</form>\n<ul class="d-flex flex-column-reverse todo-list">\n <li *ngFor="let todo of (todoList$ | async) ?. todoList" [ngClass]="{'completed': todo.is_done}">\n <div class="form-check"> \n <label class="form-check-label"> \n <input (click)="markDone(todo.id, todo.is_done)" class="checkbox" type="checkbox" [checked]="todo.is_done">{{todo.title}} <i class="input-helper"></i></label> \n </div>\n </li>\n </ul>After lots of code, it's time to see the results. So here is the UI you will get. To get the complete code please go to Github Repo.\n![\"Image\"](\"/0a459b57ae655895daa6da6aa1b87c3a/result.webp\")
We have gone through the basic concepts of NGXS and built a simple to-do app. There are a lot of advanced features and plugins by NGXS, but beyond the scope, we could not add, but hopefully, we will be exploring in future blogs.
\n","frontmatter":{"date":"September 08, 2020","updated_date":null,"description":"NGXS is a state management pattern + library for Angular. It acts as a single source of truth for your application's state, providing simple rules for predictable state mutations.","title":"Angular State Management With NGXS","tags":["Angular","NGXS","Redux"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.2903225806451613,"src":"/static/a6cc04de422582309bcb1c936a4244d6/58556/title-image.webp","srcSet":"/static/a6cc04de422582309bcb1c936a4244d6/61e93/title-image.webp 200w,\n/static/a6cc04de422582309bcb1c936a4244d6/1f5c5/title-image.webp 400w,\n/static/a6cc04de422582309bcb1c936a4244d6/58556/title-image.webp 800w,\n/static/a6cc04de422582309bcb1c936a4244d6/4ff9f/title-image.webp 875w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Akshaya Sharma","github":"akshay-js","avatar":null}}}},{"node":{"excerpt":"Go announced Go 1.15 version on 11 Aug 2020. Highlighted updates and features include Substantial improvements to the Go linker, Improved…","fields":{"slug":"/engineering/what-is-the-new-go-1-15/"},"html":"Go announced Go 1.15 version on 11 Aug 2020. Highlighted updates and features include Substantial improvements to the Go linker, Improved allocation for small objects at high core counts, X.509 CommonName deprecation, GOPROXY supports skipping proxies that return errors, New embedded tzdata package, Several Core Library improvements and more.
\nAs Go promise for maintaining backward compatibility. After upgrading to the latest Go 1.15 version, almost all existing Golang applications or programs continue to compile and run as older Golang version.
\nDownload the latest Go Version from Golang.
\nGo 1.14 version announced some changes for the macOS. According to announcement
\n\n\nGo 1.14 is the last release that will run on macOS 10.11 El Capitan. Go 1.15 will require macOS 10.12 Sierra or later.
\n
The lastest macOS 10.15 (Catalina) is no longer supporting 32-bit binaries. Go 1.14 will likely to be the last Go release to support 32-bit binaries on iOS, iPadOS, watchOS, and tvOS (the darwin/arm port). Go continues to support the 64-bit darwin/amd64 port.
\nGo now generates Windows ASLR executables when -buildmode=pie cmd/link flag is provided. Go command uses -buildmode=pie by default on Windows.
The -race and -msan flags now always enable -d=checkptr, which checks uses of unsafe. Pointer. This was previously the case on all OSes except Windows.
Mobile applications were crashing in some devices due to some invalid lld linker versions so now avoiding the crashing the latest Go 1.15 version explicitly selects the lld linker available in recent versions of the NDK. This explicitly lld linker avoids crashes on some devices. it becomes the default NDK linker in a future NDK version.
\nAlways new Go 1.15 brings many minor/major performance improvements. The first major improvement has reduced the executable's binary size by almost 5% - 10% as compared to Go 1.14. As Brad Fitzpatrick tweet, test program down from 8.2MB in Go 1.14 to 3.9MB in 1.15.
\n![\"image](\"/a10871d02098a24f6fe343b6f08f4c46/lr-tweet1.webp\")
![\"image](\"/ca9436ff8af17f9b3eb9d90f38fe1c8a/lr-tweet2.webp\")
Go 1.15 has improved the code build process now unused code is eliminating in the new linker, along with several targeted improvements, such as Clements's CL 230544, which reduces the number of stack and register maps included in the executable.
\nAlways in every new version release Go come with various minor changes and updates to the library. I m including some useful and important changes
\nA new embedded tzdata package was added that permits embedding the timezone database into a program. Importing this package (as import _ \"time/tzdata\") which allows the program to find timezone information without the timezone database on the local system. We can also embed the timezone database by building with -tags timet/zdata. This approach increases the size of the program by about 800 KB. This might be useful and can test some code with the virtualized environments like Go playground.
\nGo older versions were using CommonName field on X.509 certificates as a hostname if there is no Subject\nAlternative Names, would be disabled by default. If Still want to use this legacy behavior then we need to add x509ignoreCN=0 in the GODEBUG environment variable.
\nThe net/url package adds a new URL. The redacted () method that returns the URL as a string. This is proposed in the Issue 34855. It is a very useful improvement for audit logging and security. It's a simple derivation from the URL.String() that masks the password if exists from the string being passed. It does not modify at all to the URL itself but a copy of it.
Go 1.15 has released with various improvements, bug fixes. We can get all improvements, closed proposals and features details for the Go GitHub repository.
\nProgramming is an excellent exercise for your brain as programmers deal with never-ending situations like bugs, compiler, issues, deadlines, languages, etc. During all these times, other than the phenomenal codes, we produce MEMEs and a hell lot of MEMEs
\nMEMEs can light the environment for every programmer in the world. On that note, there is a famous saying-
\n“If debugging is the process of removing software bugs, then programming must be the process of putting them in – Edsger Dijkstra”
\n![](\"/92d365102f4e0aa4ed28fd3792d2dbab/1.webp\")
![](\"/a6356f51e42b2bef3d3c7f344a3cccac/2.webp\")
![](\"/7b595198d76bf95bbaa04f38db83a6e0/3.webp\")
![](\"/3cdb810f7d4cbab1abd9efab760bf31c/4.webp\")
![](\"/abe25460f49910f38bf3905c3e6bc92a/5.webp\")
![](\"/6c40fd443d317f6336ff217394d8b823/6.webp\")
![](\"/eea80f27abb734e40f8a54fd82146b64/7.webp\")
![](\"/bbb9a1aecb60562e66bb76ab514b2ff7/8.webp\")
![](\"/2629e7ad85b82b43459a17bbdc3eb944/9.webp\")
![](\"/ec922c4831551504ec08ccf4190d2a7e/10.webp\")
![](\"/0428e4ac0a24a56a62b1873e72d1d9cd/11.webp\")
![](\"/66a6a748d64d86748a1494483c82e54f/12.webp\")
![](\"/fb1e80e92dbce9d0bc3e2f804c64b911/13.webp\")
![](\"/bbe110328664f8801c5800365b03fc96/14.webp\")
![](\"/5c697f3b17fb655a68387523f32698b7/15.webp\")
![](\"/eecbac368fb5a3ab862e6e1089d60a3d/16.webp\")
![](\"/5dc297418f8ad85dd90290d44104f5f9/17.webp\")
![](\"/8e200d55702f5ed1a76b94bbc5cb8280/18.webp\")
![](\"/a98f6979b134ea833bac5d5c7aef2716/19.webp\")
![](\"/84736e80449dbb958347794c816b96a0/21.webp\")
If you have better ones, reply in the comments below and we’ll include them.
\n","frontmatter":{"date":"September 04, 2020","updated_date":null,"description":null,"title":"Let’s Take A MEME Break!!!","tags":["MEME","Programming","Humor"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.7241379310344827,"src":"/static/70f72136eb4f9f794700c1b2afd974c8/25338/cover.webp","srcSet":"/static/70f72136eb4f9f794700c1b2afd974c8/61e93/cover.webp 200w,\n/static/70f72136eb4f9f794700c1b2afd974c8/1f5c5/cover.webp 400w,\n/static/70f72136eb4f9f794700c1b2afd974c8/25338/cover.webp 550w","sizes":"(max-width: 550px) 100vw, 550px"}}},"author":{"id":"Ashish Sharma","github":"ashish8947","avatar":null}}}},{"node":{"excerpt":"PKCE is an OAuth 2.0 security extension for public clients on mobile devices intended to avoid a malicious programme creeping into the same…","fields":{"slug":"/engineering/pkce/"},"html":"PKCE is an OAuth 2.0 security extension for public clients on mobile devices intended to avoid a malicious programme creeping into the same computer from intercepting the authorisation code. The RFC 7636 introduction discusses the mechanisms of such an attack.
\nPKCE has a different specification of its own. It allows applications to use the most reliable OAuth 2.0 flows in public or untrusted clients - the Authorization Code flow. In order to efficiently use a dynamically generated password, it achieves this by doing some setup work before the flow and some verification at the end of the flow.
\nThis is important because getting a fixed secret in a public client is not safe.
\nIn this blog, we will see how PKCE is useful in authorization code flow for OAuth and OIDC and how you can use this with your OAuth and OpenID Connect providers.
\nProof Key for Code Exchange as known as PKCE, is a key for preventing malicious attacks and securely performing code authorization flow.
\nI would say, PKCE is used to provide one more security layer to the authorization code flow in OAuth and OpenID Connect.
\nPKCE is mainly useful for the client-side application or any web apps that are using the client secret key and used to replace the static secret used in the authorization flow.
\nThis flow basically works with two parameters Code Verifier and Code challenge. Let's see what are these parameters, how we use them, and generate them.
\nThe code verifier is a cryptographically random string using the characters A-Z, a-z, 0-9, and the punctuation characters -._~ (hyphen, period, underscore, and tilde), between 43 and 128 characters long.\nOnce the client has generated the code verifier, it uses that to create the code challenge.
\nFor devices that can perform a SHA256 hash, the code challenge is a BASE64-URL-encoded string of the SHA256 hash of the code verifier.
\nHere you can see the examples to generate the Code verifier and code challenge in different languages. Either you can find Node and Go Packages for this but I would recommend you to not depend on any package for such small things.
\nNodeJs
\nvar crypto = require("crypto")\n\nfunction base64URLEncode(str) {\n return str.toString('base64')\n .replace(/\\+/g, '-')\n .replace(/\\//g, '_')\n .replace(/=/g, '');\n}\nvar verifier = base64URLEncode(crypto.randomBytes(32));\nconsole.log("code_verifier: ", verifier)\n\nif(verifier){\n var challenge = base64URLEncode(sha256(verifier));\n console.log("code_challenge: ",challenge)\n}\n\n\nfunction sha256(buffer) {\n return crypto.createHash('sha256').update(buffer).digest();\n}Golang
\npackage main\n \nimport (\n "crypto/sha256"\n "encoding/base64"\n "fmt"\n "math/rand"\n "strings"\n "time"\n)\n \ntype CodeVerifier struct {\n Value string\n}\n \nconst (\n length = 32\n)\n \nfunc base64URLEncode(str []byte) string {\n encoded := base64.StdEncoding.EncodeToString(str)\n encoded = strings.Replace(encoded, "+", "-", -1)\n encoded = strings.Replace(encoded, "/", "_", -1)\n encoded = strings.Replace(encoded, "=", "", -1)\n return encoded\n}\n \nfunc verifier() (*CodeVerifier, error) {\n r := rand.New(rand.NewSource(time.Now().UnixNano()))\n b := make([]byte, length, length)\n for i := 0; i < length; i++ {\n b[i] = byte(r.Intn(255))\n }\n return CreateCodeVerifierFromBytes(b)\n}\n \nfunc CreateCodeVerifierFromBytes(b []byte) (*CodeVerifier, error) {\n return &CodeVerifier{\n Value: base64URLEncode(b),\n }, nil\n}\n \nfunc (v *CodeVerifier) CodeChallengeS256() string {\n h := sha256.New()\n h.Write([]byte(v.Value))\n return base64URLEncode(h.Sum(nil))\n}\n \nfunc main() {\n verifier, _ := verifier()\n fmt.Println("code_verifier: ", verifier.Value)\n challenge := verifier.CodeChallengeS256()\n fmt.Println("code_challenge :", challenge)\n}\n In the OAuth Authorization flow, we need to have the code verifier and code challenge to start with the authentication and obviously an OAuth provider to connect.
\nFor the initial request, we need to pass the codechallenge and codechallenge_method to the OAuth or OIDC provider that supports PKCE based flow.
\nThe request will look like:
\nProvider + /oauth/redirect?\nclient_id={client_id}\n&redirect_uri={Callback URL}\n&scope={Scope}\n&response_type=code\n&state={random long string}\n&code_challenge={code challenge}\n&code_challenge_method=SHA256The provider should redirect you to the authentication/login page and where you’ll get the code after successful authentication.
\nIn the code exchange request, we need to pass the code we have received through the above request and the code verifier that we have generated in our first step.
\nPOST Provider + /oauth/access_token\n\nRequest body:\n{\n client_id:{client_id},\n client_secret:{client_secret},\n redirect_uri:{redirect_uri},\n response_type:token,\n Code:{code} // That we have received in authorization request\n code_verifier: {code verifier // generated in the first step\n}Once the codeverificer hash matches with the codechallenge of the authorization request, You will get the token in the response with status code 200 OK.
\n{\n "access_token": "c5a****b-****-4*7f-a********e4a",\n "token_type": "access_token",\n "refresh_token": "5*****82-b***-**82-8c*1-*******7ce",\n "expires_in": 11972\n}That's it and you've implemented PKCE flow in your application.
\n","frontmatter":{"date":"September 03, 2020","updated_date":null,"description":"If you are working with OAuth and OIDC authorization code flow and want to setup PKCE flow then this article will help you to understand everything about PKCE.","title":"PKCE: What it is and how to use it with OAuth 2.0","tags":["PKCE","Oauth","OIDC"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.5037593984962405,"src":"/static/7522430985a36d7f8c6267ed773d5447/ad85c/pkce.webp","srcSet":"/static/7522430985a36d7f8c6267ed773d5447/61e93/pkce.webp 200w,\n/static/7522430985a36d7f8c6267ed773d5447/1f5c5/pkce.webp 400w,\n/static/7522430985a36d7f8c6267ed773d5447/ad85c/pkce.webp 600w","sizes":"(max-width: 600px) 100vw, 600px"}}},"author":{"id":"Narendra Pareek","github":"pareek-narendra","avatar":null}}}}]},"markdownRemark":{"excerpt":"Identity is evolving, and developers are at the forefront of this transformation. Every day brings a new learning—adapting to new standards…","fields":{"slug":"/identity/developer-first-identity-provider-loginradius/"},"html":"Identity is evolving, and developers are at the forefront of this transformation. Every day brings a new learning—adapting to new standards and refining approaches to building secure, seamless experiences.
\nWe’re here to support developers on that journey. We know how important simplicity, efficiency, and well-structured documentation are when working with identity and access management solutions. That’s why we’ve redesigned the LoginRadius website—to be faster, more intuitive, and developer-first in every way.
\nThe goal? Having them spend less time searching and more time building.
\nLoginRadius’ vision is to give developers a product that simplifies identity management so they can focus on building, deploying, and scaling their applications. To enhance this experience, we’ve spent the last few months redesigning our interface— making navigation more intuitive and reassuring that essential resources are easily accessible.
\nHere’s a closer look at what’s new and why it’s important:
\n![\"This](\"/f46881583c7518a93bb24e94c32320de/a-developer-friendly-dark-theme.webp\")
Developers spend long hours working in dark-themed IDEs and terminals, so we’ve designed the LoginRadius experience to be developer-friendly and align with that preference.
\nThe new dark mode reduces eye strain, enhances readability, and provides a seamless transition between a coding environment and our platform. Our new design features a clean, modern aesthetic with a consistent color scheme and Barlow typography, ensuring better readability. High-quality graphics and icons are thoughtfully placed to enhance the content without adding visual clutter.
\nSo, whether you’re navigating our API docs or configuring authentication into your system, our improved interface will make those extended development hours more comfortable and efficient.
\n![\"This](\"/e5358b82be414940f3fb146013845933/capabilities.webp\")
We’ve restructured our website to provide a straightforward breakdown of our customer identity and access management platform capabilities, helping you quickly find what you need:
\nThis structured layout ensures you can quickly understand each capability and how it integrates into your identity ecosystem.
\n![\"This](\"/a8c155c2b6faf3d5f4b4de4e2b14d763/developers-menu.webp\")
We’ve been analyzing developer workflows to identify how you access key resources. That’s why we redesigned our navigation with one goal in mind: to reduce clicks and make essential resources readily available.
\nThe new LoginRadius structure puts APIs, SDKs, and integration guides right at the menu bar under the Developers dropdown so you can get started faster. Our Products, Solutions, and Customer Services are also clearly categorized, helping development teams quickly find the right tools and make informed decisions.
\n![\"This](\"/b2f9a964a2da0ea83e2f8596b833bba7/we-support-your-tech-stack.webp\")
Developers now have a clear view of the tech stack available with LoginRadius, designed to support diverse business needs.
\nOur platform offers pre-built SDKs for Node.js, Python, Java, and more, making CIAM integration seamless across popular programming languages and frameworks.
\nCheck out our revamped LoginRadius website and see how the improved experience makes it easier to build, scale, and secure your applications.
\nDo not forget to explore the improved navigation and API documentation, and get started with our free trial today. We’re excited to see what you’ll build with LoginRadius!
\n","frontmatter":{"date":"February 21, 2025","updated_date":null,"description":"LoginRadius’ vision is to give developers a product that simplifies identity management so they can focus on building, deploying, and scaling their applications. To enhance this experience, we’ve redesigned our website interface, making navigation more intuitive and reassuring that essential resources are easily accessible.","title":"Revamped & Ready: Introducing the New Developer-First LoginRadius Website","tags":["Developer tools","API","Identity Management","User Authentication"],"pinned":true,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.7857142857142858,"src":"/static/80b4e4fbe176a10a327d273504607f32/58556/hero-section.webp","srcSet":"/static/80b4e4fbe176a10a327d273504607f32/61e93/hero-section.webp 200w,\n/static/80b4e4fbe176a10a327d273504607f32/1f5c5/hero-section.webp 400w,\n/static/80b4e4fbe176a10a327d273504607f32/58556/hero-section.webp 800w,\n/static/80b4e4fbe176a10a327d273504607f32/99238/hero-section.webp 1200w,\n/static/80b4e4fbe176a10a327d273504607f32/7c22d/hero-section.webp 1600w,\n/static/80b4e4fbe176a10a327d273504607f32/1258b/hero-section.webp 2732w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Rakesh Soni","github":"oyesoni","avatar":"rakesh-soni.webp"}}}},"pageContext":{"limit":6,"skip":738,"currentPage":124,"type":"///","numPages":164,"pinned":"ee8a4479-3471-53b1-bf62-d0d8dc3faaeb"}},"staticQueryHashes":["1171199041","1384082988","2100481360","23180105","528864852"]}