elements icon indicating copy to clipboard operation
elements copied to clipboard

Logout flow is redirect to wrong URL

Open thongxuan opened this issue 8 months ago • 4 comments

Preflight checklist

Ory Network Project

No response

Describe the bug

Clicking on Logout button in Signin UI will lead to a broken URL.

My app is configure to run locally at port 8001, there should be noway that the UI redirect me to

https://identity-7fbf566ddc-kd7s4:3000/self-service/logout?token=ory_lo....

Image

Reproducing the bug

Using

"@ory/elements-react": "^1.0.0-rc.5", "@ory/nextjs": "^1.0.0-rc.0",

Relevant log output


Relevant configuration


Version

"@ory/elements-react": "^1.0.0-rc.5", "@ory/nextjs": "^1.0.0-rc.0",

On which operating system are you observing this issue?

None

In which environment are you deploying?

None

Additional Context

No response

thongxuan avatar Jun 09 '25 08:06 thongxuan

We are self-host ory kratos & hydra, this is our config

import type { OryClientConfiguration } from "@ory/elements-react";

const config: OryClientConfiguration = {
  project: {
    default_locale: "en",
    default_redirect_url: "/",
    error_ui_url: "/error",
    locale_behavior: "force_default",
    name: "my-project",
    registration_enabled: true,
    verification_enabled: true,
    recovery_enabled: true,
    registration_ui_url: "/registration",
    verification_ui_url: "/verification",
    recovery_ui_url: "/recovery",
    login_ui_url: "/login",
    settings_ui_url: "/settings",
  },
};

export default config;

thongxuan avatar Jun 09 '25 08:06 thongxuan

our package.json

{
  "name": "my-project",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev --turbopack -p 8001",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@ory/elements-react": "^1.0.0-rc.5",
    "@ory/nextjs": "^1.0.0-rc.0",
    "next": "15.3.3",
    "react": "^19.0.0",
    "react-dom": "^19.0.0"
  },
  "devDependencies": {
    "@eslint/eslintrc": "^3",
    "@types/node": "^20",
    "@types/react": "^19",
    "@types/react-dom": "^19",
    "eslint": "^9",
    "eslint-config-next": "15.3.3",
    "postcss": "^8.5.4",
    "sass": "^1.89.1",
    "tailwindcss": "^4.1.8",
    "typescript": "^5"
  }
}

thongxuan avatar Jun 09 '25 08:06 thongxuan

this can be fixed using this setting in middleware

export const oryMiddleware = createOryMiddleware({
  ...oryConfig,
  forceCookieDomain: process.env.NEXT_PUBLIC_COOKIE_DOMAIN,
});

export const middleware = (request: NextRequest) => {
  const forwardedHost = request.headers.get("x-forwarded-host");
  request.nextUrl.host = forwardedHost || request.nextUrl.host;
  request.nextUrl.port = forwardedHost ? request.headers.get("x-forwarded-port") || '' : request.nextUrl.port;
  return oryMiddleware(request);
};

thongxuan avatar Jun 10 '25 06:06 thongxuan

@thongxuan are you publishing with docker ?

productdevbook avatar Jul 04 '25 13:07 productdevbook