Visual Studio Community 2015 : 전자 상거래 기능 추가

이 기사에서는 Visual Studio Community 2015, Bootstrap 및 AngularJS를 사용하여 간단한 전자 상거래 체크 아웃 페이지를 구축하는 것을 보여줍니다. 이 프로세스는 결제 처리를 위해 모의 ASP.NET 웹 API를 통합하여 핵심 전자 상거래 구성 요소를 보여줍니다. 주요 기능 :

원활한 통합 :

Visual Studio 2015 전자 상거래 기능의 쉽게 통합됩니다. 사용자 친화적 인 인터페이스 : 부트 스트랩 및 angularjs는 매끄럽고 반응 형 체크 아웃 경험을 만듭니다. 모의 결제 처리 : 시뮬레이션 된 ASP.NET 웹 API는 JSON 결제 데이터를 처리하여 거래 성공 또는 실패에 대한 피드백을 제공합니다. 실시간 업데이트 : AngularJS는 동적 가격 계산을 활성화하고 트랜잭션 결과를 기반으로 메시지를 표시합니다. 단순화 된 워크 플로 : 전체 체크 아웃 프로세스는 단일 양식 내에서 간소화됩니다.

이 자습서는 시리즈의 이전 기사 (아래 제공된 링크)를 기반으로하며 전자 상거래 기능 추가에 중점을 둡니다. 단일 페이지 체크 아웃은 쇼핑 카트, 지불 정보를 처리하고 성공/실패 메시지를 표시합니다. 결제 세부 정보는 신용 카드 프로세서 역할을하는 모의 ASP.NET 웹 API에 제출되어 게시물 요청을 통해 JSON 데이터를 수신하고 HTTP 상태 코드를 반환합니다. AngularJS는 실시간 업데이트를 처리하고 총계를 계산하고 메시지 표시를합니다 체크 아웃 페이지의 디자인은 스타일을 위해 부트 스트랩을 활용합니다. AngularJS는 제품 총계의 동적 디스플레이를 관리합니다. 제품 선택에서 지불에 이르기까지 완전한 프로세스는 단일 양식 내에 포함됩니다.

(이미지 : 완료된 체크 아웃 페이지의 스크린 샷) ] 구현 세부 사항 : 프로세스에는 새로운 MVC보기 (Checkout.cshtml)와 여러 모델 클래스 (Product.cs, Form.cs, Checkout.cs)가 포함됩니다. 부트 스트랩 스타일이 적용되며 AngularJS는 동적 기능에 사용됩니다. AngularJS Controller (Controller.js)는 제품 수량에 대한 변수를 초기화합니다. 서버 측 코드 (HomeController.cs)는 양식 제출을 처리하고 데이터를 처리하며 Mock Web API와 상호 작용합니다. Web API (ValueController.cs)는 지불 처리를 시뮬레이션하고 성공 또는 실패를 나타내는 HTTP 상태 코드를 반환합니다. (이미지 : 새 MVC보기 페이지 추가) ] (이미지 : Controller.js 파일을 추가) ]

homecontroller의 클래스는 필드를 형성하여 데이터 액세스를 단순화합니다. myForm 클래스는 총 가격을 계산합니다. ProductManager 클래스는 성공/실패 메시지 및 다운로드 코드를 관리합니다. Web API는 JSON SERIALIZATION/DESERIALIZATION에 (NewTonsoft.json Nuget 패키지)를 사용합니다. Checkout (이미지 : newTonsoft.json Nuget 패키지 추가) [] 이 기사는 다음 기사의 요약 및 미리보기로 마무리되며, Cordova를 사용하여 모바일 알림 앱을 만드는 데 중점을 둡니다. (시리즈의 이전 기사에 대한 링크) : JsonConvert Visual Studio Community 2015 : 사이트 설정 Visual Studio Community 2015 : 이메일 및 연락 페이지 추가

(이 기사는 Microsoft가 후원했습니다.)

위 내용은 Visual Studio Community 2015 : 전자 상거래 기능 추가의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!