网络错误：无法获取离子反应

Posted 2023-03-10

技术标签:

【中文标题】网络错误：无法获取离子反应【英文标题】：Network error: Failed to fetch on ionic react 【发布时间】：2021-03-08 08:15:10 【问题描述】：

这是我第一次在论坛上发帖，我真的需要你的帮助。我遇到了一个问题，我有一个 Ionic/React 应用程序、一个 Node.js 应用程序和一个 graphQL/Apollo API，当我从浏览器调用 graphql API 时，一切正常，但是当我使用电容器构建应用程序并在我的 android 设备上运行它时，我收到“网络错误：无法获取”。

这是我设置 ApolloClient 的 client.ts 代码

import  ApolloClient  from 'apollo-client';
import  createHttpLink  from 'apollo-link-http';
import  setContext  from 'apollo-link-context';
import  InMemoryCache, NormalizedCacheObject  from 'apollo-cache-inmemory';

class RequestUtils 
clientApollo: any;

 constructor() 
     const httpLink = createHttpLink(
         uri: 'http://192.168.1.86:4000/graphql'
     );

     const authLink = setContext((req,  headers ) => (
         headers: 
             ...headers
         
     ));

     this.clientApollo = new ApolloClient(
         link: authLink.concat(httpLink),
         cache: new InMemoryCache()
     );
 


const requestUtils = new RequestUtils();
const client: ApolloClient<NormalizedCacheObject> = requestUtils.clientApollo;

export default client;

这是我的 graphql.ts

import resolvers from "../resolvers/index";
import  ApolloServer, AuthenticationError  from "apollo-server-express";
import  getModels  from "../models/index";
import schemas from "../schemas/index";
import * as express from "express";
import * as cors from "cors";
import  connectToMongo  from "./config";
import  info, success, warning, error  from "./logger";

export class query 
    public app: any;
    constructor() 
        const models = getModels();
        this.app = express();
        this.app.use(cors());
        try 
            info("Starting connection to graphql");
            const server = new ApolloServer(
                typeDefs: schemas,
                resolvers,
                context: async ( req ) => 
                    if (req) 
                        return 
                            models: models
                        ;
                    
                
            );
            this.app = express();
            server.applyMiddleware( app: this.app, path: "/graphql" );
            success(`Connected to graphql`);
         catch (error) 
            warning(error);
        
        this.app.listen(4000, () => 
            connectToMongo();
        );

我认为这是 cors 或 ip 地址之类的问题，但我没有找到任何解决我的问题的方法。我希望有人可以帮助我！

编辑：

我尝试在另一台计算机上运行我的节点服务器，并使用我的 ionic react react webapp 从我的主计算机调用 graphql API。起源实际上是不同的，但没有错误，一切都完美无缺。但是在我的 android 设备上使用我构建的应用程序，总是同样的错误。

所以，我认为这不是 cors，也许是 Capacitor/cordova 或类似的东西。

一开始我还以为安卓app是不允许连接网络的，我查了一下，已经连接了，但是我不确定。

如果有人可以帮助我，那将是非常同情的，我真的被这个困住了，如果我无法连接到服务器和数据库，我的应用程序将毫无用处 XD

【问题讨论】：

【参考方案1】：

遇到了完全相同的问题。

看起来原因是Android默认禁止HTTP请求。

以下修复对我有用：