programing

Ajax 오류 후 RxJS 계속 듣기

topblog 2023. 9. 10. 11:53
반응형

Ajax 오류 후 RxJS 계속 듣기

내부에서 관찰 가능한 오류가 발생하면 RxJs가 클릭 이벤트 수신을 중지합니다(Ajax 요청).이벤트 청취자를 버튼 클릭 이벤트에 계속 연결하고 내부 ajax 오류를 우아하게 처리하는 방법을 찾고 있습니다.

여기 제 예시 코드와 플렁커 링크가 있습니다.

var input = $("#testBtn");
var test = Rx.Observable.fromEvent(input,'click');

var testAjax = function() {
  return Rx.Observable.range(0,3).then(function(x){ 
    if(x==2)throw "RAWR"; //Simulating a promise error.
    return x;
  });
}

test.map(function(){
  return Rx.Observable.when(testAjax());
})
.switchLatest()
.subscribe(
  function (x) {
      console.log('Next: ', x);
  },
  function (err) {
      console.log('Error: ' + err);   
  },
  function () {
      console.log('Completed');   
  });

http://plnkr.co/edit/NGMB7RkBbpN1ji4mfzih

사용할 수 있습니다.catch연산자(또는 더catchExceptionalias)에서 관찰 가능한 항목에서 발생하는 오류를 잡고 처리하여 가입자에게 오류를 알리지 않습니다.

오류 무시:

return Rx.Observable
    .when(testAjax())
    .catch(Rx.Observable.empty()); // continues with an empty obs after error.

오류 처리:

var empty = Rx.Observable.return('default value');
return Rx.Observable
    .when(testAjax())
    .catch(function (error) {
        console.log('error:', error);
        return empty;
    });

저는 이것을 어떻게 해석하는지에 대한 제 자신의 문제에 부딪혔습니다.onErrorResumeNext)이 작동했습니다.제가 직면한 어려움은 캐치(또는 다음 재개)가 어떤 맥락에 적용되는지였습니다.제가 이해할 수 있는 간단한 구어 번역은 다음과 같습니다.

관측 가능한 것들의 흐름이 주어지면,catch(또는onErrorResumeNext)에서 오류를 사용하고 원본 스트림을 계속할 수 있는 하나 이상의 관측치를 제공할 수 있습니다.

핵심은 원래 소스가 중단되고 에서 제공하는 관측 가능한 것으로 대체된다는 것입니다.catch/onErrorResumeNext기능.이것은 만약 당신이 이런 것을 가지고 있다면:

var src = Rx.Observable
    .interval(500)
    .take(10)
    .select(function(x) {
        if (x == 5) {
            return Rx.Observable.throw('Simulated Failure');
        }

        return Rx.Observable.return(x * 2);
    })

그다음에 추가..catch(Rx.Observable.return('N/A'))아니면.onErrorResumeNext(Rx.Observable.return('N/A'))실제로 당신의 스트림을 계속하지는 않을 것입니다(에 의해 결정됨).interval), 대신 최종 관측 가능한 것으로 스트림을 종료합니다.N/A).

대신 장애를 우아하게 처리하고 원래 스트림을 계속하려면 다음과 같은 작업을 수행해야 합니다..select(function(x) { return x.catch(Rx.Observable.return('N/A')); }). 이제 스트림은 스트림에서 기본값이 잡힌 상태로 실패한 모든 관찰 가능한 요소를 대체한 다음 기존 소스 스트림으로 계속 진행합니다.

var src = Rx.Observable
    .interval(500)
    .take(10)
    .select(function(x) {
        if (x == 5) {
            return Rx.Observable.throw('Simulated Failure');
        }

        return Rx.Observable.return(x * 2);
    })
    //.catch(Rx.Observable.return('N/A'))
    //.onErrorResumeNext(Rx.Observable.return('N/A'))
    .select(function(x) { return x.catch(Rx.Observable.return('N/A')); })
    .selectMany(function(x) { return x; });


var sub = src.subscribe(
    function (x) { console.log(x); },
    function (x) { console.log(x); },
    function () { console.log('DONE'); }
);

// OUTPUT:
// 0
// 2
// 4
// 6
// 8
// N/A
// 12
// 14
// 16
// 18
// DONE

이것을 실제로 보여주는 JSFiddle이 있습니다.

합격된 답변을 시도해보고도 아직 조금 혼란스러웠기 때문에 결국 이것이 저에게 도움이 되었습니다.이것이 제가 받은 것입니다.

  Rx.Observable.fromEvent(emitter, events.SUBMIT_EVENT)
      .flatMapFirst(email=>{
        return $.ajax({
          method: "POST",
          url: '/email',
          data: {
            email: email
          },
        }).promise()
      })
      .subscribe(response=>{
        if (response) {
          //do your success thing here
            }
          },
         error =>{
           //do your error thing
          }
         )

서버가 오류를 반환했을 때(사용자가 이미 전자 메일을 입력했을 때와 같이) 사용자의 전자 메일 양식 제출을 다시 들을 수 없습니다.이것이 제게 효과가 있었던 것입니다.

  Rx.Observable.fromEvent(emitter, events.SUBMIT_EVENT)
      .flatMapFirst(email=>{
        return $.ajax({
          method: "POST",
          url: '/email',
          data: {
            email: email
          },
        }).promise()
      })
      .doOnError(error=> {
        //do your error thing here
      })
      .retry()
      .subscribe(response=>{
        if (response) {
          //do your success thing here
        }
      })

언급URL : https://stackoverflow.com/questions/24856662/rxjs-continue-listening-after-ajax-error

반응형