source

VueJS + Firestore - 자동 저장 투표

factcode 2022. 8. 17. 23:43
반응형

VueJS + Firestore - 자동 저장 투표

스택 오버플로와 유사한 사이트를 가지고 있으며 사용자가 게시물을 올리거나 내릴 수 있습니다.Vuejs / Firestore / VUEX 아키텍처에서 이 정보를 효율적으로 Firestore에 저장하는 방법은 무엇입니까?stackoverflow/reddit과 같은 다른 사이트에서는 이 문제를 어떻게 처리합니까?

Firestore는 기입에 따라 과금되고 사용자가 여러 번 연속적으로 투표를 올리거나 내리거나 할 수 있기 때문에 클릭으로 직접 저장하고 싶지 않습니다.또한 이를 통해 트리거되는 여러 클라우드 기능도 있으며, 각 기능을 완료하는 데 시간이 걸립니다.

몇 가지 대안이 있습니다.투표 후 타이머 인터벌을 2초 설정할 수 있으며, 그 시간 내에 변경되지 않으면 firestore에 커밋합니다.이는 사용자가 페이지를 너무 빨리 벗어나서 몇 개의 큰 사이트를 테스트한 결과 이 접근 방식은 품질이 떨어진다는 단점이 있습니다.

또 다른 방법은 VUEX를 사용하여 페이지 새로 고침/종료 시 절약하는 것입니다.이를 위해 찾은 솔루션은 window 오브젝트를 사용하는 것에 의존하고 있는 것 같습니다만, SSR를 앱에 실장했을 경우, 동작하지 않는 경우가 있다고 합니다.

이를 위한 솔루션이 내장되어 있지 않을까요?

악의적인 사용자로부터 백엔드를 보호하는 일반적인 방법은 특정 이벤트에 환율 제한을 추가하는 것입니다.당신의 경우, 업/다운 투표 이벤트.

첫 번째 접근법

당신이 언급한 것은 요금제한이 작동하는 방식에 매우 근접합니다.사용자가 클릭한 후 2초 후에 Firestore로 이벤트를 기동하는 것만으로 아무것도 변경되지 않고 이벤트를 즉시 기동하여 2초간 차단할 수 있습니다.이렇게 하면 사용자는 2초 안에 페이지를 떠날 수 있으며, 상향/하향 투표는 여전히 데이터베이스에 유지됩니다.

두 번째 접근법

이것은 실제로 시도해 본 적이 없는 것입니다만, SSR와 조합해 발생할 가능성이 있는 문제에 대해 이미 언급하고 있는 것만으로, 일시적인 로컬 주에 보존하는 것이 복잡하기 때문에, 이 어프로치를 실시할 가치가 없다고 생각했습니다.

엑사플 용액

github 문제 댓글에서 복사한 것입니다.jsfiddle을 examp로 참조해 주세요.

하여 사용자별 할 수 있는 .link to fiddle http://jsfiddle.net/firebase/VBmAhttp.net/firebase/VBmA

지금까지 이 정보를 공개하는 것에 대해 논의해 왔지만, 현재로서는 쿼터, 환율 제한 또는 과금 메트릭은 공개하지 않습니다.이러한 설정에는 규칙(authN/Z, 리소스 정의, 유형 검증용)보다 더 나은 방법이 있을 수 있습니다.이러한 파일이 노출되는 것에 대한 우려는 다른 설정 파일(firestore)이 급증하는 것입니다.quota, firestore.syslog, firestore.syslog 등)를 사용하여 사용자를 불필요하게 혼란스럽게 합니다.

문제: https://github.com/firebase/firebase-js-sdk/issues/647#issuecomment-380303400

언급URL : https://stackoverflow.com/questions/52787378/vuejs-firestore-autosaving-votes

반응형