如何解析另一個Observable中的Observable？ - rxjs

Question

我有一個Observable ，我在其中消耗了另一個observable，但第二個Observable我無法解決。 這是代碼：

return Observable.fromPromise(axios(config))
        .map(res => {
            return {
                accessToken: res.data.access_token,
                refreshToken: res.data.refresh_token                
            }
        })
        .map(res => {
            return {
                me: getMe(res.accessToken),
                accessToken: res.accessToken,
                refreshToken: res.refreshToken                
            }
        })

function getMe(accessToken) {
    return Observable.fromPromise(axios.get({
        url: 'https://api.spotify.com/v1/me',
    }));
}

getMe函數返回一個Observable ，但它永遠不會被解析。 我試圖添加一個flatMap和一個concat ，但它仍然沒有解決。 如何解決getMe問題？

Answer 1

您是否嘗試過以下（也未經測試）：

function getMe(accessToken) {
  return Rx.Observable.fromPromise(axios.get({
    url: 'https://api.spotify.com/v1/me',
  }));
}    

Rx.Observable.fromPromise(axios(config))
    .map((res) => {
        return {
            accessToken: res.data.access_token,
            refreshToken: res.data.refresh_token                
        }
    })
    .flatMap((res) => {
        return getMe(res.accessToken).map((res2) => {
          res.me = res2;
          return res;
        }
    })
    .subscribe((data) => console.log(data));

如上面的帖子所述， flatMap返回一個observable。 map隨后用於將res與從第二個promise返回的結果res2合並。

另請注意， fromPromise是一個寒冷的fromPromise 。 這意味着您必須訂閱才能啟動。 在你的情況下，我認為你已經有這樣的事情：

someFunction = () => {
  return Rx.Observable.fromPromise(axios(config))
     ...
     ...
}

someFunction.subscribe((data) => console.log(data));

Answer 2

正如@ user3743222指出的那樣， Observable在Promise的意義上沒有resolve 。 如果你想要getMe方法的值，你需要訂閱它返回的Observable 。

return Observable.fromPromise(axios(config))
        .map(res => {
            return {
                accessToken: res.data.access_token,
                refreshToken: res.data.refresh_token                
            }
        })
        .flatMap(function(tokens) {

          //FlatMap can implicitly accept a Promise return, so I showed that here
          //for brevity
          return axios.get({url : 'https://api.spotify.com/v1/me'});
        },

        //The second method gives you both the item passed into the first function
        //paired with every item emitted from the returned Observable`
        //i.e. axios.get(...)
        function(tokens, response) {
          return {
            accessToken: tokens.accessToken,
            refreshToken: tokens.accessToken,
            //Here response is a value not an Observable
            me: response
          };
        });

Answer 3

下面找到的示例代碼（UNTESTED !!）。 一些解釋：

• getMe返回的getMe不會被getMe平（'resolve'屬於promises的世界），因為map運算符不會展平observable。 flatMap do，但你需要以source.flatMap(function(x){return observable})的形式使用它，這里你返回的是POJO而不是Rx.Observable 。
• 因此，為了展平getMe我們使用flatMap 。
• 要添加缺少的字段（ accessToken和refreshToken ），我們在發出res對象（ res$ ）的observable上使用withLatestFrom 。

• 我們使用share因為我們訂閱了兩次res$ ，我們希望所有訂閱者看到相同的值。

   var res$ = Observable .fromPromise(axios(config)) .map(function ( res ) { return { accessToken : res.data.access_token, refreshToken : res.data.refresh_token } }) .share(); var getMe$ = res$.flatMap(function ( res ) {return getMe(res.accessToken)}); var finalRes$ = getMe$.withLatestFrom(res$, function ( getMe, res ) { return { me : getMe, accessToken : res.accessToken, refreshToken : res.refreshToken } }); function getMe ( accessToken ) { return Observable.fromPromise(axios.get({url : 'https://api.spotify.com/v1/me'})); }