When you create a frontend application for your developer portal, users can review a catalog of your API products. This catalog includes the OpenAPI docs, which might include a Try it out feature, such as in the Swagger UI of the following figure.

Figure: Screenshot of a Tracks OpenAPI doc with a Try it out button
Figure: Screenshot of a Tracks OpenAPI doc with a Try it out button

What’s happening

The Try it out feature does not work. The test request returns no response, even when properly formatted.

Why it’s happening

Your portal configuration or OpenAPI spec might be incorrect. Additionally, you might have policies or other network security rules that prevent the feature from working.

How to fix it

  1. Debug your Portal server.

  2. Make sure that you set up the frontend application for the developer portal correctly. Common errors include the following:

    • Selecting the wrong or an incorrectly configured route table for your API products.
    • Incorrect OpenAPI spec in the ApiDoc resource for your APIs.
    • An error in the external authentication setup for users to access the portal. For example, you might need to configure the OIDC provider with certain settings for the frontend app.

  3. In the ApiDoc for your API, check that the full URL for your OpenAPI spec is correct. For example, you might need to replace a hostname api.example.com with the full path and port, such as http://api.example.com:31080.

  4. You might need to apply a CORS policy to allow certain headers and origins, such as localhost. The following example uses the Tracks API product that you configured in the Portal guide. Replace the $PORTAL_URL with the host in the route table that you use to expose the gloo-mesh-portal-server.

      kubectl apply -f - << EOF
apiVersion: security.policy.gloo.solo.io/v2
kind: CORSPolicy
metadata:
  name: dev-portal-cors
  namespace: gloo-mesh-gateways
spec:
  applyToRoutes:
    - route:
        labels:
          api: tracks
          useagePlans: dev-portal
  config:
    allowCredentials: true
    allowHeaders:
      - "Content-Type"
      - "api-key"
    allowMethods:
      - GET
      - POST
      - DELETE
      - PUT
      - OPTIONS
    allowOrigins:
      - prefix: http://localhost
      - prefix: http://127.0.0.1
      - prefix: $PORTAL_URL
EOF