npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@yu_tou/swagger-to-graphql

v4.0.3

Published

![Build Status](https://travis-ci.org/yarax/swagger-to-graphql.svg?branch=master)

Downloads

3

Readme

Build Status

Swagger-to-GraphQL

Swagger-to-GraphQL converts your existing Swagger schema to an executable GraphQL schema where resolvers perform HTTP calls to certain real endpoints. It allows you to move your API to GraphQL with nearly zero effort and maintain both REST and GraphQL APIs. Our CLI tool also allows you get the GraphQL schema in Schema Definition Language.

Try it online! You can paste in the url to your own Swagger schema. There are also public OpenAPI schemas available in the APIs.guru OpenAPI directory.

Features

  • Swagger (OpenAPI 2) and OpenAPI 3 support
  • Bring you own HTTP client
  • Typescript types included
  • Runs in the browser
  • Formdata request body
  • Custom request headers

Usage

Basic server

This library will fetch your swagger schema, convert it to a GraphQL schema and convert GraphQL parameters to REST parameters. From there you are control of making the actual REST call. This means you can reuse your existing HTTP client, use existing authentication schemes and override any part of the REST call. You can override the REST host, proxy incoming request headers along to your REST backend, add caching etc.

import express, { Request } from 'express';
import graphqlHTTP from 'express-graphql';
import { createSchema, CallBackendArguments } from 'swagger-to-graphql';

const app = express();

// Define your own http client here
async function callBackend({
  context,
  requestOptions,
}: CallBackendArguments<Request>) {
  return 'Not implemented';
}

createSchema({
  swaggerSchema: `./petstore.yaml`,
  callBackend,
})
  .then(schema => {
    app.use(
      '/graphql',
      graphqlHTTP(() => {
        return {
          schema,
          graphiql: true,
        };
      }),
    );

    app.listen(3009, 'localhost', () => {
      console.info('http://localhost:3009/graphql');
    });
  })
  .catch(e => {
    console.log(e);
  });

Constructor (graphQLSchema) arguments:

export interface Options<TContext> {
  swaggerSchema: string | JSONSchema;
  callBackend: (args: CallBackendArguments<TContext>) => Promise<any>;
}
  • swaggerUrl (string) is a path or URL to your swagger schema file. required
  • callBackend (async function) is called with all parameters needed to make a REST call as well as the GraphQL context.

CLI usage

You can use the library just to convert schemas without actually running server

npx swagger-to-graphql --swagger-schema=/path/to/swagger_schema.json > ./types.graphql

Apollo Federation

Apollo federation support can be added by using graphql-transform-federation. You can extend your swagger-to-graphql schema with other federated schemas or the other way around. See the demo with a transformed schema for a working example.

Defining your HTTP client

This repository has:

To get started install node-fetch and copy the node-fetch example into your server.

npm install node-fetch --save

Implementing your own HTTP client

There a unit test for our HTTP client example, it might be useful when implementing your own client as well.

The function callBackend is called with 2 parameters:

  • context is your GraphQL context. For express-graphql this is the incoming request object by default. Read more. Use this if you want to proxy headers like authorization. For example const authorizationHeader = context.get('authorization').
  • requestOptions includes everything you need to make a REST call.
export interface CallBackendArguments<TContext> {
  context: TContext;
  requestOptions: RequestOptions;
}

RequestOptions

export interface RequestOptions {
  baseUrl?: string;
  path: string;
  method: string;
  headers?: {
    [key: string]: string;
  };
  query?: {
    [key: string]: string | string[];
  };
  body?: any;
  bodyType: 'json' | 'formData';
}
  • baseUrl like defined in your swagger schema: http://my-backend/v2
  • path the next part of the url: /widgets
  • method HTTP verb: get
  • headers HTTP headers which are filled using GraphQL parameters: { api_key: 'xxxx-xxxx' }. Note these are not the http headers sent to the GraphQL server itself. Those will be on the context parameter
  • query Query parameters for this calls: { id: 123 }. Note this can be an array. You can find some examples on how to deal with arrays in query parameters in the qs documentation.
  • body the request payload to send with this REST call.
  • bodyType how to encode your request payload. When the bodyType is formData the request should be URL encoded form data. Ensure your HTTP client sends the right Content-Type headers.

Resources