찾다
웹 프론트엔드JS 튜토리얼Angularjs에서 페이지 액세스 권한을 설정하는 방법

이전 프로젝트에서 프런트엔드와 백엔드 간의 일반적인 협력 방식은 프런트엔드가 약간의 DuangDuangDuang 효과가 있는 페이지와 UI를 제공하고 백엔드가 프레임워크 데이터 구조와 데이터 상호작용(데이터 상호작용이 있음)을 구축하는 것이었습니다. .net이든 Java이든 PHP이든 일대다 프런트엔드 서비스를 제공할 수 있지만 새 형식에서는 프로젝트에서 프런트엔드 프레임워크가 사용됩니다. 예를 들어 제가 말하고 싶은 것은 이 개발은 Angle 프레임워크 하에서 완료되며, 프론트엔드는 서비스와 API 문서, 페이지와 데이터 상호 작용 및 논리적 처리를 제공한다는 것입니다. 프론트엔드는 완전한 프로그래머와 같습니다. 이 과정에서 페이지 권한 제어와 같은 이전에 예상치 못한 문제(백엔드 개발을 수행하지 않은 경우)에 직면하게 됩니다. 즉, 이러한 설정을 수행하기 위해 프런트 엔드 방법을 사용하는 것이 더 복잡합니다. 왜냐하면 이 데이터, 즉 이러한 권한의 '표시'는 백엔드가 실행 중일 때 직접 얻을 수 있기 때문입니다. field data point a.b 바로 나왔는데 프런트엔드에서는 http 요청을 통해서만 얻을 수 있어서 번거롭고 번거롭습니다.

사실 ng에서 페이지 접근 권한을 얻는 방법은 여러가지가 있습니다. 자체적인 장단점이 있으며 인터셉터가 더 일반적으로 사용되지만, 인터셉터를 사용하면 프런트 엔드가 백 엔드에 http 요청을 보내기 전이나 후에 일부 작업(예: 사용자 로그인 여부)을 전역적으로 모니터링할 수 있습니다. 로그인하지 않은 경우 점프하고 로그인 후 페이지에 액세스할 수 있는 로그인 페이지는 종종 배경 데이터와 조정됩니다. 즉, 이 페이지에서 수행할 작업을 결정하기 위해 최신 '마크'를 가져옵니다. 또는 다음 페이지에서는 데이터 상호 작용 없이 프런트 엔드 제어 방법을 사용합니다. 아이디어는 다양한 수준/단계를 정의하는 것입니다. 액세스할 수 있는 페이지는 여러 수준에서 명확하게 정의된 액세스 권한에 대해 차단됩니다. /stages에서 이 메소드를 참고할 수 있습니다.

......
app.run(['$rootScope', '$state', '$window', function($rootScope, $state, $window) {
$rootScope.$on('$stateChangeStart', function(event, toState, toStateParams) {
//用户访问等级阶段, 0 1 2
Array.prototype.contains = function(needle) {
for(i in this) {
if(this[i] == needle) return true;
}
return false;
}
var status=new Array("user.a","user.b","user.c","user.d","user.e","user.f","user.g");
var status0=new Array("user.a","user.b");
var status1=new Array("user.c","user.d");
var status2=new Array("user.a","user.b","user.c","user.d");
     if (status.contains(toState.name)) {
       if(initObj.getStatus()=="0"){
if(!status0.contains(toState.name)){
event.preventDefault();
$state.go('user.approve');
}
return;
}
if(initObj.getStatus()=="1"){
if(!status1.contains(toState.name)){
event.preventDefault();
$state.go('user.result');
}
return;
}
if(initObj.getStatus()=="2"){
if(!status2.contains(toState.name)){
event.preventDefault();
$state.go('user.result');
}
return;
}
}
})
}])
......

코드에 표시된 대로 ng의 실행에 상태 모니터링을 추가합니다( 여기서는 an-route-ui를 사용합니다. 경로 점프가 감지되면 여기에서 '표시'에 액세스할 수 있습니다. 예를 들어 상태에는 각 레벨/단계에서 액세스할 수 있는 페이지/경로가 포함되어 있습니다. 감지해야 하는 전체 집합입니다. status0, 1 및 2는 서로 다른 수준/단계의 권한 액세스 집합입니다. 즉, 해시 값은 이 감지 방법을 사용하여 액세스할 수 없는 사용자를 나타냅니다. 예를 들어, user.c 및 user.d를 포함하여 사용자 a의 계층적 단계 구성은 status1입니다. initObj.getStatus()는 그의 상태 코드가 1임을 반환했습니다. 페이지에서 그는 initObj.getStatus()=="1"이라는 판단을 내리지만 그가 구성한 액세스 가능한 페이지는 user.a를 포함하지 않습니다. 즉, status1.contains(toState.name)(toState.name은 페이지를 다음으로 반환합니다!) 점프하면 user.a)가 반환되고 다음 작업을 입력하고 공개 페이지 또는 프롬프트 페이지에 들어가십시오. 원칙은 기본입니다.

물론 이 방법은 매우 안전하지 않으며 측면에서 엄격하지도 않습니다. 백엔드 제어의 경우 프로젝트의 스크립트가 릴리스되고 압축되고 난독화되더라도 주의 깊게 탐색하면 여기에서 찾을 수 있기 때문입니다. 추적이 설정되고 실행 전에 스크립트를 편집할 수 있으므로 큰 허점이 발생합니다. 그러나 일부 소규모 프로젝트에서는 이러한 구성을 사용하는 것으로 충분하며 누군가 상태 구성을 수정하더라도 데이터와 모든 것이 백엔드에서 요청되는 경우 상태가 올바르지 않으면 데이터를 요청할 수 없으며, 따라서 데이터베이스를 손상시키는 것은 실제 해킹으로 간주됩니다. 프론트 엔드 스크립트를 가로채는 것은 단지 재미와 테스트를 위한 것입니다.

계속해서 다른 최적화 방법을 탐색해 보세요. ; 먼저 여기로 가보겠습니다.


성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
2022年最新5款的angularjs教程从入门到精通2022年最新5款的angularjs教程从入门到精通Jun 15, 2017 pm 05:50 PM

Javascript 是一个非常有个性的语言. 无论是从代码的组织, 还是代码的编程范式, 还是面向对象理论都独具一格. 而很早就在争论的Javascript 是不是面向对象语言这个问题, 显然已有答案. 但是, 即使 Javascript 叱咤风云二十年, 如果想要看懂 jQuery, Angularjs, 甚至是 React 等流行框架, 观看《黑马云课堂JavaScript 高级框架设计视频教程》就对了。

使用PHP和AngularJS搭建一个响应式网站,提供优质的用户体验使用PHP和AngularJS搭建一个响应式网站,提供优质的用户体验Jun 27, 2023 pm 07:37 PM

在如今信息时代,网站已经成为人们获取信息和交流的重要工具。一个响应式的网站能够适应各种设备,为用户提供优质的体验,成为了现代网站开发的热点。本篇文章将介绍如何使用PHP和AngularJS搭建一个响应式网站,从而提供优质的用户体验。PHP介绍PHP是一种开源的服务器端编程语言,非常适用于Web开发。PHP具有很多优点,如易于学习、跨平台、丰富的工具库、开发效

使用PHP和AngularJS构建Web应用使用PHP和AngularJS构建Web应用May 27, 2023 pm 08:10 PM

随着互联网的不断发展,Web应用已成为企业信息化建设的重要组成部分,也是现代化工作的必要手段。为了使Web应用能够便于开发、维护和扩展,开发人员需要选择适合自己开发需求的技术框架和编程语言。PHP和AngularJS是两种非常流行的Web开发技术,它们分别是服务器端和客户端的解决方案,通过结合使用可以大大提高Web应用的开发效率和使用体验。PHP的优势PHP

使用PHP和AngularJS开发一个在线文件管理平台,方便文件管理使用PHP和AngularJS开发一个在线文件管理平台,方便文件管理Jun 27, 2023 pm 01:34 PM

随着互联网的普及,越来越多的人在使用网络进行文件传输和共享。然而,由于各种原因,使用传统的FTP等方式进行文件管理无法满足现代用户的需求。因此,建立一个易用、高效、安全的在线文件管理平台已成为了一种趋势。本文介绍的在线文件管理平台,基于PHP和AngularJS,能够方便地进行文件上传、下载、编辑、删除等操作,并且提供了一系列强大的功能,例如文件共享、搜索、

如何使用PHP和AngularJS进行前端开发如何使用PHP和AngularJS进行前端开发May 11, 2023 pm 05:18 PM

随着互联网的普及和发展,前端开发已变得越来越重要。作为前端开发人员,我们需要了解并掌握各种开发工具和技术。其中,PHP和AngularJS是两种非常有用和流行的工具。在本文中,我们将介绍如何使用这两种工具进行前端开发。一、PHP介绍PHP是一种流行的开源服务器端脚本语言,它适用于Web开发,可以在Web服务器和各种操作系统上运行。PHP的优点是简单、快速、便

如何在PHP编程中使用AngularJS?如何在PHP编程中使用AngularJS?Jun 12, 2023 am 09:40 AM

随着Web应用程序的普及,前端框架AngularJS变得越来越受欢迎。AngularJS是一个由Google开发的JavaScript框架,它可以帮助你构建具有动态Web应用程序功能的Web应用程序。另一方面,对于后端编程,PHP是非常受欢迎的编程语言。如果您正在使用PHP进行服务器端编程,那么结合AngularJS使用PHP将可以为您的网站带来更多的动态效

使用Flask和AngularJS构建单页Web应用程序使用Flask和AngularJS构建单页Web应用程序Jun 17, 2023 am 08:49 AM

随着Web技术的飞速发展,单页Web应用程序(SinglePageApplication,SPA)已经成为一种越来越流行的Web应用程序模型。相比于传统的多页Web应用程序,SPA的最大优势在于用户感受更加流畅,同时服务器端的计算压力也大幅减少。在本文中,我们将介绍如何使用Flask和AngularJS构建一个简单的SPA。Flask是一款轻量级的Py

AngularJS基础入门介绍AngularJS基础入门介绍Apr 21, 2018 am 10:37 AM

这篇文章介绍的内容是关于AngularJS基础入门介绍,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下。

See all articles

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

뜨거운 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

Eclipse용 SAP NetWeaver 서버 어댑터

Eclipse용 SAP NetWeaver 서버 어댑터

Eclipse를 SAP NetWeaver 애플리케이션 서버와 통합합니다.

Atom Editor Mac 버전 다운로드

Atom Editor Mac 버전 다운로드

가장 인기 있는 오픈 소스 편집기

mPDF

mPDF

mPDF는 UTF-8로 인코딩된 HTML에서 PDF 파일을 생성할 수 있는 PHP 라이브러리입니다. 원저자인 Ian Back은 자신의 웹 사이트에서 "즉시" PDF 파일을 출력하고 다양한 언어를 처리하기 위해 mPDF를 작성했습니다. HTML2FPDF와 같은 원본 스크립트보다 유니코드 글꼴을 사용할 때 속도가 느리고 더 큰 파일을 생성하지만 CSS 스타일 등을 지원하고 많은 개선 사항이 있습니다. RTL(아랍어, 히브리어), CJK(중국어, 일본어, 한국어)를 포함한 거의 모든 언어를 지원합니다. 중첩된 블록 수준 요소(예: P, DIV)를 지원합니다.

SecList

SecList

SecLists는 최고의 보안 테스터의 동반자입니다. 보안 평가 시 자주 사용되는 다양한 유형의 목록을 한 곳에 모아 놓은 것입니다. SecLists는 보안 테스터에게 필요할 수 있는 모든 목록을 편리하게 제공하여 보안 테스트를 더욱 효율적이고 생산적으로 만드는 데 도움이 됩니다. 목록 유형에는 사용자 이름, 비밀번호, URL, 퍼징 페이로드, 민감한 데이터 패턴, 웹 셸 등이 포함됩니다. 테스터는 이 저장소를 새로운 테스트 시스템으로 간단히 가져올 수 있으며 필요한 모든 유형의 목록에 액세스할 수 있습니다.