Admin component: when api has a prefix, then iris from entities leads to 404 because it adds the prefix to the iris whereas it's useless · Issue #584 · api-platform/api-platform · GitHub
Skip to content

Admin component: when api has a prefix, then iris from entities leads to 404 because it adds the prefix to the iris whereas it's useless #584

Closed

Description

@Rebolon

I installed the admin component base on "admin on rest" from marmelab.

My api uri is http://myHost/api. So when i retreive an entity, all its properties that rely on sub-entities on this model: /api/myEntity/:id

In the App.js i specified the entrypoint to the API so i get this:

import React, { Component } from 'react'
import { HydraAdmin, hydraClient, fetchHydra } from '@api-platform/admin'
import { authClient, initToken } from './authClient'
import { host, apiPlatformPrefix } from '../lib/config'

const entrypoint = `//${host}${apiPlatformPrefix}`

const fetchWithAuth = (url, options = {}) => {
    if (!options.headers) options.headers = new Headers({ Accept: 'application/ld+json' });

    options.credentials = 'same-origin'

    return fetchHydra(url, options);
};

const restClient = (api) => (hydraClient(api, fetchWithAuth));

export default class extends Component {
    componentWillMount() {
        initToken()
    }

    render() {
        return <HydraAdmin entrypoint={entrypoint} restClient={restClient} authClient={authClient}/>
    }
}

But now when i open a browser on the admin component, then it tries to open that kind of uri /api/api/oneEntity/:id instead of /api/oneEntity/:id. This is because the API return /api/oneEntity/:id and the admin component add the entrypoint...
If i don't set the valid entrypoint, then the admin component cannot discover the API, so i have a problem.

Thanks for help

Activity

  1. Rebolon commented on Feb 23, 2018

    @Rebolon
    Author

    For instance i solved this with a replace but i'm not really happy with this:

    const fetchWithAuth = (url, options = {}) => {
        if (!options.headers) options.headers = new Headers({ Accept: 'application/ld+json' });
    
        options.credentials = 'same-origin'
    
        // fix https://github.com/api-platform/api-platform/issues/584
        if (apiPlatformPrefix) {
            url = url.replace(`${apiPlatformPrefix}${apiPlatformPrefix}/`, `${apiPlatformPrefix}/`)
        }
    
        return fetchHydra(url, options);
    };
    
  2. Simperfit commented on Apr 9, 2018

    @Simperfit
    Contributor

    Do you still have an issue ?

  3. Rebolon commented on Apr 9, 2018

    @Rebolon
    Author

    @Simperfit which version should fix this ?

  4. Simperfit commented on Apr 9, 2018

    @Simperfit
    Contributor

    The lastest version still contains this bug ?

  5. Rebolon commented on Apr 9, 2018

    @Rebolon
    Author

    i will check soon

  6. Rebolon commented on Apr 10, 2018

    @Rebolon
    Author

    Nope i have the same results.
    Here is the root url: localhost:85/demo/my-admin-react
    Here is the stack of api call:

    And then all 404 http errors for next calls:

    Look at the /api/api in those uris

  7. benjvfr commented on Jun 27, 2018

    @benjvfr

    Hello, same problem here with latest version of API Platform and the React Admin Component.

    I have my Symfony 4.1.1 with API Platform on https://hello.local/api (entrypoint) and the react admin on localhost:3000.

    For the entrypoint I have :
    export default () => <HydraAdmin entrypoint="https://hello.local/api"/>;

    It works on initialisation, but when I want to edit an entity, it fetch 'https://hello.local/api/api/myentity/1".

    Do you have a solution to fix that ?

    Thanks.

  8. bricejulia commented on Jul 25, 2018

    @bricejulia

    For those who might be interested, an updated version of the hotfix could be:

    import React from 'react';
    import { HydraAdmin, hydraClient, fetchHydra } from '@api-platform/admin';
    
    const apiPrefix = '/your-api-prefix';
    
    const customFetch = (url, options = {}) => {
        // fix https://github.com/api-platform/api-platform/issues/584
        url = url.replace(`${apiPrefix}${apiPrefix}/`, `${apiPrefix}/`);
        return fetchHydra(url, options);
    };
    
    export default () => (
        <HydraAdmin
            entrypoint="http://your.entrypoint/your-api-prefix"
            dataProvider={api => hydraClient(api, customFetch)}
        />
    );
    
    
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions