web-dev-qa-db-ja.com

Reactネイティブfetch（）が機能しないandroid

fetch()関数を呼び出そうとしています。

IOSでは正常に機能しますが、Androidでは機能しません。

_fetch('https://admin.leanpoint.com/Api/User/[email protected]', { 
  method: 'POST', 
  headers: {
    'Authorization': 'Basic c3JpbnVAbWFpbnBvaW50LmRrOnNhaWJhYmE='
  },
})
.then((res) => {
  res.json().then((json) => {
    alert(JSON.stringify(json))
  })
})
.catch((err) => {
  alert(JSON.stringify(err))
})
_

IOSでは.then()と入力しますが、Androidと入力すると.catch()と入力し、errは_{}_になります。

エミュレーターや実際のデバイスでも動作しません。

どんな助けでもありがたいです。 ^ _ ^

Axiosを使用したエラーログ

fetch()を使用すると、{}で.catch()に入ります。

以下のようにAxiosを試してみました。

_axios.post('https://admin.leanpoint.com/Api/User/[email protected]', null, {
      headers: {
        'Authorization': 'Basic c3JpbnVAbWFpbnBvaW50LmRrOnNhaWJhYmE='
      },
      timeout: 2000
    })
    .then((res) => {
      console.log(res.data)
    })
    .catch((err) => {
      console.log(err)
    })
_

そして以下のようなエラーを返します。

_{ [Error: Network Error]
  config:
   { adapter: [Function: xhrAdapter],
     transformRequest: { '0': [Function: transformRequest] },
     transformResponse: { '0': [Function: transformResponse] },
     timeout: 2000,
     xsrfCookieName: 'XSRF-TOKEN',
     xsrfHeaderName: 'X-XSRF-TOKEN',
     maxContentLength: -1,
     validateStatus: [Function: validateStatus],
     headers:
      { Accept: 'application/json, text/plain, */*',
        'Content-Type': 'application/x-www-form-urlencoded',
        Authorization: 'Basic c3JpbnVAbWFpbnBvaW50LmRrOnNhaWJhYmE=' },
     method: 'post',
     url: 'https://admin.leanpoint.com/Api/User/[email protected]',
     data: null },
  request:
   { UNSENT: 0,
     OPENED: 1,
     HEADERS_RECEIVED: 2,
     LOADING: 3,
     DONE: 4,
     readyState: 4,
     status: 0,
     timeout: 2000,
     withCredentials: true,
     upload: {},
     _aborted: false,
     _hasError: true,
     _method: 'POST',
     _response: 'Java.security.cert.CertPathValidatorException: Trust anchor for certification path not found.',
     _url: 'https://admin.leanpoint.com/Api/User/[email protected]',
     _timedOut: false,
     _trackingName: 'unknown',
     _incrementalEvents: false,
     responseHeaders: undefined,
     _requestId: null,
     _cachedResponse: undefined,
     _headers:
      { accept: 'application/json, text/plain, */*',
        'content-type': 'application/x-www-form-urlencoded',
        authorization: 'Basic c3JpbnVAbWFpbnBvaW50LmRrOnNhaWJhYmE=' },
     _responseType: '',
     _sent: true,
     _lowerCaseResponseHeaders: {},
     _subscriptions: [] },
  response: undefined }
_
javascriptandroidreact-nativefetch
11
ppianist

次の解決策を使用してこの問題を解決しました。

Android 9(Pie)からnetworkSecurityConfigをAndroidManifast.xmlに設定する必要があります

<?xml version="1.0" encoding="utf-8"?>
<manifest ... >
    <application Android:networkSecurityConfig="@xml/network_security_config">

    </application>
</manifest>

次に、network_security_config.xmlという名前の新しいxmlリソースファイルをvalue/xmlフォルダーに作成します。この構成は、アプリの基本構成またはデフォルトのセキュリティ構成に適用され、すべてのクリアテキストトラフィックを無効にします。

<network-security-config>
  <domain-config cleartextTrafficPermitted="false">
    <domain includeSubdomains="true">172.16.33.1</domain>
  </domain-config>
</network-security-config>

詳細については、次のリンクを確認してください

https://codelabs.developers.google.com/codelabs/Android-network-security-config/#

https://developer.Android.com/training/articles/security-config

https://medium.com/@son.rommer/fix-cleartext-traffic-error-in-Android-9-pie-2f4e9e2235e6

1
Vishal Dhanotiya

2番目のログはエラーを示しています。問題はSSL証明書です。解決策については、この投稿を参照してください：

Android SSL接続）のTrust Anchorが見つかりません

1
sfratini

これは機能しています、Android\app\src\main\AndroidManifest.xml

<application
      ......
      Android:usesCleartextTraffic="true"
      ......>
0
Momenul Islam Rijvi

@mohsenomidiのおかげで、このエラーはhttpリクエストが原因で発生します。この行をAndroidManifest.xmlのAndroid:usesCleartextTraffic="true"から<application/>に追加します

<manifest xmlns:tools="http://schemas.Android.com/tools"> .... 
    <application 
        Android:usesCleartextTraffic="true" > ... 
    </application> 
</manifest>

https://github.com/facebook/react-native/issues/24627#issuecomment-492159371

0
Nagibaba

これは私のために働く

<manifest xmlns:Android="http://schemas.Android.com/apk/res/Android"
xmlns:tools="http://schemas.Android.com/tools">



<application Android:usesCleartextTraffic="true" tools:targetApi="28" />
0
mayuresh patil

Androidエミュレータ、インターネット接続アイコンの近くに!が表示されている場合は、エミュレータのインターネットの問題が原因である可能性があります。次に、ネットワークのDNSアドレスを8.8.8.8に変更する必要があります。この答えを見て、方法を知る必要があります： https://stackoverflow.com/a/49332186/6170191

0
Nagibaba

例外トレースバックで、Java CertPathValidatorExceptionがネットワーク要求をブロックしていることを確認し、Androidに関連する this 回答を確認できます。

0
Renjith Thankachan

"I Am Batman"は Axios を使用することをお勧めしました。 Axiosはsimplerであり、これらの奇妙なエラーを使用する代わりに、iOS/Androidの両方で一貫して動作することがわかっています。以下は、githubから直接POSTリクエストを送信する例です。

    axios.post('/user', {
    firstName: 'Fred',
    lastName: 'Flintstone'
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });
0
Perniferous