Где хранить токен аутентификации (frontend) и как поместить его в заголовки http из нескольких конечных точек?

Сортировка (подробнее) Сложные массивы объектов

Поскольку вы, вероятно, сталкиваетесь с более сложными структурами данных, такими как этот массив, я бы расширил решение.

TL; DR

Более плавная версия, основанная на @ ege-Özcan очень симпатичном ответе .

blockquote>

Проблема

Я столкнулся с ниже и не мог ее изменить. Я также не хотел временно сгладить объект. Я также не хотел использовать underscore / lodash, главным образом по соображениям производительности и забавой для его реализации.

var People = [
   {Name: {name: "Name", surname: "Surname"}, Middlename: "JJ"},
   {Name: {name: "AAA", surname: "ZZZ"}, Middlename:"Abrams"},
   {Name: {name: "Name", surname: "AAA"}, Middlename: "Wars"}
];

Цель

Цель состоит в том, чтобы отсортировать ее в основном с помощью People.Name.name и, во-вторых, People.Name.surname

Препятствия

Теперь в базовом решении используется скобка для вычисления свойств для динамического сортировки. Здесь, однако, нам также придется динамически создавать условные обозначения скобок, так как вы ожидаете, что некоторые из них People['Name.name'] будут работать, а это не так.

С другой стороны, выполнение People['Name']['name'] является статическим и позволяет вам спуститься на n -й уровень.

Решение

Основным дополнением здесь будет спуск по дереву объектов и определение значения последнего листа, вы должны указать, а также любой промежуточный лист.

var People = [
   {Name: {name: "Name", surname: "Surname"}, Middlename: "JJ"},
   {Name: {name: "AAA", surname: "ZZZ"}, Middlename:"Abrams"},
   {Name: {name: "Name", surname: "AAA"}, Middlename: "Wars"}
];

People.sort(dynamicMultiSort(['Name','name'], ['Name', '-surname']));
// Results in...
// [ { Name: { name: 'AAA', surname: 'ZZZ' }, Middlename: 'Abrams' },
//   { Name: { name: 'Name', surname: 'Surname' }, Middlename: 'JJ' },
//   { Name: { name: 'Name', surname: 'AAA' }, Middlename: 'Wars' } ]

// same logic as above, but strong deviation for dynamic properties 
function dynamicSort(properties) {
  var sortOrder = 1;
  // determine sort order by checking sign of last element of array
  if(properties[properties.length - 1][0] === "-") {
    sortOrder = -1;
    // Chop off sign
    properties[properties.length - 1] = properties[properties.length - 1].substr(1);
  }
  return function (a,b) {
    propertyOfA = recurseObjProp(a, properties)
    propertyOfB = recurseObjProp(b, properties)
    var result = (propertyOfA < propertyOfB) ? -1 : (propertyOfA > propertyOfB) ? 1 : 0;
    return result * sortOrder;
  };
}

/**
 * Takes an object and recurses down the tree to a target leaf and returns it value
 * @param  {Object} root - Object to be traversed.
 * @param  {Array} leafs - Array of downwards traversal. To access the value: {parent:{ child: 'value'}} -> ['parent','child']
 * @param  {Number} index - Must not be set, since it is implicit.
 * @return {String|Number}       The property, which is to be compared by sort.
 */
function recurseObjProp(root, leafs, index) {
  index ? index : index = 0
  var upper = root
  // walk down one level
  lower = upper[leafs[index]]
  // Check if last leaf has been hit by having gone one step too far.
  // If so, return result from last step.
  if (!lower) {
    return upper
  }
  // Else: recurse!
  index++
  // HINT: Bug was here, for not explicitly returning function
  // https://stackoverflow.com/a/17528613/3580261
  return recurseObjProp(lower, leafs, index)
}

/**
 * Multi-sort your array by a set of properties
 * @param {...Array} Arrays to access values in the form of: {parent:{ child: 'value'}} -> ['parent','child']
 * @return {Number} Number - number for sort algorithm
 */
function dynamicMultiSort() {
  var args = Array.prototype.slice.call(arguments); // slight deviation to base

  return function (a, b) {
    var i = 0, result = 0, numberOfProperties = args.length;
    // REVIEW: slightly verbose; maybe no way around because of `.sort`-'s nature
    // Consider: `.forEach()`
    while(result === 0 && i < numberOfProperties) {
      result = dynamicSort(args[i])(a, b);
      i++;
    }
    return result;
  }
}

Пример

Рабочий пример в JSBin

0
задан Gilgamesh 13 July 2018 в 21:00
поделиться

2 ответа

Существует три способа хранения токена в браузере:

  1. LocalStorage - хранит данные без даты истечения срока действия, без доступа из бэкэнд.
  2. SessionStorage - сохраняет данные до тех пор, пока браузер / вкладка не будет открыта, не будет доступа из бэкэнд.
  3. Cookie - хранит данные, время истечения может быть задано индивидуально, автоматически отправляется с последующими запросами на сервер.

Подробнее здесь: https://scotch.io/@PratyushB/local-storage-vs-session-storage-vs-cookie

Итак, единственный файл cookie сделайте это автоматически для вас, все остальное - вам нужно будет предоставить вручную.

Вы можете выбрать как LocalStorage, так и SessionStorage, но если вы хотите, чтобы ваши пользователи вошли в систему в следующий раз, они откроют страницу - Я бы выбрал LocalStorage.

Затем его нужно добавить вручную для каждого запроса API, но вы можете создать вспомогательную функцию, чтобы упростить ее:

function apiRequest(type, url) {
  return $.ajax({
    url: url,
    type: type,
    headers: {
      token: localStorage.getItem("token"),
    }
  });
}

apiRequest("get","https://www.something.com/random").done(function(data) {
  console.log(data) 
})

Подробнее о localStorage здесь: https://developer.mozilla.org/en-US/docs/Web/API/Window/local Хранение

2
ответ дан Ivan Sorokin 17 August 2018 в 12:08
поделиться

Вы можете использовать локальное хранилище и использовать перехватчик для прикрепления токена в одном месте. Аналогичный вопрос возникает при переполнении стека. см. здесь

0
ответ дан varmabsrk 17 August 2018 в 12:08
поделиться
Другие вопросы по тегам:

Похожие вопросы: