> 백엔드 개발 > PHP 튜토리얼 > 비동기 이미지 전송 샘플 코드를 구현하기 위해 Thinkphp와 ajaxFileUpload를 결합한 자세한 설명

비동기 이미지 전송 샘플 코드를 구현하기 위해 Thinkphp와 ajaxFileUpload를 결합한 자세한 설명

黄舟
풀어 주다: 2023-03-06 15:50:01
원래의
1875명이 탐색했습니다.

이 글에서는 Thinkphp를 ajax와 결합하여파일업로드하여 비동기 이미지 전송을 구현하는 방법을 주로 소개합니다. 이 글에서는 필요한 모든 사람에게 확실한 참고 가치가 있는 자세한 샘플 코드를 제공합니다. 아래에서 함께 살펴보세요.

머리말

이 프로젝트를 하기 전에는 항상 이미지 업로드 처리는 파일 전송을 위해 폼 제출을 직접 사용하는 것이었습니다. 이번에는 요청에 따라 구현해야 합니다. 사진의 비동기 전송은 구현하기 어렵지 않습니다. 플러그인이 너무 많지만 여전히 디버깅 시간을 많이 낭비하는 이유는 오류가 자주 발생하는 고대 플러그인 ajaxfileupload를 사용했기 때문입니다. 처음 사용하기 시작했을 때 핸들러는 함수가 아닙니다.

무거운 마음으로 바이두를 검색해보니 검색엔진색인이 정말 강력하다는 걸 느낄 수 있었습니다.

해결 방법

위 오류가 발생하는 이유는 jquery가 1.9.0부터 더 이상 핸들러 메서드를 사용하지 않기 때문입니다. 알 수 없으므로 다운로드한 jQuery.extend({:


handleError: function( s, xhr, status, e ){
// If a local callback was specified, fire it
if ( s.error ) {
s.error.call( s.context || s, xhr, status, e );
}

// Fire the global callback
if ( s.global ) {
(s.context ? jQuery(s.context) : jQuery.event).trigger( "ajaxError", [xhr, s, e] );
}
}
로그인 후 복사

에만 수동으로 코드를 추가할 수 있습니다.


$.ajaxfileupload({

  url : '',

  secureuri : '',

  fileElementId : '', --> 这里填的是 input file的ID

  data : {},

  dataType : 'json',

  complete : function(data){} 

})
로그인 후 복사
를 계속 디버그하세요.

코드에서 더 이상 오류가 보고되지 않았지만 새로운 문제가 발생했습니다. 반환된 데이터가 항상 정의되지 않았습니다. 그런 다음 디버깅 도구를 확인한 결과 반환 값이 존재하고 형식이 정상임을 알 수 없었습니다. 나가서... ............ Baidu,

그런 다음 두 가지 조정을 수행했습니다.

1, ajaxfileupload 변경 .js eval('data = '+  data) ; data = jQuery.parseJSON(jQuery(data).text());

2로 바꾸고, 전체 메서드를 Success

ok로 바꾸면 백엔드에서 반환된 데이터를 인쇄할 수 있습니다.

요약

위 내용은 비동기 이미지 전송 샘플 코드를 구현하기 위해 Thinkphp와 ajaxFileUpload를 결합한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿