먼저 사진을 보세요:
1. 소개:
s3captcha는 이미지를 순차적으로 표시할 수 있는 매우 유용한 JQuery 플러그인입니다. php를 통해 구현됩니다. 하지만 이를 asp.net 및 C# 코드로 변환하는 것이 쉽다는 것을 알았습니다. 이미지의 소스와 이름을 구성할 수 있는 구성 구성 파일을 만들었습니다.
그럼 s3captcha의 구현 원리를 소개하자면,
위 그림은 구현 모드를 보여줍니다.
1. 이미지의 인덱스를 즉시 생성합니다.
2. 이미지의 인덱스에 일련의 임의의 데이터를 할당합니다.
3. >4. 그림을 라디오 상자로 무작위로 표시합니다.
JQuery를 사용하여 라디오 상자를 그림 목록으로 변환합니다.
2. 코드:
먼저 이미지 인덱스 배열 순서를 어지럽히고 다시 출력합니다:
public static List shuffle(List input)
{
List 출력 = new List() ;
Random rnd = new Random();
int FIndex
while (input.Count > 0)
{
FIndex = rnd.Next(0, input. 개수);
output.Add(input[FIndex]);
input.RemoveAt(FIndex)
input.Clear(); 🎜>rnd = null;
return 출력;
}
xml을 s3captche 구성 파일로 사용:
코드 복사
사과,체리,레몬,배,딸기사과,체리,레몬,배,딸기> <너비>33너비>
<높이>33높이>
jpg >
로봇이 아닌 인간인지 확인하세요. {0}
GetHtmlCode를 선택하세요. 코드:
코드 복사
코드는 다음과 같습니다.
HasValue = true; 🎜>if (HasValue )
{
Random Rnd = new Random();
int RandomIndex = Rnd.Next(0,IconNames.Length)
List
for(int i = 0; i < IconNames.Length;i )
values.Add(i) = shuffle (값);
string WriteThis = ""
string.Format(Message, "" IconTitles[values[RandomIndex] ]
"") "
"
int[] RandomValues = new int[IconNames.Length]
for (int i = 0 ; i < IconNames.Length; i )
{
Rnd.Next()
WriteThis = string.Format(RowTemplate,
IconTitles[i]] RandomValues[i],
PathTo "/icons/" 폴더 "/"
IconNames[values[i]] "." 확장자,
너비, 높이)
}
WriteThis = "
";
SessionValue = RandomValues[RandomIndex]
return WriteThis; }
else
{
SessionValue = -1;
return "잘못된 데이터, 구성 파일을 찾을 수 없음"
}
}
3. 확인 정보 팝업 상자를 구현하려면 ajax 방법을 사용하세요.
s3capcha.ashx는 서버를 요청할 때 html을 반환하는 데 사용됩니다.
코드 복사
코드는 다음과 같습니다.
public void ProcessRequest(HttpContext context) {
context.Response.ContentType = "text/html"
int USession; context.Response.Write(s3capcha.GetHtmlCodes(" ../../s3capcha", out USession)) context.Session[s3capcha.s3name] = USession; context.Response.End() }검증 기능 구현을 위한 verify.ashx 파일 :
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain"
if (s3capcha.Verify(context.Session[s3capcha.s3name) ],
context.Request.Form[s3capcha.s3name]))
context.Response.Write("성공")
else
context.Response.Write("실패")
context.Response.End();
}
JQuery에 Ajax 코드 구현:
//Javascript 코드
$(document).ready(function() {
getCapcha();
$("form") .bind('submit', function() {
$.ajax({
url: 'verify.ashx',
type: 'POST',
data: { 's3capcha': $ ("input[name=s3capcha]:checked").val() },
캐시: false,
성공: function(data) {
alert(data); 🎜>getCapcha();
}
});
return false
});