The latest version of Chrome does not store the authentication token in the local session when using msal-browser

I have a Teams React app, but ever since the last Chrome update, I haven't been able to save the authentication token in local session with MSAL. Here is my configuration:

  • MSAL-broswer: 2.38.1
  • Chrome version: 117
  • MSAL-configuration: `
{
    auth: {
        clientId: config.clientId,
        authority: Config.authority,
        redirectUri: config.redirectUri
    },
    cache: {
        cacheLocation: "localStorage",
        storeAuthStateInCookie: true,
    }
}

I attempted to downgrade the Chrome version and everything worked perfectly fine.

reactjsgoogle-chromeazure-ad-msalteams-toolkitmsal-react

Answer №1

It's important to regularly update your MSAL library to ensure compatibility with the latest browser changes.

Answer №2

After seeking guidance from this source, I resolved the issue by turning off the "Experimental third-party storage partitioning" option in the experimental settings.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

After upgrading the version of @testing-library/jest-dom from 4.0.0 to 4.2.0, the React test case started to encounter failures

After upgrading the version of @testing-library/jest-dom from 4.0.0 to 4.2.0, there seems to be an issue with react test cases that use toHaveStyles to check styles. Using react-testing-library: test('renders component', () => { const { getBy ...

reactjsjestjsmaterial-uireact-testing-library

Using Tailwind CSS to center a NexJS <Image /> component within a modal

In an effort to style my MapBoxGL popup content, I am working on aligning the text above the image to the left and centering the image below within the popup. As shown in the image below, this is currently proving to be a challenge as I transition from usi ...

cssreactjsnext.jstailwind-cssnext-images

I need to route the user to a specific page after they log in, depending on their role, and prevent them from accessing a certain page

Previously, I successfully implemented this functionality using Redux and MongoDB. However, when trying to achieve the same with MySQL, it is not working as expected. Currently, the logic redirects all users to the admin dashboard, but I want to implement ...

mysqlnode.jsreactjsexpressredux

Trouble with ReactJS render not reflecting changes in get function

Recently, I made some updates to the authentication process on my server for my single-page express/react app. However, when running the express server, I noticed that the updated .get function was not being served by my app. Do you have any ideas on why t ...

node.jsreactjsexpress

Difficulty accessing context.params query in Next.js Dynamic Path

I've almost completed setting up a dynamic page in Next.js using getStaticPaths(), but I'm running into an issue with the getStaticProps() function not referencing the URL query correctly to load the relevant information. Here is my code: //Get ...

javascriptreactjsnext.js

Retrieving Information with NextJS and Material UI components in React

In my quest to develop dynamic pages displaying detailed information about individual books (such as title and author) on separate pages, I have encountered a hurdle. This challenge involves understanding how to call an API endpoint using NextJS to retriev ...

reactjsmaterial-uinext.js

Can npm packages be integrated into Chrome extensions?

With the abundance of JS modules available on npm these days, I am curious if there is a method to directly incorporate them into creating a Chrome extension. ...

google-chromenpmgoogle-chrome-extension

What is the best way to eliminate the nesting in this ternary operation?

Object.values(filter).filter(item => (Array.isArray(item) && item.length > 0) || (typeof item === "boolean" && item === true) || (item !== null)).length ? filterIcon : unFilledIcon In this code, I aim to simplify the nested ternary operator and ...

javascriptreactjsnested

Does React reassign keys once the underlying data structure has been modified?

Exploring the ins and outs of React, particularly diving into how the Reconciliation process functions. In my JSX code, I have a map function that looks like this: render: function () { var currentIssues = this.state.issues.map(function(issue, ...

javascriptreactjs

Unable to authenticate the initial certificate with Node

Out of the blue, my Node environments are experiencing issues with installing packages and freezing at idealTree:my-app : sill idealTree buildDeps Although I attempted to fix it by using npm config set registry http://registry.npmjs.org/ --global, it didn ...

reactjsnode.jsnpmnext.jsnext.js13

A step-by-step guide to importing images dynamically in React Native

Working with React Native and Expo, I encountered a challenge where I needed to import multiple images from a folder and use them by name in each loop iteration. To achieve this, I utilized the FlatGrid component from react-native-super-grid for creating a ...

reactjsreact-nativeexpo

The sum of total values in Material UI range sliders is capped at 100

Is it possible to ensure that the total of three Material UI sliders, each denoting percentage values, always remains at 100? I want the sliders' values to automatically adjust in order to maintain this total. How can this functionality be achieved? ...

reactjsmaterial-uirangeslider

Tips for managing onChange events in TypeScript

I'm still learning Typescript and I have a question regarding handling the onChange event in a TextField component when using Typescript. Can you provide guidance on how to approach this? I currently have a function called handleChangeDate(e: React. ...

reactjstypescriptmaterial-uitsx

Issue with posting a form in react-router-dom action()

Having trouble with sending form data to the backend? The backend works fine with Postman, but not with the frontend. Here's a look at my code: Below is the code for App.js: import { RouterProvider, createBrowserRouter } from "react-router-dom&q ...

reactjsmongodbexpressmongoosereact-router-dom

Invoke an ActionCreator within a different ActionCreator

Calling an ActionCreator from another file is proving to be a challenge... The products.ts file contains the ActionCreators and Reducers for Products... import { setStock } from './Store.ts'; //.... export const addProduct = (product: IProduct) ...

reactjstypescriptredux

When trying to run npm start with React JS, I encountered an error stating that the Babel-load

When running npm start The configuration in the Webpack.json file is as follows: var webpackConfig = { entry: './main.js', output: { path: __dirname + "/dist/js", filename: 'index.js', }, devServer: { ...

node.jsreactjsnpmwebpack

Displaying Errors from Controllers in React Hook Forms

Currently, I am attempting to generate required errors for my input element that is enclosed within a Controller component from react-hook-form version 7. The Input consists of a Material-UI TextField structured like this; <Controller ...

javascriptreactjsmaterial-uireact-hook-form

Struggling to align Material-UI Autocomplete and Material-UI FormControl horizontally?

Having trouble aligning Material-UI Autocomplete and Material-UI FormControl horizontally. Something seems to be off and I can't figure out what's causing the issue. My goal is to align the Autocomplete component with the FormControl and Button i ...

reactjsmaterial-ui

Mastering the art of employing various dialog boxes and displaying modals within ReactJS

I am struggling to understand how to implement Material UI's dialog box to display modals, close them by clicking a button, and also show different modals when clicking on various elements. Below is the code for the dialog component that I copied fro ...

reactjsmodal-dialogcomponentsmaterial-ui

Struggling to locate the app icon when building with React Native for iOS

I set up react-native from the official website following these steps. (I installed node.js and openJDK separately) System Information Operating System: Mac OSX Mojave 10.14.6 XCode Version: 11.0 (11A420a) node(nvm) Version: 10.15 react Version: 16.9.0 ...

iosreactjsreact-native