• Что ещё проверять для безопасности?

    vabka
    @vabka
    Токсичный шарпист
    Вот эта строка ничего не делает :)
    if(message.length > 150) message.substring(0, 150)

    Конкретно в показанном коде больше никаких уязвимостей не видно.
    Так что только общие советы - открывай OWASP и проверяй всё по порядку для своего приложения.
    Ответ написан
    4 комментария
  • Как указать путь к файлу при импорте в TypeScript?

    @iljaGolubev
    Возможно import App from "./App.vue"; поможет.

    А ещё, создать в корне файл shims-vue.d.ts если ещё нет чего-то подобного. Нужно указать ts компилятору что делать с sfc компонентами vue.
    declare module "*.vue" {
      import type { DefineComponent } from "vue";
      const component: DefineComponent<{}, {}, any>;
      export default component;
    }
    Ответ написан
    1 комментарий
  • Переходы на многостраничном сайте?

    Fragster
    @Fragster
    помогло? отметь решением!
    помимо варианта с бэкэндом есть еще генераторы статических сайтов, которые на основе шаблонов сгенерят папку для размещения на хостинге, и там можно в виде json положить "товары" и сгенерируется необходимое количество страниц. Например https://nuxtjs.org/docs/concepts/static-site-generation или https://vuepress.vuejs.org/
    Ответ написан
    Комментировать
  • Как должна выглядеть диаграмма взаимодействия пользователя с ис?

    vabka
    @vabka Куратор тега Веб-разработка
    Токсичный шарпист
    Начнём с того что то что у тебя - это какие-то непонятные фигуры и стрелочки которые отражают непонятно что и непонятно зачем и для кого.

    А в реальном мире уже всё давно придумано:

    • Sequence diagram, если хочешь показать, в каком порядке и куда пойдут данные
    • Use case diagram, если хочешь показать варианты использования твоей системы разными авторами.
    • Нотация C4, если хочешь деконструировать свою систему.
    • Целая куча других диаграмм в рамках стандарта UML.



    Все они по разному изображают взаимодействие с пользователем.
    Выбирай в зависимости от того, что ты хочешь изобразить, для кого, а главное - зачем.
    Может даже придумаешь свою нотацию, которая в твоей ситуации окажется удобнее, чем всё что было придумано ранее.

    Вот пара примеров диаграмм, как бы ты мог всё изобразить:
    Картинки

    Sequence:
    6466fad769376519395834.png
    Ответ написан
    2 комментария
  • Как подвинуть лупу НА padding?

    UnluckySerivelha
    @UnluckySerivelha
    Задать инпуту и лупе общий родительский элемент, ему position: relative, лупе position: abosulte и спозиционировать правильно, инпуту левый паддинг еще.
    Ответ написан
    1 комментарий
  • Почему не подтягивается существующий файл?

    sfi0zy
    @sfi0zy
    Creative frontend developer
    Ошибка importScripts is not defined не говорит о том, что файла не существует. Она говорит о том, что функции importScripts нет в том контексте, в котором все выполняется. В стандартном глобальном Window ее нет. В WorkerGlobalScope она есть. Нужно убедиться в том, в каком контексте выполняется ваш код. Что есть self в вашем коде. Тут многое зависит от того, как вы делаете свое приложение и как создаются эти воркеры (в некоторых фреймворках может своя локальная магия происходить). Есть неиллюзорная вероятность, что ваш код воркера загружается два раза. И запускается два раза. И первый раз он запускается в основном потоке, где self - это получается window. Если это так, то можно сделать запуск кода воркера из тупой проверки-заглушки, что-нибудь вроде:
    if (typeof importScripts === 'function') {
        importScripts('......js');
        // и все остальное тут
    }

    Это сомнительная практика, т.к. по идее этот код должен запускаться один раз с нужным контекстом, и мы лечим симптомы, а не изначальную болезнь, но она может решить проблему.
    Ответ написан
    1 комментарий
  • Как подправить метод js reduce что бы не ругался TypeScript?

    В JS/TS массив не может быть подобного вида:
    [
        'phone': "+7(555)444-33-22",
        'email': "random@ya.ru",
        'name': "Иван",
    ]

    Ну точнее, строго говоря, может, но это немного дичь. Я никого не знаю, кто так использовал бы массивы, да и TS на такое ругается всё равно. Понятно, для чего подобное может быть удобно в теории, но для этого давно придумали объекты и Map.

    Так что может, вы все-таки имели в виду объект? Тогда можно что-то вроде этого сделать
    const submitForm = (e: SubmitEvent) => {
      e.preventDefault();
      const form = e.currentTarget as HTMLFormElement;
      const data = Object.entries(form.elements).reduce<Record<string, unknown>>(
        (acc, [key, element]) => {
          if (isNaN(Number(key)) && 'value' in element) {
            acc[key] = element.value;
          }
          return acc;
        },
        {}
      );
      console.log(data);
    };
    
    const form = document.getElementById("form");
    form?.addEventListener("submit", submitForm);


    Впрочем, аналогично можно привести и к тому виду, который вы описали, лишь немного переделав.
    Ответ написан
    1 комментарий
  • Почему не получается сортировка по array в консоли JS?

    @tuwkan
    Функциия ожидает два аргумента, а передаётся один
    Ответ написан
    Комментировать
  • Как ловить разницу между моделями при общении клиент => сервер?

    yarkov
    @yarkov
    Помог ответ? Отметь решением.
    interface RequestModel<T> extends Request {
      body: T
    }
    
    class UserRegisterModel {
      first_name: string;
      last_name: string;
      email: string;
      password: string;
    
      constructor({first_name}) {
        this.first_name = firstname;
        // И так все НУЖНЫЕ поля
      }
    }
    
    app.post('/register', async (req: RequestModel<UserRegisterModel>, res) => {
      if(req.body) {
        const user = new UserRegisterModel(req.body);
        // Хоба и лишних полей нет ))
    }
    });
    Ответ написан
    Комментировать
  • Как понять эту строку?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Это тернарный оператор (не страшное слово, просто от числа «3»)

    условие ? выражение1 : выражение2


    Частая ошибка, открыв для себя этот чудесный синтаксис, пихать его везде, где есть условие.
    Но это не замена if .. else, где нужны разные действия.
    Тернарный оператор — для получения значения.
    Ответ написан
    Комментировать
  • Как скопировать текст из iframe в переменную js?

    bingo347
    @bingo347 Куратор тега JavaScript
    Crazy on performance...
    Если в iframe загружена страница с того же origin (протокол + домен + порт) откуда загружена текущая - то Вы имеете полный доступ к его window через свойство contentWindow. Соответственно можете обращаться к его DOM, глобальным переменным, менять их и т.д.

    Если в iframe будет страница с другого origin, то ничего этого нет, с ней можно лишь общаться через postMessage api, но если страница не Ваша, то и скрипт для обработки postMessage + каких-либо еще действий Вы туда не вставите.

    Если сторонний сайт отдает нормальные CORS заголовки при запросе с Вашего сайта (что судя по вопросу не так, но все же), то можно скачать страницу как текст через fetch api и распарсить ее через DOMParser.

    В противном случае остается только делать прослойку у себя на сервере, тут простор фантазии может быть очень широким, от банального reverse proxy прямо в nginx до чего-то более умного на любом серверном ЯП.
    Ответ написан
    Комментировать
  • Не удается получить дочерний элемент родителя, в чем проблема?

    mizutsune
    @mizutsune
    Frontend Developer
    Свойство children хранит в себе псевдомассив дочерних элементов. Дочерними элементами считаются все теги, которые непосредственно расположены внутри блока. Подробнее можно прочитать в документации.

    Ну, а так... интересная конечно строка:

    var parent = this.closest('div').className;

    Как вы думаете что содержит в себе переменная parent? HTMLElement или строку содержащую селектор класса выбранного элемента?

    В общем правильнее сделать так:

    const parent = this.closest('.parent-selector');
    const child = parent.querySelector(".b24-form-control-label");


    И вообще, пора бы уже использовать const/let вместо устаревшего var.
    Ответ написан
    Комментировать
  • Сколько может стоить создание копию существующего веб сервиса?

    @rPman
    с упрощенным функционалом (без лишнего)
    самая большая засада в этом кроется, так как лишнее может быть как 99% функционала так и 1%, и соответственно трудозатраты на создания будут отличаться на порядки

    В вашем случае настоятельно рекомендую создать Техническое Задание (найдите человека или компанию, которые помогут с этим) вполне возможно что даже пары сотен баксов хватит, если задача простая, в этом ТЗ не должно быть неоднозначных фраз и типа таких - сделать как там.

    и вот уже с этим ТЗ топать на площадки и спрашивать, за сколько сделаете.

    иначе - гадание на кофейной гуще с неопределенным результатом
    p.s. я скажу вам вчерашний студент тяп ляп сделает за пару сотен баксов три формочки и вдруг вас это устроит?
    Ответ написан
    Комментировать
  • Как тестировать React веб-приложения?

    @dragonesis
    Вопрос задан не очень верно. React из него, на текущем уровне следует выкинуть.
    Далее ознакомится с пирамидой тестирования. Это уже закроет часть вопросов о том, что к какому типу тестов относится. Только после этого следует переходить к специфики реакта.

    Но если ответить на вопрос, то функции с помощью jest или аналогов.
    Сами компоненты React-Testing-Library + Jest
    Взаимодействие компонентов либо всё теми же React-Testing-Library + Jest, либо чем-то из интеграционных: TestCafe или Cypress или аналогом
    Ну и полные сценарии от открытия страницы до совершения последнего в цепочке целевого действия TestCafe или Cypress или аналогом

    Рекомендуют покрытие Unit тестов не менее 90%, причем после обработки через stryker mutator
    Интеграционные и e2e по критическим сценариям

    Как-то так
    Ответ написан
    Комментировать
  • Как переписать небольшой скрипт на чистый js?

    @n1ksON
    мидл
    Ответ написан
    Комментировать
  • Динамически адаптивный шрифт html/css?

    Rsa97
    @Rsa97
    Для правильного вопроса надо знать половину ответа
    line-height: normal;
    Ответ написан
    Комментировать
  • Как обеспечить последовательное выполнение fetch запросов промисами?

    lssssssssssl
    @lssssssssssl
    fetch('https://jsonplaceholder.typicode.com/todos/4')
          .then((response) => {
            response.json().then(console.log);
            return fetch('https://jsonplaceholder.typicode.com/todos/5')
          })
          .then((response) => {
            response.json().then(console.log);
            return fetch('https://jsonplaceholder.typicode.com/todos/6')
          })
          .then(response => response.json().then(console.log))
    Ответ написан
    1 комментарий
  • Почему не получается обратиться к this в JavaScript?

    @GrayHorse
    Ошибка в коде в том, что при вызове filter.update.country() this является объект update, а не filter.

    JS код, идентичный коду на Java:
    class Filter {
        static sex = null;
        static player = null;
        static country = null;
    
        static updateSex() {
            Filter.sex = document.querySelector("#sex").value;
        }
        static updatePlayer() {
            Filter.player = document.querySelector("#player").value;
        }
        static updateCountry() {
            Filter.country = document.querySelector("#country").value;
        }
    }
    
    Filter.updatePlayer();
    console.log(Filter.player);

    или
    class Filter {
        constructor() {
            this.sex = null;
            this.player = null;
            this.country = null;
        }
    
        updateSex() {
            this.sex = document.querySelector("#sex").value;
        }
        updatePlayer() {
            this.player = document.querySelector("#player").value;
        }
        updateCountry() {
            this.country = document.querySelector("#country").value;
        }
    }
    
    const filter = new Filter();
    filter.updateCountry();
    console.log(filter.country);


    Ну и рабочий аналог "кода" из вопроса:
    class Filter {
        fields = {
            country: null,
        }
        update = {
            caller: this,
            country() {
                this.caller.fields.country = "123";
            }
        }
    }
    const filter = new Filter();
    filter.update.country();
    console.log(filter.fields.country);
    Ответ написан
    Комментировать
  • Обработка обращений пакетами?

    Stalker_RED
    @Stalker_RED
    Есть такие штуки как брокеры сообщений, они специально придуманы для быстрого приема сообщений из разных источников, и передачи их обработчикам или клиентам по требованию.
    Там по ссылке их целый список, разной степени навороченности.

    примеры:
    https://habr.com/ru/post/488654/ RabbitMQ
    https://habr.com/ru/post/496182/ Apache Kafka

    Какой именно вам лучше подойдет - сложно сейчас сказать.
    Также можно Redis с этой целью применить.

    В общем виде схема примерно такая:
    Принимаете все подряд сообщения, ставите им статус "в очереди".
    Обработчик берет сообщение, ставит статус "в работе" и дату.
    Если обработал - меняет статус на "обработано".
    Какой-то вотчер периодически проверяет те что в работе, и если времени прошло много - меняет статус "в работе" на "в очереди" и ставит счетчик ошибок. Если Ошибки повторяются - меняет статус на "здесь ошибка в сообщении, разберитесь"

    С доставкой абонентам история похожая, только статус не "в работе" а "ожидает отправку", "отправлен", "принят" и т.д.
    Ответ написан
    Комментировать
  • Как правильно решить проблему TS2345?

    @HealSpirit
    Что такое MouseEventHandler? Эта функция, которая принимает в качестве аргумента event c типом MouseEvent и возвращает пустоту

    У вас функция handleChangeInfoMain типизирована как MouseEventHandler, хотя аргумент типизируется как string

    Попробуйте вот так:
    handleChangeInfoMain: (value: string) => void
    Ответ написан
    1 комментарий