diff --git a/app/assets/javascripts/jobs/store/actions.js b/app/assets/javascripts/jobs/store/actions.js
index 298367c9342..c8e1090bcc5 100644
--- a/app/assets/javascripts/jobs/store/actions.js
+++ b/app/assets/javascripts/jobs/store/actions.js
@@ -139,7 +139,7 @@ export const fetchStages = ({ state, dispatch }) => {
   dispatch('requestStages');
 
   axios
-    .get(state.job.pipeline.path)
+    .get(`${state.job.pipeline.path}.json`)
     .then(({ data }) => {
       dispatch('receiveStagesSuccess', data.details.stages);
       dispatch('fetchJobsForStage', data.details.stages[0]);
diff --git a/changelogs/unreleased/52472-pipeline-endpoint-json.yml b/changelogs/unreleased/52472-pipeline-endpoint-json.yml
new file mode 100644
index 00000000000..feff195beb8
--- /dev/null
+++ b/changelogs/unreleased/52472-pipeline-endpoint-json.yml
@@ -0,0 +1,5 @@
+---
+title: Fix caching issue with pipelines URL
+merge_request: 22293
+author:
+type: fixed
diff --git a/spec/javascripts/jobs/store/actions_spec.js b/spec/javascripts/jobs/store/actions_spec.js
index 5ab1f75d0d6..ce07effba9e 100644
--- a/spec/javascripts/jobs/store/actions_spec.js
+++ b/spec/javascripts/jobs/store/actions_spec.js
@@ -422,7 +422,7 @@ describe('Job State actions', () => {
 
     beforeEach(() => {
       mockedState.job.pipeline = {
-        path: `${TEST_HOST}/endpoint.json/stages`,
+        path: `${TEST_HOST}/endpoint`,
       };
       mock = new MockAdapter(axios);
     });
@@ -434,7 +434,7 @@ describe('Job State actions', () => {
     describe('success', () => {
       it('dispatches requestStages and receiveStagesSuccess, fetchJobsForStage ', done => {
         mock
-          .onGet(`${TEST_HOST}/endpoint.json/stages`)
+          .onGet(`${TEST_HOST}/endpoint.json`)
           .replyOnce(200, { details: { stages: [{ id: 121212, name: 'build' }] } });
 
         testAction(