将React Native连接到后端（使用Express）

我制作了一个带有React Native的UI，以及一个Cheerio.js scraper（使用Cron Job每天激活一次），我将使用它从web获取某些数据，以便它可以在UI中呈现。然而，我不知道如何将两者联系起来

我很确定我可以用Express（我对后端最满意）实现这一点，但是有人能确切地告诉我需要做什么才能将前端连接到后端吗

---

以防万一，我是一个初级开发人员（前端比后端更好），所以请保持你的答案简单。即使您的答案更具概念性，而不是基于代码，我也非常感谢。

假设您正在与使用Express构建的API进行通信，那么请使用

fetch

，如文档中所述：

API 我很高兴GraphQL可以替代REST。但是，有许多方法可以通过api进行连接。客户机需要指向服务器运行位置的链接，而服务器需要启用该链接

教程 我想我无法比本教程更好地解释它（以Github为例）：

并遵循Stephen Grider关于Udemy的教程，以加深对GraphQL的理解。他在教程中使用了React和notreact Native，但语法仍然非常接近。

重要提示-第一个教程使用“apollo服务器”，而udemy的教程使用graphql。apollo服务器经常更改，graphql可能更清晰

例子 这是我在两者之间的桥梁。最大的困难是处理应用程序前端版本（Next.js）的Cors，并发现可以在（可能会有所不同）而不是本地主机8080上访问服务器

My index.android.js（客户端）：

从“React”导入React
从“react native”导入{AppRegistry}
从“./App”导入应用程序
从“apollo客户端”导入apollo客户端，{createNetworkInterface}；
从'react apollo'导入{ApolloProvider}
常量客户端=（）=>{
const networkInterface=createNetworkInterface({
uri:'http://10.0.3.2:8080/graphql'
})
const客户端=新客户端({
网络接口
});
返回(
)
}
AppRegistry.registerComponent（'apolloclient'，（）=>Client）；

我的app.js服务器端

const express=require（'express'）；
//const bodyParser=require（'body-parser'）；
const mongoose=require（'mongoose'）；
const cors=需要（“cors”）；
常量粉笔=需要（“粉笔”）；
//新进口
//千万别忘了要模型，
//其中为某个模型注册了架构
//忘记它会抛出“模式尚未为模型注册…”
常量模型=需要（'./模型'）；
const expressGraphQL=require（'express-graphql'）；
const schema=require（'./schema/schema'）；
常量app=express（）；
应用程序使用（功能（请求、恢复、下一步）{
res.header（“访问控制允许原点”、“*”）；
res.header（“访问控制允许头”、“来源、X请求、内容类型、接受”）；
next（）；
});
//我的蒙古包
蒙古里警官mongodb://xxx:xxx@xxx.mlab.com:xxx/xxx'；
//mongoose的内置promise库已被弃用，请用ES2015 promise替换
mongoose.Promise=global.Promise；
//连接到mongoDB实例并记录一条消息
//论成败
mongoose.connect（MONGO_URI）；
mongoose.connection.once（'open'，（）=>console.log（`${chalk.blue（`你可以在RN中使用
fetch
来呼叫你的服务器并获取数据。谢谢Francisco！我看了一大堆让我困惑的文档，但这段youtube短片显示fetch在起作用，我成功地做到了我想做的事情！：D@Ryo code你链接的youtube视频显示为私有且不可用。是否有其他选择l墨迹到那个视频。啊……对不起。我三年前链接了那个视频。我不知道它是什么了；但我想链接到弗朗西斯科的文档应该没问题。
import React from 'react'
import { AppRegistry } from 'react-native'
import App from './app'

import ApolloClient, { createNetworkInterface } from 'apollo-client';
import { ApolloProvider } from 'react-apollo'

const Client = () => {
  const networkInterface = createNetworkInterface({
   uri: 'http://10.0.3.2:8080/graphql'
  })
  const client = new ApolloClient({
    networkInterface
  });
  return (
    <ApolloProvider client={client}>
      <App />
    </ApolloProvider>)
}

AppRegistry.registerComponent('apolloclient', () => Client);