Laravel + Angular : Angular 페이지 보안

Question

Laravel 세션에 로그인하지 않은 사용자가 AngularJS 페이지를 다운로드하지 못하게하려면 어떻게해야합니까?

나는 백엔드에 Laravel이있는 웹 사이트가 있습니다. 또한 Public/myApp/index.html 폴더에 AngularJS 응용 프로그램이 있습니다. .htaccess는 참조 된 파일을 반환하므로 http://www.example.com/myApp/index.html은 각도 응용 프로그램을 반환하고 js 및 css에 대한 모든 요청은 인증없이 다운로드됩니다.

Larvel 세션으로 인증 된 모든 사용자 하지에 대한 (즉 /을 myApp의 서브 디렉토리) 내 각도 응용 프로그램과 관련된 모든 JS, HTML 및 CSS 파일의 다운로드를 방지하는 가장 좋은 방법은 무엇입니까?

Answer 1

이러한 옵션 중 실제로 내가 찾던 것을 해결하지 못했습니다. 내가 결국 한 일은 다음과 같다. 저는 수십만 줄의 코드와 수백 개의 다른 파일로 제 3 자 Angular 프론트 엔드 템플릿 (The Angler from ThemeForest)을 사용하고 있습니다. 이러한 파일의 대부분은 스타일 시트와 일반 JavaScript 라이브러리 (Angular, JQuery 등)입니다. 해당 내용을 공용 폴더에 넣고 인증되지 않은 사용자에게 파일을 제공하는 것은 신경 쓰지 않습니다.

그러나 내 파일의 다른 부분은 수정 된 파일입니다. 예를 들어, 하나의 파일에는 내 독점 비즈니스 시스템의 전체 형식을 거의 레이아웃하는 내비게이션 요소가 있으며 비즈니스의 내부 운영에 대해 많이 말합니다. 따라서 탐색 HTML, CSS 및 js와 같은 간단한 것은 민감하므로 인증 된 사용자에게만 제공해야합니다.

내가 한 것은 공개 및 보호 된 콘텐츠를/public/*에있는 디렉토리 트리와/storage/app/*에있는 디렉토리 트리 (동일한 디렉토리 또는 유사한 디렉토리)로 분할 한 것입니다. 중요하지 않은 모든 컨텐츠 (대부분 템플릿 스타일 시트와 일반 JS 라이브러리)는 "공용"트리에 들어가고 민감한 컨텐츠는 내 "스토리지/응용 프로그램"트리에 저장됩니다. 그래서 예를 들면 :

# If the file exists in laravel/public and the URI does not specify ".php" then go get it. 
RewriteCond %{DOCUMENT_ROOT}/laravel/public/%{REQUEST_URI} -f 
RewriteCond %{REQUEST_URI} !^.*\.php$ 
RewriteRule ^(.*)$ laravel/public/$1 [L] 

: htaccess로에서

- public --- js ----- someThirdPartyJavaScript.js ----- loginController.js (unprotected) ----- ... --- libs ----- angular.js ----- jquery.js ----- ... --- css ----- unprotectedStyleSheet.css ----- ... --- tpl ----- loginTemplate.html - storage (all protected content goes in this tree) --- app ----- js ------- myApp.js ------- directives --------- myCustomDirective.js --------- businessNavigationDirective.js (sensitive and proprietary) ----- css (for protected css files) ----- libs (for protected libs) ----- tpl (for protected .html files) ------- clientInformationSheet.html (sensitive content indicating the structure of our customer data)

, 나는 기본적으로 공공 트리에 존재하는 모든 파일을 반환하는 다음과 같은 규칙을 사용했다.htaccess는 다른 모든 요청을 Laravel index.php에서 처리하도록 보냅니다.

그런 다음 Laravel 5.2 경로를 만들어 내 Angular app 내의 경로를 모두 잡았습니다. 이러한 파일 저장 디렉토리에서 사용자에게 반환되지 않도록 사용자가 인증하지 않는 한 미들웨어 인증을 지정하는주의 :

use League\Flysystem\Util\MimeType as MimeType; 

Route::any('/{any}', ['middleware' => 'auth', function($uri){ 
    // Auth::logout(); 
    $uri = storage_path('app/' . $uri); 

    if (!File::exists($uri)){ 
     return "Path not found."; 
    } 

    $extension = File::extension($uri); 

    if (array_key_exists($extension, MimeType::getExtensionToMimeTypeMap())){ 
     $mimeType = MimeType::getExtensionToMimeTypeMap()[$extension]; 
    } else { 
     $mimeType = "text/plain"; 
    } 

    return response(File::get($uri)) 
     ->header('Content-Type', $mimeType); 

}])->where('any', '^MySuperCoolApplicationSubDirectory/.*'); 

유지 디렉토리 구조를 "공개"와 "저장/응용 프로그램"과 매우 유사한 그것을 만든 이번에는 인증되지 않은 사용자로부터 모든 민감한 콘텐츠가 차단되어 어떤 파일이 민감하고 어떤 파일이 아닌지를 쉽게 체계화 할 수 있었으며 응용 프로그램은 이전과 같이 계속 작동했습니다.

Answer 2

나는이 문제를 종종 접했을뿐 아니라 구현하기 쉽고 완벽하게 안전한 솔루션을 발견했습니다.

은 당신과 같이 Laravel에 AngularJS와를 통해 모든 '안전한'템플릿을로드하는 경로를 정의 할 수 있습니다 :

Route::get('/templates/secured/{name}', function ($name) { 
    if(Auth::check()) 
    return view('templates.' . $name); 
    else 
    return '404'; 
}); 

당신이 정말로 인증 후 정적 파일을 제공해야합니다. 작은 해킹이 있습니다 .... 정적 JS 및 CSS 코드를 .php 파일에 작성하고 '템플릿/자산 /'내에 저장할 수 있습니다.

위에서 설명한 것과 같은 방법을 사용할 수 있습니다. 많은 속도를 저하시키지 않습니다. 그리고 css 및 js에 대한 모든 구문 색칠 및 들여 쓰기는 PHP 파일 내에서 작동합니다.

Answer 3

클라이언트와 서버간에 jwt (json 웹 토큰)를 전달할 수 있습니다. 사용자가 로그인 한 경우 jwt는 laravel 백엔드에 API 요청을 보내기 전에도 저장되므로 각도는 jwt 페이로드가 없어도 authed 사용자가 아닌 것을 감지 할 수 있습니다. 나는 laravel에서 jwt를 처리하기 위해 tymondesigns/jwt-auth을 사용하고 laravel에서 전달 된 jwt 토큰을 저장하는 사용자 인증을 처리하는 각도에는 satellizer을 사용합니다.