React Routerを使ってファイルを取得する

Question

テキストファイルを変数に読み込む必要があります。

ファイルのURLでfetch命令を使用しましたが、nginx WebサーバーがすべてのクエリをReactに渡すように設定されているため、動作しませんでした。

リアクションは静的ファイルを提供しません。あるいは、いくつかのルートを定義する必要があります。

nginxの設定をハッキングする問題を解決しましたが、それはあまりにも多くのハッキングだと言われ、Reactルーティングなどを使用しなければなりません。

fetch("/rankitapp/src/T9tutorial/dictionary.txt") 
    .then((response) => response.text()) 
    .then(function(data) { 

     t9init(data); 

    }) 

それは私がnginxの設定をハックする場合にのみ機能します。

だから、私はそのURL私がフェッチを書く場合http://www.example.com/rankitapp/src/T9tutorial/dictionary.txt

あるファイルを持っている想像してみてください。

nginxがすべてのクエリをReactに渡す元の標準設定では、動作しません。

私はnginxをハックすることはできないことを知って、どのように私はそのファイルをフェッチするのですか？

特別なルートを作成していますか？

他の命令を使用してファイルを変数にインポートしていますか？

Answer 1

フェッチではなくAxiosを使用していますが、HTTPステータスエラーを処理する方がはるかに優れています。私たちの設定は、環境変数をJSONファイルを通して還元することです。

は、これは問題の一部とすることができるように聞こえる：あなたはそれを使用することができます前に、「テキストに応答を変換」

.then(response => response.text()) 

。

私たちのコードは次のようになります。

const request = { 
    url: 'http://example.com/my/file.text', 
    method: 'GET' 
}; 

return axios(request) 
.then((response) => { 
    // response.data has our data/values 
    // we take the raw JSON and shove this into our redux state. 
    // No parsing or anything like that. 
    // No need to run response.text() on it 
}) 
.catch((error) => { 
    dispatch(failureHandler(error)); 
}); 

これはAxios vs Fetch