Yarp Configuration with multiple web applications

1.7k Views Asked by At

I have 2 web (not api, let's assume razor) applications. I'm trying to put them behind Yarp reverse proxy.

Here's my config:

 "Yarp": {
"Routes": {
  "web-route1": {
    "ClusterId": "web-cluster1",
    "Match": {
      "Path": "/web1/{**catch-all}"
    },
    "Transforms": [
      { "PathPrefix": "/web1" }
    ]
  },
  "web-route2": {
    "ClusterId": "web-cluster2",
    "Match": {
      "Path": "/web2/{**catch-all}"
    },
    "Transforms": [
      { "PathPrefix": "/web2" }
    ]
  }
},
"Clusters": {
  "web-cluster1": {
    "Destinations": {
      "destination1": {
        "Address": "http://localhost:5135/"
      }
    }
  },
  "web-cluster2": {
    "Destinations": {
      "destination1": {
        "Address": "http://localhost:5022/"
      }
    }
  }

}

Let's say Yarp app sits at http://localhost:5000. The goal is to have apps respond at http: http://localhost:5000/web1 and http://localhost:5000/web2 correspondingly.

Needless to say it doesn't work. Anyone had successful experience?

I tried PathRemovePrefix which works for a single app but it obviously removes the crucial prefix.

2

There are 2 best solutions below

2
On

Change this

"Transforms": [
  { "PathPrefix": "/web2" }
]

TO

"Transforms": [
  { "PathPrefix": "{**catch-all}" }
]
0
On

You need to change the { "PathPrefix": "/web1" } to { "PathRemovePrefix": "/web1" }

{
  "Routes": {
    "web-route1": {
      "ClusterId": "web-cluster1",
      "Match": {
        "Path": "/web1/{**catch-all}"
      },
      "Transforms": [
        { "PathRemovePrefix": "/web1" }
      ]
    },
    "web-route2": {
      "ClusterId": "web-cluster2",
      "Match": {
        "Path": "/web2/{**catch-all}"
      },
      "Transforms": [
        { "PathRemovePrefix": "/web2" }
      ]
    }
  },
  "Clusters": {
    "web-cluster1": {
      "Destinations": {
        "destination1": {
          "Address": "http://localhost:5135/"
        }
      }
    },
    "web-cluster2": {
      "Destinations": {
        "destination1": {
          "Address": "http://localhost:5022/"
        }
      }
    }
  }
}