Get url in asp.net

string url = HttpContext.Current.Request.Url.AbsoluteUri;
// http://localhost:1302/TESTERS/Default6.aspx

string path = HttpContext.Current.Request.Url.AbsolutePath;
// /TESTERS/Default6.aspx

string host = HttpContext.Current.Request.Url.Host;
// localhost

string url = Request.Url.Host;
Posted by 철냄비짱
,

ASP.NET MVC 프로젝트 일때

태그값 저장 시 잠재적 위험 Request.Form 값을 발견했습니다. 오류시,

 

web.config

 

에서

 

<pages validateRequest="false">

<httpRuntime requestValidationMode="2.0" /> 추가

 

 

MVC 프로젝트 일 경우 추가로

해당 메소드에

 

[ValidateInput(false)]

추가 해줘야 함

Posted by 철냄비짱
,

  

 

 

CKEditor™ 는 웹에디터의 대명사인 FCKeditor 2.x의 후속버전으로 3.x로 버전업하면서

기본 코어자체를 바꾼것 때문인지 CKEditor로 이름이 바뀌었다.

 

웹표준과 크로스브라우징, 웹접근성까지 갖추고 다양한 플러그인으로 무장하여 재 탄생된 CKEditor는

막강한 기능과 편리한 설치 및 사용성 때문에 좋은 평가를 받고 있다.

 

기본적으로 PHP에 설치하기 쉽도록 되어 있어서 PHP에 설치하는 방법은 많이 돌아다니는데,

닷넷웹어플리케이션이나 자바웹어플리케이션에 설치하는 방법은 아직까지는 찾기가 어려워 직접 설치하면서 설치 방법을 정리한다.

 

CKEditor는 기존 FCKeditor에서와는 다르게 엔진 자체에 첨부파일업로드 기능을 지원하지 않는다.

때문에 설치는 어떤 웹환경이건 순수 자바스크립트만으로 동일하게 설치가 가능하다.

 

이미지나 기타 파일들의 업로드 기능을 갖추기 위해서는 CKFinder™ 를 같이 설치하여 연동해 주면

FCKeditor 처럼 자체 업로드 기능이 활성화 된다.

 

복잡할 것 같지만 생각보다 간단하다.

 

아래 내용을 차근차근 참고해 보길 바란다.

 

 

   

 

 

1. 우선 CKEditor와 CKFinder를 다운로드 한다. (CKFinder는 ASP.NET용으로 받는다)

 

CKEditor 다운로드

 

CKFinder 다운로드

 

 

2. 각각 압축을 풀고 생성된 ckeditor 폴더와 ckfinder 폴더를 웹사이트 프로젝트에 추가한다.

사이트의 최상위 루트 또는 위치시키고자하는 하위 폴더에 옮기면 된다.

 

/wwwroot 가 최상위 루트라고 가정할 경우, 아래처럼 폴더구조를 구성한다.

 

/wwwroot

   └ ckeditor

   └ ckfinder

 

또는

 

/wwwroot

   └ board

      └ ckeditor

      └ ckfinider

 

 

3. 게시판 글쓰기에 ckeditor를 추가한다고 가정하고 두번째 구성으로 예를 들겠다.

   이후 예제 소스는..

       /board/ 폴더 하위에 설치한다고 가정함.

       /data/ 폴더에 업로드 파일을 저장한다고 가정함.

       /board/write.aspx 파일에 결합한다고 가정함.

       <textarea>의 name은 'contents'로 가정함.

 

 

CKEditor를 적용하려는 /board/write.aspx 파일의 소스에서

 

<script type="text/javascript" src="/board/ckeditor/ckeditor.js"></script>

를 추가하고,

 

 

4. 에디터를 사용할 부분에 아래 내용을 추가한다.

(textarea의 id가 'contents'인 서버컨트롤일 경우의 예)

 

<textarea id="contents" runat="server"></textarea>
<script type="text/javascript">

  CKEDITOR.config.width = '99%';
  CKEDITOR.config.height = 300;

  CKEDITOR.replace('<%= contents.ClientID %>'
);
</script>

 

여기까지 진행하고 write.aspx를 호출하면 ckeditor가 적용된걸 확인할 수 있다.

 

 

5. CKFinder를 추가해야 첨부파일 업로드 기능을 사용할 수 있으므로 아래의 추가 작업을 진행한다.

 

 5-1. /ckfinder/bin/Release/ 폴더에 있는 CKFinder.dll 파일을 프로젝트의 Bin 폴더로 이동시킨다.

 

 5-2. /ckfinder/ 폴더의 /_source/ 폴더와 /bin/ 폴더를 삭제한다.

      (삭제하지 않으면 /Bin/CKFinder.dll 파일과 충돌하는 문제가 생길수 있다)

 

 5-3. 파일이 업로드될 폴더를 생성하고 IUSER_서버명 사용자에 쓰기권한을 부여한다.

      예를 들어 사이트 루트디렉토리 /data 폴더에 첨부파일등을 몰아서 사용중일 경우 아래 처럼 생성하면 된다.

      /wwwroot

         └ data

            └ ckfinder

 

 5-4. /ckfinder/config.ascx 소스에서 오버라이드된 SetConfig() 메서드의 BaseUrl 변수의 값을 위에 생성한 폴더로 지정한다.

      예제는 /data/ckfinder/ 에 사용할것이므로 아래처럼 수정하였다.

      BaseUrl = "/data/ckfinder/";

 

 5-5. /ckfinder/config.ascx 소스에서 CheckAuthentication() 메서드의 return 값을 true로 수정한다.

 

 5-6. write.aspx 소스에서 에디터를 추가했던 자바스크립트 코드에 아래와 같이 코드를 추가한다.

 

<script type="text/javascript">

  CKEDITOR.replace('<%= contents.ClientID %>', {
    toolbar: 'Full',
    uiColor: '#eaebe7',
    filebrowserBrowseUrl: '/board/ckfinder/ckfinder.html',
    filebrowserImageBrowseUrl: '/board/ckfinder/ckfinder.html?type=Images',
    filebrowserFlashBrowseUrl: '/board/ckfinder/ckfinder.html?type=Flash',
    filebrowserUploadUrl: '/board/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Files',
    filebrowserImageUploadUrl: '/board/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Images',
    filebrowserFlashUploadUrl: '/board/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Flash'
  });

</script>

 

 5-7. 여기까지 하고나면 CKEditor의 이미지 추가 부분에 자체 업로드가 가능해진다.

 

 

6. CKEditor의 색상과 크기, 툴바 등이 맘에 들지 않는다면 아래 소스를 참고하여 이것저것 수정하면 된다.

 

<script type="text/javascript">

CKEDITOR.config.width = '850px';
CKEDITOR.config.height = '400px';

CKEDITOR.config.toolbar_User =
  [
    ['Source', 'Maximize', 'Preview'],
    ['Bold', 'Italic', 'Underline', 'Strike', '-', 'Subscript', 'Superscript'],
    ['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent'],
    ['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock', '-', 'Find', 'Replace'],
    '/',
    ['Undo', 'Redo'],
    ['Font', 'FontSize'],
    ['TextColor', 'BGColor', 'Link'],
    ['Image', 'Table', 'CreateDiv', 'HorizontalRule', 'SpecialChar', 'PageBreak', 'Templates', 'Smiley', '-', 'About']
  ];

 

CKEDITOR.replace('<%= contents.ClientID %>', {
  skin: 'kama', //에디터 스킨 (kama, office2003, v2)
  toolbar: 'User', //사용자 정의 툴바 (기본 :Full, Basic)
  uiColor: '#9ab8f3', //에디터 전체 색상 (#RGB)
  enterMode: '2', //엔터키 태그 1:<p>, 2:<br>, 3:<div>
  shiftEnterMode: '1', //쉬프트+엔터키 태그 1:<p>, 2:<br>, 3:<div>
  //filebrowserBrowseUrl: '/board/ckfinder/ckfinder.html', //'서버보기'를 사용하지 않을 경우 주석처리
  //filebrowserImageBrowseUrl: '/board/ckfinder/ckfinder.html?type=Images', //'서버보기'를 사용하지 않을 경우 주석처리
  //filebrowserFlashBrowseUrl: '/board/ckfinder/ckfinder.html?type=Flash', //'서버보기'를 사용하지 않을 경우 주석처리

  filebrowserUploadUrl: '/board/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Files',
  filebrowserImageUploadUrl: '/board/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Images',
  filebrowserFlashUploadUrl: '/board/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Flash'
});

</script>

 

 

7. 내용을 입력했는지 체크하려면 아래와 같이 접근한다.

 

<script type="text/javascript">

  function checkEditorValue() {

    if (CKEDITOR.instances.<%= contents.ClientID %>.getData() == '') {

      window.alert('내용을 입력해 주세요.');

      CKEDITOR.instances.<%= contents.ClientID %>.focus();

    }

  }

</script>

 

 

더 자세한 세팅은 아래 ckeditor documentation 사이트를 참고하길 바란다.

 

CKEditor API문서(영문) : http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html

 

 


원본-참조 : http://nimba.tistory.com/353


Posted by 철냄비짱
,

[개인적으로 많이 사용하는 단축키는 파란색 Bold]

 

F4 : 속성창

 

F7 : (aspx, ascx) cs 소스 화면   /   Shift + F7 : (aspx, ascx) 디자인 화면

F12 : 함수 정의된 모듈로 이동  

Alt + W L : 모든 창 닫기

 

Ctrl + F : 빠른 찾기   /   Ctrl + Shift + F : 문자 파일에서 찾기

Ctrl + F3 : 한번 검색된 단어 기준으로 문자 바로 찾기


Ctrl + H : 빠른 바꾸기   /   Ctrl + Shift + H : 문자 파일에서 바꾸기

Ctrl + L : 줄 삭제
Ctrl + M L : 전체 확장 / 숨김 변경
Ctrl + M M : + - 확장 숨김 요소 변경

Ctrl + U : 소문자로 바꾸기   /   Ctrl + Shift + U : 대문자로 바꾸기

Ctrl + Shift + R : 매크로 레코드

Ctrl + Space : 커서 시점에서 멤버, 메소드, 객체등 접근가능한 객체 인텔리전스 

Ctrl + Tab : 내부 문서간 이동

Ctrl + F4 : 현재 문서 닫기

Ctrl + PageDown : (aspx, ascx) 디자인 Html 소스 화면 전환

Alt + Shift + Enter : 전체화면 토글

Ctrl + K C : 여러 줄 주석

Ctrl + K U : 여러 줄 주석 해제

Alt + Shift + 방향키(or드래그) : 소스 사각형으로 선택하기

Ctrl + Alt + L  : 솔루션 탐색기

Ctrl + Shift + C : 클래스 탐색기

Ctrl + . : using 추가 (namespace)

Ctrl + K X : 코드 삽입 (if , try , ctor 등)

Ctrl + K S : 코드 감싸기(if, try, region 등)

Ctrl +  ( + - ) : 커서 히스토리 이동

Ctrl + Alt + O : 출력창(빌드결과)

Ctrl + Alt + X : 도구상자

Ctrl + Alt + K : 작업목록 창보기
Ctrl + ] : 괄호 짝 찾기


<빌드 & 디버깅>

Ctrl + Shift + F9 : 모든 중단점 제거.

Ctrl + F5 : 디버깅하지 않고 실행.

Shift + F5 : 디버깅 중단

Shift + F6 : 프로젝트 빌드

Ctrl + Shift + B : 솔루션 빌드.

Ctrl + shift + F5 : 디버깅 중일때 다시 시작.

Posted by 철냄비짱
,
모든 Controller는 IController interface를 구현한다.

* Mvc.Controller의 특징
1. ActionMethods
  : Controller의 동작이 여러개의 method로 분할된다. 각 Action method는 서로다른 URL로 노출되며,
  들어오는 요청에서 추출된 매개변수를 가지고 있다.
2. ActionResult
  : Action의 의도된 결과를 나타내는 개체를 선택해서 반환할 수 있다. 결과를 지정하는 것과 실행하는
  것이 분리되기 때문에 자동화된 테스트가 상당히 간단하게 구성될 수 있다.
3. Filter
  : 재사용 가능한 동작들을 Filter로 캡슐화할 수 있다.

* Controller의 입력 처리
Mvc.Controller에서 사용 가능한 속성들
1. Request.QueryString : 요청과 함께 전송된 GET 변수들
2. Request.Form : 요청과 함께 전송된 POST 변수들
3. Request.Cookie : 요청과 함께 전송된 Cookie
4. Request.HttpMethod : 요청을 위해 사용된 Http method
5. Request.Headers : 요청과 함께 전송된 HTTP Header
6. Request.Url : 요청된 Url
7. Request.UserHostAddress : 요청을 보내온 사용자의 Ip Address
8. RouteData.Route : 요청에 대해 선택된 RouteTable.Routes Entry
9. RouteData.Values : 현재의 Route 매개 변수(URL에서 추출된 값이거나 기본 값)
10. HttpContext.Application : Application state 저장소
11. HttpContext.Cache : Application cache 저장소
12. HttpContext.Items : 현재 요청에 대한 상태저장소
13. User : 로그인 한 사용자의 인증정보
14. TempData : Session 내에서 이전 HTTP 요청을 처리하는 동안에 저장된 임시 Data

* Controller의 출력 처리
a. View를 Rendering하는 것으로 HTML 반환
b. HTTP 재전송 호출(311, 312 code 반환)
c. 응답의 출력 스트림에 다른 데이터 전송(xml, json, file)

* Action method 안에서의 직접적으로 Response를 다루는 일은 절대로 하지 않아야지 된다. 대신에 특정한 응답을 나타낼 수 있는 ActionResult를 상속한 객체를 반환하도록 한다.

* ActionResult 형식들
1. ViewResult : 지정된 View Template이나 기본 View Template을 Rendering 한다. [Mvc.Controller.View() method]
2. PartialViewResult : 지정된 Partial View Template이나 기본 Partial View Template을 Rendering한다.(Mvc.Controller.PartialView()]
3. RedirectToRouteResult : Routing 구성 설정에 따라 URL을 생성하면서 302 재전송을 하게 한다.[Mvc.Controller.RedirectToAction()]
4. RedirectResult : 임의의 URL로 HTTP 302 재전송을 하게 한다. RedirectToRouteResult와 다른 점은 RedirectResult는 외부의 URL을 사용가능하다는 차이점을 가지고 있다.
5. ContentResult : 브라우저로 text 데이터를 반환할 수 있다. 선택적으로 Content Header를 지정 가능하다.
6. FileResult : 이진 데이터를 브라우저로 직접 전달한다.
7. Jsonresult : .NET 객체를 Json 포멧으로 직렬화하고 이를 응답으로 전송한다.
8. JavascriptResult : 브라우저에 의해 실행될 수 있는 javascript 소스코드의 일부를 전송한다.
9. HttpUnauthorizedResult : Http 응답코드를 401로 설정한다.
10. EmptyResult : 아무 일도 하지 않는다.

사용자 지정 ActionResult를 만들고 싶은 경우(Image를 가공해서 반환한다던지 등의 Action이 가능하다)에는 ActionResult를 상속받아서 ExecuteResult를 재정의해서 사용하면 된다. 다음은 그 예제 코드이다.


01.public class WatermarkedImageResult : ActionResult
02.{
03.    public string ImageFileName { get; private set; }
04.    public string WatermarkText { get; private set; }
05. 
06.    public WatermarkedImageResult(string imageFileName, string watermarkText)
07.    {
08.        ImageFileName = imageFileName;
09.        WatermarkText = watermarkText;
10.    }
11. 
12.    public override void ExecuteResult(ControllerContext context)
13.    {
14.        using(var image = Image.FromFile(ImageFileName))
15.        using(var graphics = Graphics.FromImage(image))
16.        using(var font = new Font("Arial", 10))
17.        using(var memoryStream = new MemoryStream())
18.        {
19.            var textSize = graphics.MeasureString(WatermarkText, font);
20.            graphics.DrawString(WatermarkText, font, Brushes.White, 10, image.Height - 10 - textSize.Height);
21. 
22.            image.Save(memoryStream, ImageFormat.Png);
23.            var response = context.RequestContext.HttpContext.Response;
24.            response.ContentType = "image/png";
25.            response.BinaryWrite(memoryStream.GetBuffer());
26.        }
27.    }
28.}

* TempData와 Session과의 비교
기본적으로 TempData의 저장소는 Session이 된다. 그렇기 때문에 TempData를 사용하고 싶으면 반드시 Session을 enable 시켜야지 된다. 하지만 TempData의 고유한 특징은 이것이 매우 작은 데이터라는 것이다. 각 entry는 오직 한번의 이전 요청을 저장하고 난 다음 없어진다. 처리 후에 자동으로 청소가 되니 RedirectToAction()에 걸쳐 개체를 유지하는데 적합하다.

* 재 사용가능한 Filter 처리하기
Filter를 이용해서 Controller와 ActionMethod에 추가적인 동작을 지정할 수 있다.
Filter는 요청 처리 PipeLine에 별도의 단계를 추가하는 .NET Attribute로 Action method의 실행 전후에, ActionResult가
실행 전후에 추가적인 로직을 삽입할 수 있다.

Action method의 실행 전후는 IController.Execute method의 실행 전, 후를 의미하며,
ActionResult의 실행 전후는 ActionResult.ExecuteResult method의 실행 전, 후를 의미한다.
따라서 실행 순서는 OnActionExecuting, OnActionExecuted, OnResultExecuting, OnResultExecuted 순서로 실행된다.

ex) HandleError : HandleErrorAttribute는 Controller의 Action method가 실행될 때에 예외가 발생되면 HandleError에 지정된 View가 Render된다.이때에 web.config에 customError mode가 on이 되어있어야지 된다. 이때 지정된 View는 HandleErrorInfo data model이 전달되며, 이는 불려진 Controller와 ActionName, Exception의 정보를 담게 된다. 이 상태는 Error를 처리된 상태로 만들게 되며 따라서 Http 응답코드는 에러가 아닌 200이전달되게 된다.


Controller Test Code
* Controller의 Unit Code는 의미있는 단위 테스트를 작성하기 위해서 많은 사람들이 AAA Pattern을 따른다. Arrange-Act-Assert로 이루어지는
이 방법은 대부분의 Controller 테스트에 유용하다.

01.[TestClass]
02.public class HomeControllerTest
03.{
04.    [TestMethod]
05.    public void CheckViewName()
06.    {
07.        HomeController controller = new HomeController();
08.        ViewResult viewResult = controller.Index();
09. 
10.        Assert.IsNotNull(viewResult);
11.        Assert.AreEqual(viewResult.ViewName, "index");
12.    }
13. 
14.    [TestMethod]
15.    public void CheckViewData()
16.    {
17.        HomeController controller = new HomeController();
18.        ViewResult viewResult = controller.Index();
19. 
20.        Assert.IsNotNull(viewResult);
21.        Assert.AreEqual(6, viewResult.ViewData["age"]);
22.    }
23. 
24.    [TestMethod]
25.    public void CheckRedirection()
26.    {
27.        HomeController controller = new HomeController();
28.        RedirectToRouteResult result = controller.Index();
29. 
30.        Assert.IsNotNull(result);
31.        Assert.AreEqual("RedirectActionName", result.RouteValues["action"]);
32.    }
33.}
Posted by 철냄비짱
,

iBatis.NET 을 하다보면 sqlmap 을 정의하는것이 가장 중요한 작업중에 하나 입니다.
이때 sqlmap xml 에서 mapper 정의하고 파라메터 클래스 mapper 정의하고 result mapper 정의하고 ..
만일 vo 클래스 속성명이라도 고칠라고 하면 .. xml 뜯어서 mapper 정의 다시 고치고..
에러나면 찾기도 힘들것입니다.

별것 아니지만 간단하고 깔끔하게 sqlmap 을 정의할 수 있고 수정 공수도 줄일 수 있습니다.

1) resultMap 대신 resultClass를 사용합니다.

다음 예제를 참조

 <alias>
    <typeAlias alias="AttachFileVO" type="UBISC.DDF.Vo.AttachFileVO, AMOJEIND.DDF"/>
    <typeAlias alias="CommonCodeVO" type="UBISC.DDF.Vo.CommonCodeVO, AMOJEIND.DDF"/>
</alias>

<statement id="listCommonCode" resultClass="CommonCodeVO">
</statement>

2) 파라메터 클래스는 Dictionary 를 사용합니다.

파라메터 클래스를 모두 만들거나 ReusltMap 으로 정의한다면 참으로 비효율적일 것입니다.
결과에 비해 파라메터는 양도 많을 뿐더러 변화무쌍하기 때문이죠

 IDictionary<string,object> param = new Dictionary<string,object>();
param.Add("USER_ID", "honester");

Mapper.Instance().QueryForList<T>("listCommonCode", param);

"statement" 태그의   parameterClass 속성 값과 상관없이 Mapper는 파라메터에 따라 Generic 하게 처리됩니다.
즉, 만일 클래스를 정의했다 하더라고 dictiony 키값과 해당 vo 클래스의 속성명이 일치하면
쿼리에 그 값을 지정해 줄수 있습니다..
sqlmap 에 다음과 같이 정의되어 있더라도 무방합니다.

 <statement id="listCommonCode"  parameterClass="CommonCodeVO" resultClass="CommonCodeVO">
....
</statement>

3) 만일 리턴받는 VO 객체도 만들기 싫다면 resultClass 에 Dictionary를 사용합니다.

설마 "System.Collections.Generic.Dictionary"를 사용하지는 않겠죠?
다음을 참조

 <statement id="selectLoginUser" resultClass="System.Collections.Specialized.HybridDictionary">
....
</statement>

Posted by 철냄비짱
,

Visual Studio 2010 - MVC 2.0 프로젝트로 작업을 하던중...

 

Visual Studio 2010 MVC - 잠재적 위험이 있는 Request.Form 값을 발견했습니다.

 

 

 

다음과 같은 에러가 났다.

 

열심히 구글링도 해보고, 이것저것 찾아봤다.

 

해결책은,

 

기존의 WebForm 에서는

ValidateRequest="false"

 

이런 내용을 페이지에 추가하라고 한다.

 

하지만 MVC에서는

액션함수 속성으로,

 

[AcceptVerbs(HttpVerbs.Post), ValidateInput(false)]

 

(포스트일때 주로 이런일이 일어나니까..)

 

이걸 추가하면 된다고 여기저기 블로그나 게시판에 있다.

 

하지만, .NET Framework 4.0에서는 이역시 안된다.

 

Web.Config 파일에 다음 내용을 추가해줘야 한다.

 

<system.web>  
<httpRuntime requestValidationMode="2.0"/>
 
Posted by 철냄비짱
,

 

 

iBaris.NET으로 DAO 설정 및 연결 시 생기는 오류인데 처음엔 설정 오류를 못찾아서 한참을 헤메이다,

 

프로젝트를 여러번 생성 시켰다가 지우기를 반복.

 

아주 간단한 빌드 설정 오류.

 

해결방법은...

 

 

위 그림처럼

 

해당 XML 파일의 "속성" 탭에서

 

"빌드작업"의 설정 값을 포함리소스로 변경하면 끝.

 

Posted by 철냄비짱
,

필요한 해당 *.xsd 파일들을

 

visual studio2012 일 경우

C:\Program Files (x86)\Microsoft Visual Studio 10.0\Xml\Schemas

 

 경로에 붙여넣기만 하면 끝남.

 

설치경로나 비주얼 스튜디오 버전에 따라 경로가 달라지므로 주의할것.

Posted by 철냄비짱
,

[출처] jQuery를 사용하여 ASP.NET AJAX Web Service 호출하기 예제|작성자 파로스

 

닷넷을 사용하면서 제일 불편하고 짜증나는 것 중에 하나가 쓸데없는 코드가 너무 많다는 것과 애매모호한 PostBack 이다.

jQuery를 사용하면서 그런 느낌은 더욱 심해졌다.

그래서 사용한 방식이 서버단 처리를 모두 제네릭 처리기로 하였는데 뭔가 다른 방법을 써 보고 싶었다.

MVC가 요즘 뜨는거 같아서 그거로 할까 알아봤지만 뷰가 완전히 독립된 것이 아닌 닷넷 코드 혼합이다.

내가 원하는 것은 닷넷 코드가 전혀 들어가지 않은 순수 html + javascript + css로만 구성된 뷰페이지를 구성하는 것이다.

그래서 나온 결론은 웹서비스!

하지만 웹서비스는 기본으로 XML을 지원한다.

JSON을 사용하는 방법을 찾아봤지만 희안하게 한글 자료가 별로 없다. (검색 능력이 떨어지는지 없을리가 없는데~)

암튼 힘들게 찾은 사이트 물론 영어다.

설명은 자세히 되어 있는거 같은데 해석이 안되니~ 다른 한글 자료 찾아보다가 마땅한게 없어서 그냥 영문 사이트 소스보면서 대충 이해했다.

생각했던 것 보다는 훨씬 간단했다.

웹서비스 사이트 하나 만들고 거기에 원하는 데이타 뿌려주면 된다.

초간단으로 만든 예제.

이번에도 걸그룹이다. 레인보우~

웹서비스에 Rainbow 클래스를 하나 만들고 GetMember 메소드를 통해서 그룹명과 멤버리스트를 json 형식으로 가져오는 것이다.

사용법만 알면 어려움이 없기 때문에 흐름만 알면 충분하다.

내용이 별로 없어서 이번에도 녹화.

설명글 10번 읽는것보다 작업 내용 한번 직접 보는게 빠르다.

닷넷 3.5 이상에서는 보안상 결과값이 {"d": "data"} 형태로 리턴된다. 따라서 스크립트로 처리할때 한번 필터링(dtaFilter) 해준다

Rainbow.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Rainbow</title>

<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.js"></script>
<script type="text/javascript">
$(document).ready(function() {

$("#button").click(function() {
$.ajax({
type: "post",
url: "Service1.asmx/GetMember",
contentType: "application/json; charset=utf-8",
dataType: "json",
dataFilter: function(data) {
var msg;
if (typeof (JSON) !== 'undefined' && typeof (JSON.parse) === 'function') {
msg = JSON.parse(data);
} else {
msg = eval('(' + data + ')');
}

if (msg.hasOwnProperty('d')) {
return msg.d;
} else {
return msg;
}
},
success: function(data) {
alert(data.groupName);
$("#groupName").text(data.groupName);
$("#memberList").text(data.memberList);
}
});
});
});
</script>

<style type="text/css">
#content { paddding:20px; }
#groupName { font-weight:bold; font-size:20px; }
#memberList { color:Blue; }
</style>
</head>
<body>

<div id="content">
<div id="groupName">그룹명</div>
<div id="memberList">멤버리스트</div>
<input type="button" value="클릭!" id="button" />
</div>
</body>
</html>

Service1.asmx.cs

기본 생성 코드에서 [System.Web.Script.Services.ScriptService] 이부분 주석을 풀어주면 json을 사용할 수 있다.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;

namespace WebService2
{
/// <summary>
/// Service1의 요약 설명입니다.
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
// ASP.NET AJAX를 사용하여 스크립트에서 이 웹 서비스를 호출하려면 다음 줄의 주석 처리를 제거합니다.
[System.Web.Script.Services.ScriptService]
public class Service1 : System.Web.Services.WebService
{

[WebMethod]
public string HelloWorld()
{
return "Hello World";
}

[WebMethod]
public Rainbow GetMember()
{
Rainbow r = new Rainbow();

r.groupName = "Rainbow";
r.memberList = "김재경,고우리,김지숙,노을,오승아,정윤혜,조현영";

return r;
}
}


public class Rainbow
{
public string groupName;
public string memberList;
}
}

[참고]

http://encosia.com/2009/02/10/a-breaking-change-between-versions-of-aspnet-ajax/

http://encosia.com/2008/03/27/using-jquery-to-consume-aspnet-json-web-services/

 

 

Posted by 철냄비짱
,