UserScriptを使用してAPI呼び出しをインターセプトし、そこからデータを表示するにはどうすればよいですか？

Question

リクエストを行うwebappがあります（/api/itemと呼んでください）。このリクエストは、普通はユーザーから隠されているitemDataというフィールドを持つjson本体を返しますが、私はそれを表示したいと思います。

したがって、/api/itemにリクエストをリッスンし、itemDataフィールドを表示するuserscriptを作成するにはどうすればよいですか？

参考のためにWebアプリケーションが要求を行っている方法は次のとおりです。

return Promise.resolve(new Request(e,r)).then(sendCookies).then(addLangParam).then(addCacheParam).then(addXsrfKey).then(checkZeroRating).then(function(e) { 
      return fetch(e) 
     }).then(checkStatus).then(checkApiVersionMismatch).then(checkApiResponse) 

ことの大半は無関係ですが、重要な部分は（私が思う）Requestです。

Answer 1

このWebアプリケーションはXMLHttpRequestではなく、Fetch APIを使用しています。

fetch-intercept npm moduleを使用すると、フェッチ要求を代行受信できます。例コード：

import fetchIntercept from 'fetch-intercept' 

fetchIntercept.register({ 
    response(response) { 
    console.log(response) 
    return response 
    } 
}) 

Answer 2

返品予定日はありますか？

もしそうなら、別の「then」を追加することができます。 それ以外の場合は、 "checkApiResponse"を上書きする可能性があります。

Answer 3

@michał-perłakowskiの答えを補うためです。 npmを使用せず、単にfetch-interceptスクリプトをHTMLに含めるには、here's純粋なJavaScript相当のモジュールを使用することができます。