首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何在纯 JavaScript 中使用 GraphQL

但是,如果你需要使用一个 GraphQL API,你很自然就会想到自己需要使用 React 和 / 或其他一些库才能让它跑起来。...这是因为许多教程和示例代码似乎都基于这样一个假设,也就是说如果你在使用 GraphQL,就需要使用这些库。 但是,一个对 GraphQL API 的查询只不过是一个定制格式的 HTTP 请求而已。...由于 GraphQL 是通过单个端点运行的,因此端点响应的数据完全取决于你的查询。这个查询需要正确格式化 GraphQL。想知道如何构建查询吗?请查阅关于如何编写 GraphQL 查询的教程。...尽管这对 GraphQL 调用来说并不重要,但我使用 js-beautify 正确格式化了要显示的 JSON 结果,然后使用 Prism 给它上了色。...显然,一般来说你不会想要简单地向用户显示查询结果,因此让我们看一下如何使用返回的数据。 使用 GraphQL 查询响应 GraphQL 的一大优点是,它的响应只是纯 JSON,因此数据使用起来很容易。

3.6K10
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    如何使用GraphQL进行前端数据交互

    在这个世界里,我们可以通过使用GraphQL来进行前端数据交互,轻松解决我们的问题。 那么,如何使用GraphQL进行前端数据交互呢?首先,我们需要安装GraphQL的Python库。...你可以使用pip命令来安装,就像吃饭一样简单。pip install graphql然后,我们需要定义我们的数据模型和查询语句。...我可以为您提供一个简短的示例,展示如何使用GraphQL进行前端数据交互,我们就以人民币对美元期汇率升破7的相关数据来示例下:import requests# 代理服务器(产品官网 www.16yun.cn...总结: 好了,今天我们一起探讨了如何使用GraphQL进行前端数据交互。...虽然人民币对美元即期汇率升破7的消息让人们感到不安,但是在编程世界里,我们可以通过使用GraphQL来轻松解决前端数据交互的问题。

    31920

    Python 使用 os.fork() 创建子进程

    Linux 操作系统提供了一个 fork() 函数用来创建子进程,这个函数很特殊,调用一次,返回两次,因为操作系统是将当前的进程(父进程)复制了一份(子进程),然后分别在父进程和子进程内返回。...子进程永远返回0,而父进程返回子进程的 PID。我们可以通过判断返回值是不是 0 来判断当前是在父进程还是子进程中执行。...process pid=%s, ppid=%s" % (os.getpid(), os.getppid()) time.sleep(5) # 下面的内容会被打印两次,一次是在父进程中,一次是在子进程中...pid=18595, ppid=25925 After fork process pid=18596, ppid=18595 最后,由于 fork() 是 Linux 上的概念,所以如果要跨平台,最好还是使用...subprocess 模块来创建子进程。

    1.8K60

    如何使用GraphQLmap对GraphQL节点进行渗透测试

    关于GraphQLmap GraphQLmap是一个可以跟GraphQL节点交互的脚本引擎,广大研究人员可以使用GraphQLmap来针对GraphQL节点进行渗透测试和安全研究。...using POST and JSON 功能和使用样例 跟一个GraphQL节点连接 python3 graphqlmap.py -u https://yourhostname.com/graphql...架构 使用dump_new导出GraphQL架构,这个功能将会自动使用找到的字段填充”autocomplete”: GraphQLmap > dump_new...字段模糊测试 使用GRAPHQL_INCREMENT和GRAPHQL_CHARSET来对参数进行模糊测试: GraphQLmap > {doctors(options: 1, search: "{ \"...{ \"lastName\": { \"$regex\": \"Admin\"} }"){firstName lastName id}} 视频演示:点击底部【阅读原文】观看 NoSQLi注入 在请求中使用

    1.9K30

    【译】如何在 Node.js 中创建安全的 GraphQL API

    原文地址:How to Create a Secure Node.js GraphQL API 作者:Marcos 本文的目的是提供一份快速指南 -- 《如何快速在如何在 Node.js 中创建安全的...尽管本文应该以一个真实简单的场景来演示说明如何构建和使用 GraphQL APIs,但我们不会对 GraphQL 进行详细的介绍。...接下来,我们将演示如何使用 GraphQL、Node.js 和 Express 来构建 API ! 准备开始 GraphQL 我们会先为 GraphQL API 提供一个构思。...初始化项目 我们先创建一个名为 node-graphql 的文件夹。然后我们打开一个终端或者 git 控制台,并使用 npm init 来初始化。...; 创建模块 (Module) 的基本方法; 测试我们的 GraphQL API; 为了将内容侧重于开发使用,本文忽略了开发中一些重要的内容,简单总结如下: 新增内容时需要校验 对服务中的错误进行正确处理

    2.5K20

    如何使用JavaScript 将数据网格绑定到 GraphQL 服务

    前言 作为一名前端开发人员,GraphQL对于我们来说是令人难以置信的好用。它可以用来简化数据访问,这让我们的工作变得更加容易。 什么是 GraphQL?...GraphQL 的美妙之处在于您可以准确定义要从服务器返回的数据以及您希望其格式化的方式。它还允许您通过单个请求从多个来源获取数据。 GraphQL 还使用类型系统来提供更好的错误检查和消息传递。...实际使用 日常开发过程中我们可以用我们常用的JavaScript来直接操作GraphQL,并将自己想要的数据呈现在页面上, 我们可以参考这个简单的应用程序,我们将仅使用 fetch API 来调用 GraphQL...本教程展示了 GraphQL 和 SpreadJS如何简单地构建应用程序。 GraphQL 和 SpreadJS都有更多功能可供探索,因此您可以做的事情远远超出了这个示例。...Chrome开发者工具使用教程 从表单驱动到模型驱动,解读低代码开发平台的发展趋势 低代码开发平台是什么? 基于分支的版本管理,帮助低代码从项目交付走向定制化产品开发

    14610

    如何在 React.js 项目中使用 GraphQL

    当与 React.js 结合使用时,这个强大的 JavaScript 库为创建动态、响应式的 Web 应用程序打开了无限的可能性。...在本指南中,我们将介绍如何将 GraphQL 无缝集成到您的 React.js 项目中。什么是 GraphQL?GraphQL 是用于 API 的查询语言,也是用于执行那些查询的运行时。...如果还没有,请使用以下命令创建一个:npx create-react-app my-graphql-appcd my-graphql-appnpm start现在,让我们安装 GraphQL 所需的软件包...连接到 GraphQL 服务器要在 React.js 项目中使用 GraphQL,您需要连接到 GraphQL 服务器。...: new InMemoryCache(),});export default client;在 React 组件中使用 GraphQL 获取数据现在,让我们使用 GraphQL 在 React 组件中获取数据

    50540

    英国卫报基于 Serverless、React 和 GraphQL 构建内容协作工具 Pinboard

    作者 | Rafal Gancarz 译者 | 明知山 策划 | Tina 英国卫报创建了一个讨论和资产共享工具 Pinboard ,并将其整合到公司使用的各种内容管理平台中。...目标是在不创建新的独立工具的情况下将协作功能嵌入到现有工具集中,让编辑可以在生产内容项的上下文之上进行协作。 Pinboard 使用 TypeScript 编写客户端、服务器和基础设施代码。...客户端应用程序是用 Preact 和 Emotion 创建的,并使用 Webpack 进行打包。它使用 Apollo 作为 GraphQL 客户端库。...在服务器端,使用 AWS Lambda 执行所有业务逻辑,使用 AWS RDS for PostgreSQL 存储用户和项目数据。...解析器、提供电子邮件(使用 SES)和网络推送通知、数据同步和身份验证。

    8910

    C# 一分钟浅谈:GraphQL 优化与性能提升

    本文将从常见的性能问题入手,逐步探讨如何优化 GraphQL API。 常见性能问题 N+1 查询问题 N+1 查询问题是 GraphQL 中最常见的性能瓶颈之一。...解析器性能 解析器是处理 GraphQL 查询的核心组件,其性能直接影响整个 API 的响应时间。复杂的解析逻辑或频繁的 I/O 操作都可能导致性能下降。 如何避免和解决这些问题 1....优化解析器性能 解析器的性能优化可以从以下几个方面入手: 异步编程:使用 async/await 来处理 I/O 操作,避免阻塞主线程。 懒加载:对于不常用的数据,可以采用懒加载的方式,按需加载。...并行处理:对于独立的子查询,可以并行处理以提高效率。...通过解决 N+1 查询问题、避免过度取数据、合理使用缓存以及优化解析器性能,我们可以显著提升 GraphQL API 的性能。

    10710

    C# 一分钟浅谈:GraphQL 优化与性能提升

    本文将从常见的性能问题入手,逐步探讨如何优化 GraphQL API。常见性能问题N+1 查询问题 N+1 查询问题是 GraphQL 中最常见的性能瓶颈之一。...解析器性能 解析器是处理 GraphQL 查询的核心组件,其性能直接影响整个 API 的响应时间。复杂的解析逻辑或频繁的 I/O 操作都可能导致性能下降。如何避免和解决这些问题1....优化解析器性能解析器的性能优化可以从以下几个方面入手:异步编程:使用 async/await 来处理 I/O 操作,避免阻塞主线程。懒加载:对于不常用的数据,可以采用懒加载的方式,按需加载。...并行处理:对于独立的子查询,可以并行处理以提高效率。...通过解决 N+1 查询问题、避免过度取数据、合理使用缓存以及优化解析器性能,我们可以显著提升 GraphQL API 的性能。

    13910

    如何使用lambda表达式提升开发效率

    ——《且听风吟》 高手问答第 305 期 —— 如何使用 lambda 表达式提升开发效率? Java8的一个大亮点是引入Lambda表达式,使用它设计的代码会更加简洁。...当开发者在编写Lambda表达式时,也会随之被编译成一个函数式接口。...Lambda表达式 https://docs.oracle.com/javase/tutorial/java/javaOO/lambdaexpressions.html 简单来说:就是把我们的函数(方法...,只需要在调用的地方,new一下接口,创建一个匿名内部类即可 但这样还有个问题,我们每次都要写这么一大几行代码,特别麻烦 由此而生,我们有了lambda这种简写的形式 https://docs.oracle.com...java.util.stream (Java Platform SE 8 ) // 声明式编程是告诉计算机需要计算“什么”而不是“如何”去计算 // 现在,我想要一个List,包含3个数字6 List<

    18640

    如何使用 vite 创建项目

    Vue官方推荐使用Vite来创建项目。 2、Node.js安装 Node.js官网指路:Node.js官网 使用Vite之前需要先安装Node.js。...2.1创建方式一:使用vite官网提供的命令 2.1.1 运行项目创建命令 确保当前工作目录正是打算创建项目的目录,在当前文件夹目录栏内输入cmd并回车,在该文件夹路径下打开命令行窗口...通过键盘上下键选择使用的语言。根据实际使用需要选择,Vue3更推荐使用TypeScript。回车完成选择。 完成vue项目的创建。运行下方三条命令即可运行该项目。...2.2创建方式二:使用Vue官网提供的命令 2.2.3与创建方式一的区别 这一指令将会安装并执行 create-vue,它是 Vue 官方的项目脚手架工具。...可以理解成vite可以支持很多不同类型的框架,第一种是创建时选择使用Vue框架,第二种是直接创建Vue项目,不需要选择。

    19410

    Lambda 表达式有何用处?如何使用?

    作者:Mingqi 链接:zhihu.com/question/20125256/answer/324121308 本文章出自热文知乎话题「Lambda 表达式有何用处?如何使用?」...在Java 8里面,所有的Lambda的类型都是一个接口,而Lambda表达式本身,也就是”那段代码“,需要是这个接口的实现。...由于静态函数其实只是对List进行了一通操作,这里我们可以甩掉静态函数,直接使用stream()特性来完成。...Optional如果不结合Lambda使用的话,并不能使原来繁琐的null check变的简单。 ? 只有当Optional结合Lambda一起使用的时候,才能发挥出其真正的威力!...比如如何handle lambda exception,如何利用Lambda的特性来进行parallel processing等。总之,我只是一如既往地介绍个大概,让你大概知道,哦!

    56110

    Python Lambda函数是什么,如何使用它们?

    本教程将向您介绍 Python Lambda 函数以及如何使用它们。 译自 What Are Python Lambda Functions and How Do You Use Them?...20+10=30 我们还可以创建一个 Lambda 函数,其中包含两个变量(假设为 x 和 y)并将它们相乘。...但是我们如何在代码中有效地使用 Lambda 函数?我们为什么不使用 Lambda 函数定义一个函数,然后在代码中稍后调用该函数?...但是它作为 Lambda 函数如何工作?如下所示: a = lambda x : x * 10 print(a(3)) 以上代码将打印出相同的结果,但我们只需要使用 2 行代码。...当然,如果我们想要创建一个将在代码中反复使用的函数,我们不会选择 Lambda 函数。但是对于那些只使用一次的函数,Lambda 是不二之选。为什么会这样?

    11110
    领券