참고 : 실제 프레임 워크의 뷰 템플릿 에서이 작업을 수행하지만 여기에서 실제 MVC 앱을 사용하지 않으므로 해당 부분을 건너 뜁니다. . 사용자는 페이지에 "보고서 버그"버튼을보고 "작동하지 않고 최대한 빨리 수정"과 같은 메시지를 작성합니다. 일반적으로 이것은 쓸모없는 정보이지만 이번에는이 화려한 오류 로그가 첨부됩니다.
이제 초기화가 있음을 알 수 있습니다.
당신은 우리가 보낼 데이터를 볼 수 있습니다 - 평소와 마찬가지로
그리고 출력을 볼 수 있습니다. 예, 문제가 있습니다. 분명히 인증 문제가 있습니다.
핵심 PHP 오류조차도 디버깅에 도움이 될 수 있습니다.
<span>$json_data = '{"value":1,"apples":2,"name":3,"oranges":4,"last one":5}';
</span>
<span>//we will simulate the json data, but imagine that this is the normal data exchanged daily between your client’s website and a 3rd party API
</span>
<span>$ch = curl_init('http://talkweb.eu/labs/fr/json_callback.php');
</span><span>curl_setopt($ch, CURLOPT_CUSTOMREQUEST, "POST");
</span><span>curl_setopt($ch, CURLOPT_POSTFIELDS, $json_data); curl_setopt($ch, CURLOPT_RETURNTRANSFER, true); curl_setopt($ch, CURLOPT_HTTPHEADER, array( 'Content-Type: application/json',
</span> <span>'Content-Length: ' . strlen($json_data)));
</span>
<span>//the normal CURL request, nothing strange here:
</span><span>$result = curl_exec($ch);
</span>
<span>//receiving the data back
</span><span>$f_data = json_decode($result,true);
</span>
<span>//showing a greeting with the output
</span><span>echo “Welcome”. $f_data['username'];</span>
클라이언트는 버튼을 한 번만 클릭하면 버그를 더 빨리 싸우는 데 필요한 모든 것을 얻게됩니다.
오류 및 로그 (위와 같이)
주석이 달린 스크린 샷 - 문제 가이 간단한 예보다 더 복잡한 경우
스크린 크기, 브라우저 버전, OS 및 브라우저에 설치된 플러그인
물론 클라이언트가 필요할 때만이 기능을 켜면이 기능을 켜면이 기능이 켜질 수 있습니다. 위젯의 가용성을 제한하려면 IP 필터 또는 쿼리 매개 변수 배리어를 추가하고 Dev.* subdomain 등을 엽니 다.
<span><span><?
</span></span><span><span>class SendToUsersnap
</span></span><span><span>{
</span></span><span> <span>var $m;
</span></span><span> <span>//Save all logs in an array. You can use an even more elegant approach but right now I need it to be simple for the sake of this tutorial.
</span></span><span> <span>function log ( $data, $type ) {
</span></span><span>
</span><span> <span>if( is_array( $data ) || is_object( $data ) ) {
</span></span><span> <span>$this->m[]= "console.".$type."('PHP: ".json_encode($data)."');";
</span></span><span> <span>} else {
</span></span><span> <span>$this->m[] = "console.".$type."('PHP: ".$data."');";
</span></span><span> <span>}
</span></span><span> <span>}
</span></span><span> <span>// Print all logs that have been set from the previous function. Let’s keep it simple.
</span></span><span> <span>function out (){
</span></span><span> <span>for ($i=0;$i<count($this->m);$i++)
</span></span><span> <span>{
</span></span><span> <span>echo $this->m[$i]."\n";
</span></span><span> <span>}
</span></span><span>
</span><span>
</span><span> <span>}
</span></span><span><span>}</span></span>
결론
이것은 스크립트 모니터링 도구가 아니며 문제가 나타나는 경우 및 경우 정보를 자동으로 전달하지 않습니다. 이 접근법은 사용자 나 클라이언트가 버그를보고하고 개발자 또는 QA가 버그와 싸우는 방법에 대한 더 많은 정보가 필요한 경우에만 작동합니다. 원격 디버거로 상상하지만 클라이언트 측 오류 이벤트 및 데이터는 PHP에서 JavaScript로 보내는 데이터를 상상해보십시오.
나는 당신의 모든 질문에 답하고 싶습니다! 아래에 피드백을 남겨주세요!
usersnap 에 대한 질문 (FAQ)은 자주 묻습니다.
클라이언트 측 버그보고에 대한 사용자nap은 어떻게 작동합니까?
usernap은 사용자가 웹 애플리케이션에서 직접 버그를보고 할 수있는 시각적 버그 추적 도구입니다. 중요한 브라우저 정보와 함께 문제의 스크린 샷을 캡처 한 후 개발 팀에 전송됩니다. 이를 통해 앞뒤 커뮤니케이션의 필요성을 제거하고 버그 수정 프로세스 속도를 높입니다. usernap은 또한 인기있는 프로젝트 관리 및 커뮤니케이션 도구와 통합되어 다양한 팀을위한 다용도 솔루션입니다. <span>require_once('Usersnap.class.php');
</span> <span>$s = new SendToUsersnap;
</span>
<span>$json_data = '{"value":1,"apples":2,"name":3,"oranges":4,"last one":5}';
</span> <span>$s->log('Initializing the JSON request',"info");
</span> <span>$s->log($json_data,"log");
</span>
<span>$ch = curl_init('http://talkweb.eu/labs/fr/json_callback.php');
</span> <span>curl_setopt($ch, CURLOPT_CUSTOMREQUEST, "POST");
</span> <span>curl_setopt($ch, CURLOPT_POSTFIELDS, $json_data);
</span> <span>curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
</span> <span>curl_setopt($ch, CURLOPT_HTTPHEADER, array(
</span> <span>'Content-Type: application/json',
</span> <span>'Content-Length: ' . strlen($json_data)));
</span>
<span>$result = curl_exec($ch);
</span> <span>$f_data = json_decode($result,true);
</span>
<span>echo 'Welcome'. $f_data['usersname'];
</span>
<span>$s->log($f_data,"log");
</span> <span>$s->log(error_get_last(),"error");</span>
사용자nap의 주요 기능은 무엇입니까?
사용자nap은 강력하게 만드는 몇 가지 주요 기능을 제공합니다. 버그보고 도구. 여기에는 스크린 샷 캡처, 브라우저 정보 수집, 콘솔 로그 녹음 및 사용자 피드백 수집이 포함됩니다. 또한 Slack, Jira 및 Trello와 같은 인기있는 도구와 통합을 제공합니다. 또한 사용자nap은 다른 시스템과의 추가 사용자 정의 및 통합을위한 API를 제공합니다. usernap을 내 웹 응용 프로그램에 통합하려면 어떻게해야합니까? usernap을 웹 애플리케이션에 통합하는 것이 간단합니다. UsersNap 계정에 가입하고 새 프로젝트를 작성한 다음 제공된 JavaScript 코드를 웹 응용 프로그램에 추가해야합니다. 이 코드는 응용 프로그램에 사용자nap 위젯을로드하여 사용자가 버그를 직접보고 할 수 있습니다.
usersnap 위젯을 사용자 정의 할 수 있습니까? 예, UsersNap은 위젯에 대한 다양한 사용자 정의 옵션을 제공합니다. 브랜드와 일치하도록 위젯의 색상, 텍스트 및 위치를 변경할 수 있습니다. 피드백 양식을 사용자 정의하여 사용자로부터 특정 정보를 수집 할 수도 있습니다. 이 모든 것은 UsersNap 대시 보드 또는 API를 통해 수행 할 수 있습니다.
사용자 나 맵은 내 웹 애플리케이션의 품질을 향상시키는 데 어떻게 도움이됩니까?
사용자가보고 할 수있는 간단하고 효율적인 방법을 제공함으로써 버그, usersNap은 문제를 더 빨리 식별하고 수정하는 데 도움이됩니다. 시각적 피드백과 자세한 브라우저 정보는 개발 팀이 문제를 쉽게 이해하고 재현하는 데 도움이됩니다. 이로 인해 버그 수정 및 개선이 더 빠르면 웹 애플리케이션의 전반적인 품질이 향상됩니다. 사용자nap API는 무엇이며 어떻게 사용할 수 있습니까?
사용자nap API는 일련의 세트입니다. 프로그래밍 방식으로 사용자와 상호 작용할 수있는 인터페이스 프로그래밍 인터페이스. API를 사용하여 프로젝트를 작성, 업데이트 및 관리 할 수있을뿐만 아니라 UsersNap 위젯을 사용자 정의 할 수 있습니다. API는 편안하고 표준 HTTP 메소드를 사용하여 기존 시스템과 쉽게 통합 할 수 있습니다. 사용자nap은 사용자 개인 정보를 어떻게 처리합니까?
usersnap은 사용자 개인 정보를 심각하게 받아들입니다. 이 도구는 동의없이 사용자 활동을 추적하거나 개인 데이터를 수집하지 않습니다. 수집 된 모든 데이터는 안전하게 저장되며 버그보고 목적으로 만 사용됩니다. usernap은 또한 GDPR 및 기타 개인 정보 보호 규정을 준수합니다. 모바일 버그보고에 UsersNap을 사용할 수 있습니까?
예, UsersNap은 모바일 버그보고를 지원합니다. UsersNap 위젯은 반응이 좋으며 모바일 장치에서 잘 작동합니다. 이를 통해 사용자는 모바일 브라우저에서 직접 버그를보고 할 수 있으므로 모바일 웹 애플리케이션을 개선하기위한 귀중한 피드백을 제공합니다.
usernap은 다른 버그보고 도구와 어떻게 비교됩니까? usersnap이 눈에 띄게됩니다. 시각적 피드백과 자세한 브라우저 정보는 버그보고 및 수정을보다 효율적으로 만들 수 있습니다. 또한 다양한 사용자 정의 옵션과 인기있는 도구와의 통합을 제공합니다. 다른 도구는 유사한 기능을 제공 할 수 있지만 UsersNap의 단순성과 다양성은 많은 팀에게 선호하는 선택입니다. 사용자nap은 어떤 지원을 제공합니까?
usersnap은 사용자에게 포괄적 인 지원을 제공합니다. 여기에는 자세한 문서, API 참조 및 도구를 최대한 활용하고 최대한 활용하는 데 도움이되는 예제가 포함됩니다. usernap은 또한 당신이 가질 수있는 모든 쿼리 또는 문제에 대한 이메일 지원을 제공합니다.