reactjs 本机对Firestore的React：火灾恢复(8.2.1)：连接WebChannel传输出错

nc1teljy 于 2023-02-15 发布在 React

关注(0)|答案(8)|浏览(134)

我已经创建了简单的React Native屏幕，可以存储数据到firestore。我已经尝试了下面的代码，但它没有工作，而不是抛出一些错误。有人可以帮助我吗？

- 我的密码：**
- 应用程序js**

import React, { Component } from 'react';
import {StyleSheet,Text,View,TextInput,Button,TouchableHighlight} from 'react-native';

import firebase from 'firebase';
import firestore from '@react-native-firebase/firestore';

const firebaseConfig = {
  apiKey: "*********************",
  authDomain: "test-c78ec.firebaseapp.com",
  projectId: "test-c78ec",
  storageBucket: "test-c78ec.appspot.com",
  messagingSenderId: "106189113329",
  appId: "1:106189113329:web:4bf80ec51eba69ab042650",
  measurementId: "G-875ZSQLZS4"
};
firebase.initializeApp(firebaseConfig);

 export default class App extend components{

check2(){
  console.log("level strarted");
  firebase
  .firestore()
  .collection("MyCollection")
  .doc("mydoc")
  .set({
    key: "2",
    value: "World",
  })
  .then((ref) => { console.log(ref);
    console.log("sucessssssssssssssss")
   });
}

render(){
 return(
  <View>
    <TouchableHighlight style={[styles.buttonContainer, styles.loginButton]} onPress={() =>    this.check2('login')}>
          <Text style={styles.loginText}>Store data</Text>
        </TouchableHighlight>
   </View>
  );
 }
}

- 错误**

WARN     [2021-01-06T10:27:51.153Z]  @firebase/firestore: Firestore (8.2.1): Connection WebChannel transport errored: {"a": {"C": null, "K": [Circular], "a": {"A": 0, "B": [U], "C": true, "F": 45000, "G": false, "I": true, 
"J": -1, "K": "IKeNE9pC779MSM5Rj_dnMg", "Ka": 5000, "Ma": false, "Na": false, "Oa": false, "P": 0, "Pa": 2, "Qa": undefined, "R": [Object], "S": 0, "T": 45498, "Ta": 1, "U": true, "Ua": 10000, "V": 4, "X": false, "Y": [Object], "a": null, "b": [zd], "c": 
[bc], "f": [Z], "fa": false, "g": [Array], "ga": undefined, "h": null, "ha": "https://firestore.googleapis.com/google.firestore.v1.Firestore/Write/channel", "i": null, "ia": "", "j": null, "ja": 8, "l": null, "m": null, "ma": 12, "na": [U], "o": 3, "oa": 
600000, "pa": "ATXNDTEvJ_SpMuY50LXD23HPyh9-AVCM", "qa": -1, "ra": [Ed], "s": null, "u": 0, "v": "gsessionid"}, "b": {"database": "projects/test-c78ec/databases/(default)"}, "c": {"a": [Object], "b": 4, "src": [Circular]}, "f": {"a": [Circular]}, "i": undefined, "j": false, "l": true, "m": true, "o": "https://firestore.googleapis.com/google.firestore.v1.Firestore/Write/channel"}, "defaultPrevented": false, "status": 1, "target": {"C": null, "K": [Circular], "a": {"A": 0, "B": [U], "C": true, "F": 45000, "G": false, "I": true, "J": -1, "K": "IKeNE9pC779MSM5Rj_dnMg", "Ka": 5000, "Ma": false, "Na": false, "Oa": false, "P": 0, "Pa": 2, "Qa": undefined, "R": [Object], "S": 0, "T": 45498, "Ta": 1, "U": true, "Ua": 10000, "V": 4, "X": false, "Y": [Object], "a": null, "b": [zd], "c": [bc], "f": [Z], "fa": false, "g": [Array], "ga": undefined, "h": null, "ha": "https://firestore.googleapis.com/google.firestore.v1.Firestore/Write/channel", "i": null, "ia": "", "j": null, "ja": 8, "l": null, "m": null, "ma": 12, "na": [U], "o": 3, "oa": 600000, "pa": "ATXNDTEvJ_SpMuY50LXD23HPyh9-AVCM", "qa": -1, "ra": [Ed], "s": null, "u": 0, "v": "gsessionid"}, "b": {"database": "projects/test-c78ec/databases/(default)"}, "c": {"a": [Object], "b": 4, "src": [Circular]}, "f": {"a": [Circular]}, "i": undefined, "j": false, "l": true, "m": true, "o": "https://firestore.googleapis.com/google.firestore.v1.Firestore/Write/channel"}, "type": "c"}

- 预期：**

只需将给定数据写入firestore数据库。

reactjs

来源：https://stackoverflow.com/questions/65594133/react-native-to-firestore-firestore-8-2-1-connection-webchannel-transport-er

8条答案

按热度按时间

s6fujrry1#

经过大量的工作，我得到了一个临时的解决方案。解决方案是，只是添加下面的代码后，firebase初始化。我不知道这是正确的解决方案，但现在工作正常。

firebase.initializeApp(firebaseConfig);

firebase.firestore().settings({ experimentalForceLongPolling: true }); //add this..

赞(0）回复(0）举报 2023-02-15

bcs8qyzn2#

这对我很有效：

//Write this line below of firebase.initializeApp(firebaseConfig)

firebase.firestore().settings({ experimentalForceLongPolling: true });

赞(0）回复(0）举报 2023-02-15

vbopmzt13#

在我的例子中，我应该写databaseURL

const firebaseConfig = {...}

但我没有，而且这很关键.
之后，我写了这个，

const firebaseConfig = {
      databaseURL: 'https://{project-id}.firebaseio.com'
    
      apiKey: ...,
      authDomain: ...,
      projectId: ...,
      storageBucket: ...,
      messagingSenderId: ...,
      appId: ...,
      measurementId: ...,
    };

Firestore工作得很好。
请参考以下链接
https://docs.expo.dev/guides/using-firebase/
https：//stackoverflow.com/questions/40168564/where-can-i-find-my-firebase-reference-url-in-firebase-account#：~：text=转到%20身份验证%20选项卡%20并且，此%20是您%20所需的%20字段。

赞(0）回复(0）举报 2023-02-15

cpjpxq1n4#

- TL; DR**

尝试experimentalAutoDetectLongPolling和experimentalForceLongPolling。如果experimentalAutoDetectLongPolling工作，请使用它而不是experimentalForceLongPolling!
Google（https://github.com/firebase/firebase-js-sdk/issues/1674）创建了一个RFC，用于搜索与experimentalForceLongPolling和experimentalAutoDetectLongPolling相关的可重现案例，experimentalAutoDetectLongPolling是与Could not reach Cloud Firestore backend. Backend didn't respond within 10 seconds.错误相关的问题的修复程序，尽管连接正常。根据experimentalForceLongPolling设置的文档，错误似乎与某些代理和/或防病毒程序相关：
这避免了与某些代理、防病毒软件等不正确地无限期缓冲流量的不兼容问题。
但是，启用experimentalForceLongPolling可能会导致性能降低，因为可能会使用长轮询（尽管不需要）：
但是，使用此选项会导致性能下降。
使用experimentalAutoDetectLongPolling时不是这种情况，顾名思义，它试图区分需要长轮询和不需要长轮询的情况。
另一个区别是experimentalAutoDetectLongPolling将来可能会默认启用。experimentalForceLongPolling很可能会被弃用**。

赞(0）回复(0）举报 2023-02-15

nom7f22z5#

将此行添加到firebase.initializeApp(firebaseConfig)行下面。

firebase.firestore().settings({ experimentalForceLongPolling: true, merge:true });

赞(0）回复(0）举报 2023-02-15

bvjveswy6#

我在一个常规的基于CRA/React-Admin的应用程序上实现Firestore云功能（触发器），也看到了这个问题。有一段时间，我有点被related issue和this other one的建议误导了，他们说要将experimentalForceLongPolling标志设置为true。这个解决方案对我不起作用。
相反，我意识到原因很简单（更像是我犯了个愚蠢的错误）：我的触发器注册了一个格式不正确的文档路径。也就是说，我有一个云函数，看起来像这样：

exports.onCreateFruitStand = functions.firestore
.document("vendors/{vendorId}/stands{standId}")
.onCreate(async (change, context) => {
  console.log(`vendors.stands.onCreate: vendors/${context.params.vendorId}/stands/${context.params.standId}`);
  const data = change.data(); // grab the latest data
  ...
});

我的Firestore模拟器没有响应任何新创建的文档。关键是需要将文档路径更改为"vendors/{vendorId}/stands/{standId}"（注意缺少的/）。从某种意义上说，发送到客户端的错误消息是误导性的，Firestore函数应该只说文档路径格式不正确。

赞(0）回复(0）举报 2023-02-15

vh0rcniy7#

在我的情况下，删除这个可以修复问题。

const db = firebase.firestore()
db.settings({
    cacheSizeBytes: firebase.firestore.CACHE_SIZE_UNLIMITED
})
db.enablePersistence()

我认为enablePersistence（）可能会影响一些网络连接设置、防病毒或防火墙。

赞(0）回复(0）举报 2023-02-15

e3bfsja28#

如果你使用的是Firebase v9，那么答案需要调整。如果你和我一样，你遇到这个问题是因为你的应用运行正常，直到你尝试使用Cypress测试你的应用，目标是Firestore模拟器。解决方案是相同的：使用experimentalAutoDetectLongPolling设置。这是我自己配置的：
此配置的工作原理：

// You've initialized a Firebase app somewhere...
const app = initializeApp(firebaseConfig);

// WORKS: Enable long polling auto-detection when initializing Firestore
const db = initializeFirestore(app, { experimentalAutoDetectLongPolling: true, });

此配置将生成"连接WebChannel传输错误"警告和"最近的错误：Firebase错误：[代码=不可用]"错误：

// You've initialized a Firebase app somewhere...
export const app = initializeApp(firebaseConfig);

// SOMETIMES BREAKS: Call getFirestore the way the Firebase docs recommend.
const db = getFirestore(app);

赞(0）回复(0）举报 2023-02-15

我来回答

reactjs 本机对Firestore的React：火灾恢复(8.2.1)：连接WebChannel传输出错

8条答案

相关问题

热门标签

最新问答