Set secure flag true under cookies

arjuntejaswi-s commented 1 year ago

Before opening, please confirm:

[X] I have searched for duplicate or closed issues and discussions.
[X] I have read the guide for submitting bug reports.
[X] I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.

JavaScript Framework

React

Amplify APIs

Not applicable

Amplify Categories

hosting

Environment information

``` # Put output below this line System: OS: macOS 12.2.1 CPU: (8) arm64 Apple M1 Memory: 115.34 MB / 8.00 GB Shell: 5.8 - /bin/zsh Binaries: Node: 16.15.1 - ~/.nvm/versions/node/v16.15.1/bin/node Yarn: 1.22.19 - ~/.nvm/versions/node/v16.15.1/bin/yarn npm: 8.11.0 - ~/.nvm/versions/node/v16.15.1/bin/npm Browsers: Chrome: 112.0.5615.137 Safari: 15.3 npmPackages: @aws-amplify/ui-react: ^4.6.0 => 4.6.0 @aws-amplify/ui-react-internal: undefined () @aws-sdk/client-cognito-identity: 3.218.0 => 3.218.0 (3.6.1) @aws-sdk/client-s3: 3.218.0 => 3.218.0 (3.6.2) @aws-sdk/credential-provider-cognito-identity: 3.218.0 => 3.218.0 (3.6.1) @babel/plugin-transform-modules-commonjs: ^7.19.6 => 7.20.11 @craco/craco: ^7.0.0 => 7.0.0 @emotion/styled: 11.10.4 => 11.10.4 (11.10.5) @fortawesome/fontawesome-free: 6.2.1 => 6.2.1 @knocklabs/react-notification-feed: 0.8.1 => 0.8.1 @mui/material: 5.10.16 => 5.10.16 @novu/notification-center: ^0.11.0 => 0.11.0 @popperjs/core: 2.11.6 => 2.11.6 @prism-react-renderer/dracula: undefined () @prism-react-renderer/duotoneDark: undefined () @prism-react-renderer/duotoneLight: undefined () @prism-react-renderer/github: undefined () @prism-react-renderer/nightOwl: undefined () @prism-react-renderer/nightOwlLight: undefined () @prism-react-renderer/oceanicNext: undefined () @prism-react-renderer/okaidia: undefined () @prism-react-renderer/palenight: undefined () @prism-react-renderer/prism: undefined () @prism-react-renderer/shadesOfPurple: undefined () @prism-react-renderer/synthwave84: undefined () @prism-react-renderer/ultramin: undefined () @prism-react-renderer/vsDark: undefined () @prism-react-renderer/vsLight: undefined () @sentry/react: 7.22.0 => 7.22.0 @sentry/tracing: 7.22.0 => 7.22.0 @testing-library/jest-dom: 5.16.5 => 5.16.5 @testing-library/react: 13.4.0 => 13.4.0 @testing-library/user-event: 14.4.3 => 14.4.3 @types/bootstrap: 5.2.6 => 5.2.6 @types/chart.js: 2.9.37 => 2.9.37 @types/jest: 29.2.3 => 29.2.3 (29.2.5) @types/node: 18.11.10 => 18.11.10 (18.11.18) @types/nouislider: 15.0.0 => 15.0.0 @types/object-path: 0.11.1 => 0.11.1 @types/prismjs: 1.26.0 => 1.26.0 @types/qs: 6.9.7 => 6.9.7 @types/react: 18.0.25 => 18.0.25 @types/react-copy-to-clipboard: 5.0.4 => 5.0.4 @types/react-datepicker: 4.8.0 => 4.8.0 @types/react-dates: ^21.8.3 => 21.8.3 @types/react-dom: ^18.0.9 => 18.0.10 @types/react-resizable: ^3.0.3 => 3.0.3 @types/react-table: 7.7.12 => 7.7.12 @typescript-eslint/eslint-plugin: ^5.48.1 => 5.48.1 @typescript-eslint/parser: ^5.48.1 => 5.48.1 animate.css: 4.1.1 => 4.1.1 apexcharts: 3.36.3 => 3.36.3 aws-amplify: ^5.1.3 => 5.1.3 axios: 1.2.0 => 1.2.0 (0.26.0, 0.21.4, 0.26.1) axios-mock-adapter: 1.21.2 => 1.21.2 bootstrap: 5.2.3 => 5.2.3 bootstrap-icons: 1.10.2 => 1.10.2 buffer: ^6.0.3 => 6.0.3 (4.9.2) chart.js: 4.0.1 => 4.0.1 chart.js-auto: undefined () chart.js-helpers: undefined () classnames: 2.3.1 => 2.3.1 (2.3.2) clsx: 1.2.1 => 1.2.1 (1.1.1) country-state-city: 3.1.2 => 3.1.2 craco-esbuild: ^0.5.2 => 0.5.2 date-fns: 2.29.3 => 2.29.3 date-fns-tz: 1.3.7 => 1.3.7 del: 7.0.0 => 7.0.0 encrypt-storage: ^2.12.14 => 2.12.14 eslint: ^8.31.0 => 8.31.0 eslint-config-prettier: ^8.6.0 => 8.6.0 eslint-plugin-jsx-a11y: ^6.7.1 => 6.7.1 eslint-plugin-prettier: ^4.2.1 => 4.2.1 eslint-plugin-react: ^7.32.0 => 7.32.0 formik: 2.2.9 => 2.2.9 husky: 8.0.3 => 8.0.3 i18n-iso-countries: 7.5.0 => 7.5.0 iso-3166-1-alpha-2: 1.0.0 => 1.0.0 js-file-download: 0.4.12 => 0.4.12 line-awesome: 1.3.0 => 1.3.0 lint-staged: ^13.1.0 => 13.1.0 lodash: 4.17.21 => 4.17.21 logrocket: ^4.0.0 => 4.0.0 mini-css-extract-plugin: 2.7.1 => 2.7.1 (2.7.2) moment: ^2.29.4 => 2.29.4 node-fetch: 3.3.0 => 3.3.0 (2.6.9) nouislider: 15.6.1 => 15.6.1 object-path: 0.11.8 => 0.11.8 path: 0.12.7 => 0.12.7 prettier: ^2.8.2 => 2.8.2 prism-react-renderer: 1.3.5 => 1.3.5 prism-themes: 1.9.0 => 1.9.0 prismjs: 1.29.0 => 1.29.0 qs: 6.11.0 => 6.11.0 react: ^18.2.0 => 18.2.0 react-apexcharts: 1.4.0 => 1.4.0 react-bootstrap: 2.6.0 => 2.6.0 react-bootstrap/AbstractModalHeader: undefined () react-bootstrap/Accordion: undefined () react-bootstrap/AccordionBody: undefined () react-bootstrap/AccordionButton: undefined () react-bootstrap/AccordionCollapse: undefined () react-bootstrap/AccordionContext: undefined () react-bootstrap/AccordionHeader: undefined () react-bootstrap/AccordionItem: undefined () react-bootstrap/AccordionItemContext: undefined () react-bootstrap/Alert: undefined () react-bootstrap/Anchor: undefined () react-bootstrap/Badge: undefined () react-bootstrap/BootstrapModalManager: undefined () react-bootstrap/Breadcrumb: undefined () react-bootstrap/BreadcrumbItem: undefined () react-bootstrap/Button: undefined () react-bootstrap/ButtonGroup: undefined () react-bootstrap/ButtonToolbar: undefined () react-bootstrap/Card: undefined () react-bootstrap/CardGroup: undefined () react-bootstrap/CardHeader: undefined () react-bootstrap/CardHeaderContext: undefined () react-bootstrap/CardImg: undefined () react-bootstrap/Carousel: undefined () react-bootstrap/CarouselCaption: undefined () react-bootstrap/CarouselItem: undefined () react-bootstrap/CloseButton: undefined () react-bootstrap/Col: undefined () react-bootstrap/Collapse: undefined () react-bootstrap/Container: undefined () react-bootstrap/Dropdown: undefined () react-bootstrap/DropdownButton: undefined () react-bootstrap/DropdownContext: undefined () react-bootstrap/DropdownItem: undefined () react-bootstrap/DropdownMenu: undefined () react-bootstrap/DropdownToggle: undefined () react-bootstrap/ElementChildren: undefined () react-bootstrap/Fade: undefined () react-bootstrap/Feedback: undefined () react-bootstrap/Figure: undefined () react-bootstrap/FigureCaption: undefined () react-bootstrap/FigureImage: undefined () react-bootstrap/FloatingLabel: undefined () react-bootstrap/Form: undefined () react-bootstrap/FormCheck: undefined () react-bootstrap/FormCheckInput: undefined () react-bootstrap/FormCheckLabel: undefined () react-bootstrap/FormContext: undefined () react-bootstrap/FormControl: undefined () react-bootstrap/FormFloating: undefined () react-bootstrap/FormGroup: undefined () react-bootstrap/FormLabel: undefined () react-bootstrap/FormRange: undefined () react-bootstrap/FormSelect: undefined () react-bootstrap/FormText: undefined () react-bootstrap/Image: undefined () react-bootstrap/InputGroup: undefined () react-bootstrap/InputGroupContext: undefined () react-bootstrap/ListGroup: undefined () react-bootstrap/ListGroupItem: undefined () react-bootstrap/Modal: undefined () react-bootstrap/ModalBody: undefined () react-bootstrap/ModalContext: undefined () react-bootstrap/ModalDialog: undefined () react-bootstrap/ModalFooter: undefined () react-bootstrap/ModalHeader: undefined () react-bootstrap/ModalTitle: undefined () react-bootstrap/Nav: undefined () react-bootstrap/NavContext: undefined () react-bootstrap/NavDropdown: undefined () react-bootstrap/NavItem: undefined () react-bootstrap/NavLink: undefined () react-bootstrap/Navbar: undefined () react-bootstrap/NavbarBrand: undefined () react-bootstrap/NavbarCollapse: undefined () react-bootstrap/NavbarContext: undefined () react-bootstrap/NavbarOffcanvas: undefined () react-bootstrap/NavbarToggle: undefined () react-bootstrap/Offcanvas: undefined () react-bootstrap/OffcanvasBody: undefined () react-bootstrap/OffcanvasHeader: undefined () react-bootstrap/OffcanvasTitle: undefined () react-bootstrap/OffcanvasToggling: undefined () react-bootstrap/Overlay: undefined () react-bootstrap/OverlayTrigger: undefined () react-bootstrap/PageItem: undefined () react-bootstrap/Pagination: undefined () react-bootstrap/Placeholder: undefined () react-bootstrap/PlaceholderButton: undefined () react-bootstrap/Popover: undefined () react-bootstrap/PopoverBody: undefined () react-bootstrap/PopoverHeader: undefined () react-bootstrap/ProgressBar: undefined () react-bootstrap/Ratio: undefined () react-bootstrap/Row: undefined () react-bootstrap/SSRProvider: undefined () react-bootstrap/Spinner: undefined () react-bootstrap/SplitButton: undefined () react-bootstrap/Stack: undefined () react-bootstrap/Switch: undefined () react-bootstrap/Tab: undefined () react-bootstrap/TabContainer: undefined () react-bootstrap/TabContent: undefined () react-bootstrap/TabPane: undefined () react-bootstrap/Table: undefined () react-bootstrap/Tabs: undefined () react-bootstrap/ThemeProvider: undefined () react-bootstrap/Toast: undefined () react-bootstrap/ToastBody: undefined () react-bootstrap/ToastContainer: undefined () react-bootstrap/ToastContext: undefined () react-bootstrap/ToastFade: undefined () react-bootstrap/ToastHeader: undefined () react-bootstrap/ToggleButton: undefined () react-bootstrap/ToggleButtonGroup: undefined () react-bootstrap/Tooltip: undefined () react-bootstrap/TransitionWrapper: undefined () react-bootstrap/createChainedFunction: undefined () react-bootstrap/createUtilityClasses: undefined () react-bootstrap/createWithBsPrefix: undefined () react-bootstrap/divWithClassName: undefined () react-bootstrap/getTabTransitionComponent: undefined () react-bootstrap/helpers: undefined () react-bootstrap/safeFindDOMNode: undefined () react-bootstrap/transitionEndListener: undefined () react-bootstrap/triggerBrowserReflow: undefined () react-bootstrap/types: undefined () react-bootstrap/useOverlayOffset: undefined () react-bootstrap/usePlaceholder: undefined () react-bootstrap/useWrappedRefWithWarning: undefined () react-copy-to-clipboard: 5.1.0 => 5.1.0 react-datepicker: 4.8.0 => 4.8.0 react-dates: ^21.8.0 => 21.8.0 react-dom: ^18.2.0 => 18.2.0 react-draggable: 4.4.5 => 4.4.5 react-dropzone: ^14.2.3 => 14.2.3 react-error-overlay: 6.0.11 => 6.0.11 (6.0.9) react-filerobot-image-editor: ^4.3.8 => 4.3.8 react-image-crop: 10.0.9 => 10.0.9 react-inlinesvg: 3.0.1 => 3.0.1 react-intl: 6.2.4 => 6.2.4 react-is: 18.2.0 => 18.2.0 (16.13.1, 17.0.2) react-loading-skeleton: 3.1.0 => 3.1.0 react-phone-input-2: 2.15.1 => 2.15.1 react-query: 3.39.2 => 3.39.2 react-query-devtools: 2.6.3 => 2.6.3 react-resizable: ^3.0.4 => 3.0.4 react-router-dom: 6.4.4 => 6.4.4 react-scripts: 5.0.1 => 5.0.1 react-select: 5.7.0 => 5.7.0 react-table: 7.8.0 => 7.8.0 react-toastify: 9.1.1 => 9.1.1 rtlcss-webpack-plugin: 4.0.7 => 4.0.7 sass: 1.56.1 => 1.56.1 secure-ls: ^1.2.6 => 1.2.6 socicon: 3.0.5 => 3.0.5 styled-components: ^5.3.6 => 5.3.6 styled-components/macro: undefined () styled-components/native: undefined () styled-components/primitives: undefined () sweetalert2: 11.6.15 => 11.6.15 typescript: 4.9.3 => 4.9.3 v: 0.3.0 => 0.3.0 web-vitals: 3.1.0 => 3.1.0 webpack-cli: 5.0.0 => 5.0.0 yup: 0.32.11 => 0.32.11 npmGlobalPackages: @aws-amplify/cli: 10.5.2 corepack: 0.10.0 npm: 8.11.0 serverless: 3.0.0 yarn: 1.22.19 ```

Describe the bug

We have a react app hosted in amplify frontend. We are trying set the secure to true in Cookies Storage for our domains but we are unable to do it. I have tried all the steps possible but couldn't find a solution. Please could anyone help me in solving this issue.

Expected behavior

The cookies that are generated from the app should be secured.

Reproduction steps

Please check the screenshot

Code Snippet

// Put your code below this line.

Log output

``` // Put your logs below this line ```

aws-exports.js

No response

Manual configuration

Amplify.configure({ Auth: { region: 'ap-south-1', cookieStorage: { domain: '.mydomainName.io', path: '/', expires: 365, secure: true } } });

Additional configuration

No response

Mobile Device

No response

Mobile Operating System

No response

Mobile Browser

No response

Mobile Browser Version

No response

Additional information and screenshots

No response

arjuntejaswi-s commented 1 year ago

Note: The cookies seen in the screenshot are all created by third party cookies. I came to this conclusion because we have not set any cookie inside our app. So, my first question -> Is this issue can be solved? If yes, please help us.

arjuntejaswi-s commented 1 year ago

This has been resolved from our side Thank you.

aws-amplify / amplify-js