Schema tutorial
Schema tutorialLesson 24: Translating content from URL

Lesson 24: Translating content from URL

We can combine the fields to execute HTTP requests (provided by the HTTP Client extension) with directive @strTranslate (provided by the **Google Translate** extension), to translate the content from any URL.

GraphQL query to translate content from a URL

This query, given a URL as input, its language, and what language to translate it to, fetches the content from the URL and performs the translation using Google Translate:

query TranslateContent(
  $url: URL!
  $fromLang: String!
  $toLang: String!
) {
  _sendHTTPRequest(input: {
    url: $url,
    method: GET
  }) {
    body
    translated: body @strTranslate(
      from: $fromLang
      to: $toLang
    )
  }
}

For instance, passing the URL of some Markdown file in a GitHub repo, and language code "es":

{
  "url": "https://raw.githubusercontent.com/GatoGraphQL/GatoGraphQL/c870d8906ae1aec3c81acc039c53acc7aab5dff0/layers/GatoGraphQLForWP/plugins/gatographql/docs/modules/single-endpoint/en.md",
  "fromLang": "en",
  "toLang": "es"
}

...will translate the Markdown content to Spanish:

{
  "data": {
    "_sendHTTPRequest": {
      "body": "# Single Endpoint\n\nExecute queries against the GraphQL server through the public single endpoint.\n\nBy default the endpoint is `/graphql/`, and the path can be configured through the Settings.\n\n![Single endpoint in Settings](../../images/settings-single-endpoint.png \"Single endpoint in Settings\")\n\nThe GraphQL single endpoint can be configured by assigning a Schema Configuration to it. To do this, on section \"Schema Configuration\" select the desired entry from the dropdown for \"Schema Configuration for the Single Endpoint\":\n\n<div class=\"img-width-1024\" markdown="1">\n\n![Settings for the Schema Configuration for the Single Endpoint](../../images/settings-schema-configuration-for-single-endpoint.png)\n\n</div>\n\n## Clients\n\nInteract with the single endpoint via the available clients.\n\n### GraphiQL\n\nIf module \"GraphiQL for Single Endpoint\" is enabled, then the single endpoint's GraphiQL client becomes publicly available.\n\nTo open it, click on link \"­ččó GraphiQL (public)\" on the plugin's menu:\n\n<div class=\"img-width-1024\" markdown="1">\n\n![Single endpoint's link to the GraphiQL client](../../images/single-endpoint-graphiql-link.png)\n\n</div>\n\nBy default, the client is exposed under `/graphiql/`. This path can be modified on the Settings, under tab \"GraphiQL for Single Endpoint\":\n\n<div class=\"img-width-1024\" markdown="1">\n\n![Path to GraphiQL client](../../images/settings-graphiql-for-single-endpoint.png)\n\n</div>\n\n### Interactive Schema (Voyager)\n\nIf module \"Interactive Schema for Single Endpoint\" is enabled, then the single endpoint's Voyager client becomes publicly available.\n\nTo open it, click on link \"­ččó Schema (public)\" on the plugin's menu:\n\n<div class=\"img-width-1024\" markdown="1">\n\n![Single endpoint's link to the Interactive Schema client](../../images/single-endpoint-interactive-schema-link.png)\n\n</div>\n\nBy default, the client is exposed under `/schema/`. This path can be modified on the Settings, under tab \"Interactive Schema for Single Endpoint\":\n\n<div class=\"img-width-1024\" markdown="1">\n\n![Path to Voyager client](../../images/settings-interactive-schema-for-single-endpoint.png)\n\n</div>\n",
      "translated": "# Punto final ├║nico\n\nEjecute consultas en el servidor GraphQL a trav├ęs del punto final ├║nico p├║blico.\n\nDe forma predeterminada, el punto final es `/graphql/` y la ruta se puede configurar a trav├ęs de Configuraci├│n.\n\n![Punto final ├║nico en Configuraci├│n](../../images/settings-single-endpoint.png \"Punto final ├║nico en Configuraci├│n\")\n\nEl punto final ├║nico GraphQL se puede configurar asign├índole una configuraci├│n de esquema. Para hacer esto, en la secci├│n \"Configuraci├│n del esquema\", seleccione la entrada deseada del men├║ desplegable para \"Configuraci├│n del esquema para el punto final ├║nico\":\n\n<div class=\"img-width-1024\" descuento=1>\n\n![Configuraci├│n del esquema para el punto final ├║nico](../../images/settings-schema-configuration-for-single-endpoint.png)\n\n</div>\n\n## Clientes\n\nInteract├║e con el punto final ├║nico a trav├ęs de los clientes disponibles.\n\n### GrafiQL\n\nSi el m├│dulo \"GraphiQL para punto final ├║nico\" est├í habilitado, el cliente GraphiQL del punto final ├║nico estar├í disponible p├║blicamente.\n\nPara abrirlo, haga clic en el enlace \"­ččó GraphiQL (p├║blico)\" en el men├║ del complemento:\n\n<div class=\"img-width-1024\" descuento=1>\n\n![Enlace del punto final ├║nico al cliente GraphiQL](../../images/single-endpoint-graphiql-link.png)\n\n</div>\n\nDe forma predeterminada, el cliente est├í expuesto en `/graphiql/`. Esta ruta se puede modificar en Configuraci├│n, en la pesta├▒a \"GraphiQL para punto final ├║nico\":\n\n<div class=\"img-width-1024\" descuento=1>\n\n![Ruta al cliente GraphiQL](../../images/settings-graphiql-for-single-endpoint.png)\n\n</div>\n\n### Esquema interactivo (Voyager)\n\nSi el m├│dulo \"Esquema interactivo para punto final ├║nico\" est├í habilitado, el cliente Voyager del punto final ├║nico estar├í disponible p├║blicamente.\n\nPara abrirlo, haga clic en el enlace \"­ččó Esquema (p├║blico)\" en el men├║ del complemento:\n\n<div class=\"img-width-1024\" descuento=1>\n\n![Enlace del punto final ├║nico al cliente de esquema interactivo](../../images/single-endpoint-interactive-schema-link.png)\n\n</div>\n\nDe forma predeterminada, el cliente est├í expuesto en `/schema/`. Esta ruta se puede modificar en Configuraci├│n, en la pesta├▒a \"Esquema interactivo para punto final ├║nico\":\n\n<div class=\"img-width-1024\" descuento=1>\n\n![Ruta al cliente Voyager](../../images/settings-interactive-schema-for-single-endpoint.png)\n\n</div>\n"
    }
  }
}