웹 캡처 및 변환 도구
GrabzIt의 온라인 커뮤니티

위치 관련 Firefox 문제

GrabzIt의 웹 스크레이퍼 도구와 관련된 질문을 하십시오. 웹 스크레이퍼 및 API를 사용하여 웹 페이지, 이미지 또는 PDF 문서에서 데이터를 추출하는 방법 등.

특정 상황에서 Firefox에서 스크린샷이 올바르게 작동하는 데 문제가 있습니다. 

Firefox는 다른 브라우저에서 사용하지 않는 "inset" CSS 속성을 사용합니다(https://developer.mozilla.org/en-US/docs/Web/CSS/inset). 왼쪽/오른쪽/위/아래 대신 사용됩니다. 적어도 내 FF 버전에서는 왼쪽/오른쪽/... CSS를 대체하여 강제로 사용하도록 합니다. GrabzIt은 이 속성을 인식하지 못하므로 Firefox 사용자에게는 이미지가 올바르지 않습니다. 

다른 사람이 이것을 경험하고 해결책을 가지고 있습니까?

18년 2019월 XNUMX일 Corey Alderin이 질문함

아마도 변경되기 쉬운 CSS 코드를 외부 CSS 파일에 넣고 HTML에서 그런 식으로 참조할 수 있을까요?

18년 2019월 XNUMX일 GrabzIt 지원팀에서 답변함

내 경우에는 작동하지 않습니다. 항상 동일하지는 않기 때문에 CSS를 인라인으로 유지해야 합니다. 사용자에 따라 변경됩니다. 

18년 2019월 XNUMX일 Corey Alderin이 답변함

내 FireFox 버전에서는 다음을 테스트했습니다.

<html>
<head>
<script src="grabzit.min.js"></script>
</head>
<body>
<div id="screenshot"><style>
div{
top:1em;
left:1em;
position:absolute;
}
</style>
<div>Hello</div></div>
<script>GrabzIt("APPLICATION KEY").ConvertHTML(document.getElementById('screenshot').innerHTML,{"target": "#captureThis",
"format": "png",
"transparent": 1,
"bwidth": 1200,
"bheight": 1000,
"hd": 1,
"width": 1200,
"height": 1000,
"hide": ".modal-backdrop",
"displayid": "finalImage"}).DataURI();
</script>
</body>
</html>

게시된 데이터는 다음과 같습니다.

<style>
div{
top:1em;
left:1em;
position:absolute;
}
</style>
<div>Hello</div>

삽입된 내용이 전송되지 않았습니다.

 

18년 2019월 XNUMX일 GrabzIt 지원팀에서 답변함

나는 이것을 더 많이 테스트해왔고 사용자가 div를 이동할 때 이런 일이 일어나는 것으로 보입니다. 내 앱에서는 요소를 이동할 수 있으며 이때 Firefox에서 변경이 이루어집니다. 이를 설명하기 위해 코드를 일부 변경할 수도 있습니다. 

18년 2019월 XNUMX일 Corey Alderin이 답변함