2017-10-11 5 views
0

나는 반응/PHP 프로젝트 (아파치에서 실행 됨)를 만들어서 react-app와 Express.js/live reloading 등 (개발 용) .create-react-app를 생성하고 PHP를 통해 이미지를 동적으로로드하는 중

사용자가 업로드 한 이미지가 있으며로드 할 파일의 이름을 쿼리 문자열로 허용하는 PHP 파일을 통해 문서 루트 외부에 저장됩니다.

file.php?image=file_name.png 

과 상대의 반응 구성 요소가

const Img = (props) => { 

    const findFile =() => { 
     // base64 
     if(props.file && props.file.startsWith('data:image/')){ 
      return props.file; 
     } 

     return "file.php?name=" + props.file + "&type=" + props.type; 
    }; 

    return (
     <img src={findFile()} alt={props.alt || props.file}/> 
    ); 

}; 

만들-반응-응용 프로그램에 마이그레이션 한 후이다는, 나는 package.json

"proxy":"http://localhost" 

에 있지만,이 방법으로 프록시를 추가 이미지는 사용자가 대시 보드 페이지에있을 때만로드됩니다. 다른 페이지에서는 file.php의 경로를 변경하기 때문에 이미지가 작동하지 않습니다. 대시 보드에서

(HTTP :/로컬 호스트/인증)을 다른 페이지에서

127.0.0.1 - - [10/Oct/2017:23:59:12 +0200] "GET /file.php?name=avatar4.png&type=avatarDefaultDir HTTP/1.1" 200 12295 

(예 : http://localhost/auth/profile)

127.0.0.1 - - [10/Oct/2017:23:59:17 +0200] "GET /auth/file.php?name=avatar4.png&type=avatarDefaultDir HTTP/1.1" 200 27 

어떻게 내가 할 수있는이 문제를 해결하려면?

+0

절대 URL을 사용하십시오 – madalinivascu

답변

0

당신은 file.php 파일에 올바른 경로를 사용하고

return "file.php?name=" + props.file + "&type=" + props.type; 

사용의

대신 file.php에

return "/file.php?name=" + props.file + "&type=" + props.type; 

이 가정됩니다 절대 경로를 사용해야합니다 file.php가 프로젝트의 루트에 있음