app.$cookies.set() freezed my app

[adamasantares]

I spend 3 days to find a reason, why my app freezes on every request. No any error was in logs or output. I'm still don't know why. But only when I commented just one line in my code app.$cookies.set('key', {someprop: false}) it become work. I tested it few times to be sure. It really have some troubles. NuxtJS just won't return a response to browser and you will get 502 http error all the time.

[adamasantares]

It seems it has some troubles with storing JSON. When I replaced this module by 'js-cookie' and even I used the exactly the same data for cookies, it worked well.

[microcipcip]

Sorry to hear you are having problems with this library. I don't know why I'd freeze, I've never experienced this. The parseToJSON is done only on get, not set, so I dunno what is happening. If it freezes there may be a loop happening somewhere.

[adamasantares]

I had no time for debugging, but I hope to do some tests later. Now I use js-cookie to set() and this lib for get() :)

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[websitevirtuoso]

@microcipcip I have the same problem.

`

  // this.$cookies.removeAll()
  this.$cookies.set('test1', '{"id":"1","email":"websitevirtuoso@gmail.com","address":null,"phone":null,"first_name":"Viktor","last_name":"Denisov","notify":true,"status":"AVAILABLE","created_at":"2020-11-07T13:33:25-08:00","updated_at":"2020-11-07T13:33:25-08:00","roles":[{"id":"1","name":"administrator","permissions":[{"id":"1","name":"user.create","__typename":"Permissions"},{"id":"2","name":"user.view","__typename":"Permissions"},{"id":"3","name":"user.update","__typename":"Permissions"},{"id":"4","name":"user.update.password","__typename":"Permissions"},{"id":"5","name":"post.create","__typename":"Permissions"},{"id":"6","name":"post.view","__typename":"Permissions"},{"id":"7","name":"post.update","__typename":"Permissions"},{"id":"8","name":"post.delete","__typename":"Permissions"},{"id":"9","name":"category.create","__typename":"Permissions"},{"id":"10","name":"category.view","__typename":"Permissions"},{"id":"11","name":"category.update","__typename":"Permissions"},{"id":"12","name":"category.delete","__typename":"Permissions"},{"id":"13","name":"role.create","__typename":"Permissions"},{"id":"14","name":"role.view","__typename":"Permissions"},{"id":"15","name":"role.update","__typename":"Permissions"},{"id":"16","name":"role.delete","__typename":"Permissions"},{"id":"17","name":"permission.view","__typename":"Permissions"},{"id":"18","name":"city.create","__typename":"Permissions"},{"id":"19","name":"city.view","__typename":"Permissions"},{"id":"20","name":"city.update","__typename":"Permissions"},{"id":"21","name":"city.delete","__typename":"Permissions"},{"id":"22","name":"state.create","__typename":"Permissions"},{"id":"23","name":"state.view","__typename":"Permissions"},{"id":"24","name":"state.update","__typename":"Permissions"},{"id":"25","name":"state.delete","__typename":"Permissions"},{"id":"26","name":"country.view","__typename":"Permissions"},{"id":"27","name":"property_type.view","__typename":"Permissions"},{"id":"28","name":"property_type.update","__typename":"Permissions"},{"id":"29","name":"property.create","__typename":"Permissions"},{"id":"30","name":"property.view","__typename":"Permissions"},{"id":"31","name":"property.update","__typename":"Permissions"},{"id":"32","name":"property.delete","__typename":"Permissions"},{"id":"33","name":"city_alias.create","__typename":"Permissions"},{"id":"34","name":"city_alias.view","__typename":"Permissions"},{"id":"35","name":"city_alias.update","__typename":"Permissions"},{"id":"36","name":"city_alias.delete","__typename":"Permissions"},{"id":"37","name":"promo.create","__typename":"Permissions"},{"id":"38","name":"promo.view","__typename":"Permissions"},{"id":"39","name":"promo.update","__typename":"Permissions"},{"id":"40","name":"promo.delete","__typename":"Permissions"}],"__typename":"Roles"}],"city":{"id":"271","name":"Port Moody","state":{"id":"3","name":"British Columbia","country":{"id":"1","name":"Canada","__typename":"Countries"},"__typename":"States"},"__typename":"Cities"},"__typename":"Users"}')
  this.$cookies.set('test2', JSON.stringify('{"id":"1","email":"websitevirtuoso@gmail.com","address":null,"phone":null,"first_name":"Viktor","last_name":"Denisov","notify":true,"status":"AVAILABLE","created_at":"2020-11-07T13:33:25-08:00","updated_at":"2020-11-07T13:33:25-08:00","roles":[{"id":"1","name":"administrator","permissions":[{"id":"1","name":"user.create","__typename":"Permissions"},{"id":"2","name":"user.view","__typename":"Permissions"},{"id":"3","name":"user.update","__typename":"Permissions"},{"id":"4","name":"user.update.password","__typename":"Permissions"},{"id":"5","name":"post.create","__typename":"Permissions"},{"id":"6","name":"post.view","__typename":"Permissions"},{"id":"7","name":"post.update","__typename":"Permissions"},{"id":"8","name":"post.delete","__typename":"Permissions"},{"id":"9","name":"category.create","__typename":"Permissions"},{"id":"10","name":"category.view","__typename":"Permissions"},{"id":"11","name":"category.update","__typename":"Permissions"},{"id":"12","name":"category.delete","__typename":"Permissions"},{"id":"13","name":"role.create","__typename":"Permissions"},{"id":"14","name":"role.view","__typename":"Permissions"},{"id":"15","name":"role.update","__typename":"Permissions"},{"id":"16","name":"role.delete","__typename":"Permissions"},{"id":"17","name":"permission.view","__typename":"Permissions"},{"id":"18","name":"city.create","__typename":"Permissions"},{"id":"19","name":"city.view","__typename":"Permissions"},{"id":"20","name":"city.update","__typename":"Permissions"},{"id":"21","name":"city.delete","__typename":"Permissions"},{"id":"22","name":"state.create","__typename":"Permissions"},{"id":"23","name":"state.view","__typename":"Permissions"},{"id":"24","name":"state.update","__typename":"Permissions"},{"id":"25","name":"state.delete","__typename":"Permissions"},{"id":"26","name":"country.view","__typename":"Permissions"},{"id":"27","name":"property_type.view","__typename":"Permissions"},{"id":"28","name":"property_type.update","__typename":"Permissions"},{"id":"29","name":"property.create","__typename":"Permissions"},{"id":"30","name":"property.view","__typename":"Permissions"},{"id":"31","name":"property.update","__typename":"Permissions"},{"id":"32","name":"property.delete","__typename":"Permissions"},{"id":"33","name":"city_alias.create","__typename":"Permissions"},{"id":"34","name":"city_alias.view","__typename":"Permissions"},{"id":"35","name":"city_alias.update","__typename":"Permissions"},{"id":"36","name":"city_alias.delete","__typename":"Permissions"},{"id":"37","name":"promo.create","__typename":"Permissions"},{"id":"38","name":"promo.view","__typename":"Permissions"},{"id":"39","name":"promo.update","__typename":"Permissions"},{"id":"40","name":"promo.delete","__typename":"Permissions"}],"__typename":"Roles"}],"city":{"id":"271","name":"Port Moody","state":{"id":"3","name":"British Columbia","country":{"id":"1","name":"Canada","__typename":"Countries"},"__typename":"States"},"__typename":"Cities"},"__typename":"Users"}'))
  // this.$cookies.set('test3', JSON.parse('{"id":"1","email":"websitevirtuoso@gmail.com","address":null,"phone":null,"first_name":"Viktor","last_name":"Denisov","notify":true,"status":"AVAILABLE","created_at":"2020-11-07T13:33:25-08:00","updated_at":"2020-11-07T13:33:25-08:00","roles":[{"id":"1","name":"administrator","permissions":[{"id":"1","name":"user.create","__typename":"Permissions"},{"id":"2","name":"user.view","__typename":"Permissions"},{"id":"3","name":"user.update","__typename":"Permissions"},{"id":"4","name":"user.update.password","__typename":"Permissions"},{"id":"5","name":"post.create","__typename":"Permissions"},{"id":"6","name":"post.view","__typename":"Permissions"},{"id":"7","name":"post.update","__typename":"Permissions"},{"id":"8","name":"post.delete","__typename":"Permissions"},{"id":"9","name":"category.create","__typename":"Permissions"},{"id":"10","name":"category.view","__typename":"Permissions"},{"id":"11","name":"category.update","__typename":"Permissions"},{"id":"12","name":"category.delete","__typename":"Permissions"},{"id":"13","name":"role.create","__typename":"Permissions"},{"id":"14","name":"role.view","__typename":"Permissions"},{"id":"15","name":"role.update","__typename":"Permissions"},{"id":"16","name":"role.delete","__typename":"Permissions"},{"id":"17","name":"permission.view","__typename":"Permissions"},{"id":"18","name":"city.create","__typename":"Permissions"},{"id":"19","name":"city.view","__typename":"Permissions"},{"id":"20","name":"city.update","__typename":"Permissions"},{"id":"21","name":"city.delete","__typename":"Permissions"},{"id":"22","name":"state.create","__typename":"Permissions"},{"id":"23","name":"state.view","__typename":"Permissions"},{"id":"24","name":"state.update","__typename":"Permissions"},{"id":"25","name":"state.delete","__typename":"Permissions"},{"id":"26","name":"country.view","__typename":"Permissions"},{"id":"27","name":"property_type.view","__typename":"Permissions"},{"id":"28","name":"property_type.update","__typename":"Permissions"},{"id":"29","name":"property.create","__typename":"Permissions"},{"id":"30","name":"property.view","__typename":"Permissions"},{"id":"31","name":"property.update","__typename":"Permissions"},{"id":"32","name":"property.delete","__typename":"Permissions"},{"id":"33","name":"city_alias.create","__typename":"Permissions"},{"id":"34","name":"city_alias.view","__typename":"Permissions"},{"id":"35","name":"city_alias.update","__typename":"Permissions"},{"id":"36","name":"city_alias.delete","__typename":"Permissions"},{"id":"37","name":"promo.create","__typename":"Permissions"},{"id":"38","name":"promo.view","__typename":"Permissions"},{"id":"39","name":"promo.update","__typename":"Permissions"},{"id":"40","name":"promo.delete","__typename":"Permissions"}],"__typename":"Roles"}],"city":{"id":"271","name":"Port Moody","state":{"id":"3","name":"British Columbia","country":{"id":"1","name":"Canada","__typename":"Countries"},"__typename":"States"},"__typename":"Cities"},"__typename":"Users"}'))
  this.$cookies.set('test', 'asd')
  console.log(this.$cookies.getAll()) // return as only
  console.log(this.$cookies.get('test1')) // underfined
  console.log(this.$cookies.get('test2')) // underfined

`

[websitevirtuoso]

@microcipcip I found the problem. My json has array of objects. I don't know why but your lib doesn't work allow to write it. So I had to change lib to js-cookie. But I would like to use your lib to reduce size of my project. Attach json to reproduce

this.$cookies.set('test1', { id: '1', email: 'websitevirtuoso@gmail.com', address: null, phone: null, first_name: 'Viktor', last_name: 'Denisov', notify: true, status: 'AVAILABLE', created_at: '2020-11-07T13:33:25-08:00', updated_at: '2020-11-07T13:33:25-08:00', roles: [ { id: '1', name: 'administrator', permissions: [ { id: '1', name: 'user.create', __typename: 'Permissions' }, { id: '2', name: 'user.view', __typename: 'Permissions' }, { id: '3', name: 'user.update', __typename: 'Permissions' }, { id: '4', name: 'user.update.password', __typename: 'Permissions' }, { id: '5', name: 'post.create', __typename: 'Permissions' }, { id: '6', name: 'post.view', __typename: 'Permissions' }, { id: '7', name: 'post.update', __typename: 'Permissions' }, { id: '8', name: 'post.delete', __typename: 'Permissions' }, { id: '9', name: 'category.create', __typename: 'Permissions' }, { id: '10', name: 'category.view', __typename: 'Permissions' }, { id: '11', name: 'category.update', __typename: 'Permissions' }, { id: '12', name: 'category.delete', __typename: 'Permissions' }, { id: '13', name: 'role.create', __typename: 'Permissions' }, { id: '14', name: 'role.view', __typename: 'Permissions' }, { id: '15', name: 'role.update', __typename: 'Permissions' }, { id: '16', name: 'role.delete', __typename: 'Permissions' }, { id: '17', name: 'permission.view', __typename: 'Permissions' }, { id: '18', name: 'city.create', __typename: 'Permissions' }, { id: '19', name: 'city.view', __typename: 'Permissions' }, { id: '20', name: 'city.update', __typename: 'Permissions' }, { id: '21', name: 'city.delete', __typename: 'Permissions' }, { id: '22', name: 'state.create', __typename: 'Permissions' }, { id: '23', name: 'state.view', __typename: 'Permissions' }, { id: '24', name: 'state.update', __typename: 'Permissions' }, { id: '25', name: 'state.delete', __typename: 'Permissions' }, { id: '26', name: 'country.view', __typename: 'Permissions' }, { id: '27', name: 'property_type.view', __typename: 'Permissions' }, { id: '28', name: 'property_type.update', __typename: 'Permissions' }, { id: '29', name: 'property.create', __typename: 'Permissions' }, { id: '30', name: 'property.view', __typename: 'Permissions' }, { id: '31', name: 'property.update', __typename: 'Permissions' }, { id: '32', name: 'property.delete', __typename: 'Permissions' }, { id: '33', name: 'city_alias.create', __typename: 'Permissions' }, { id: '34', name: 'city_alias.view', __typename: 'Permissions' }, { id: '35', name: 'city_alias.update', __typename: 'Permissions' }, { id: '36', name: 'city_alias.delete', __typename: 'Permissions' }, { id: '37', name: 'promo.create', __typename: 'Permissions' }, { id: '38', name: 'promo.view', __typename: 'Permissions' }, { id: '39', name: 'promo.update', __typename: 'Permissions' }, { id: '40', name: 'promo.delete', __typename: 'Permissions' } ], __typename: 'Roles' } ] })

[microcipcip]

Hi @websitevirtuoso, the problem is that your cookie is bigger than 4k, the browser has a limitation, cannot store a cookie bigger than 4k. If you want to save so much data you have to store it in localStorage, but I advise to reduce the size of the object instead.

I tried to remove some of the objects in your example (to reduce the size) and it saved correctly.