programing

Ricoh Theta S - 자바스크립트로 라이브 프리뷰

oldcodes 2023. 10. 6. 21:59
반응형

Ricoh Theta S - 자바스크립트로 라이브 프리뷰

나는 HTTP 요청을 사용하여 Ricoh ThetaS 카메라와 대화하는 앱을 만들려고 합니다.Open Spherical Camera API Version 1.0 ...을 준수합니다.여기 그들의 api 참조입니다.

그래서 카메라가 지원한다고 하는 라이브 프리뷰를 구현하려고 합니다.자바스크립트로 하고 있어서 가능한 모든 조합을 시도해서 api 호출이 돌아온다고 하는 이진 데이터를 얻었어요 바닐라 js, jquery, angular...아무것도...다음은 ...요청서의 인쇄화면입니다.디버거는 상태 코드가 200이지만 빨간색으로 표시됩니다.

enter image description here

대답이 공허합니다... 그래서 제 질문은...객체를 보내는 POST 요청을 사용하여 HTTP를 통해 자바스크립트로 모션 JPEG(10fps)를 구현할 수 있는 방법이 있습니까?

고마워, 레레스

여기에 몇 가지 시도해 볼 수 있는 것들이 있습니다.많은 서버측 기술(등).NET 및 Java)는 자바스크립트보다 유효한 JSON이라고 간주되는 것에 대해 훨씬 더 엄격합니다.대부분은 검증된 XML에 의존했던 SOAP와 같은 초기 기술을 적용했으며 JSON을 이와 유사한 엄격한 규칙 집합으로 간주합니다.

또한 연결 중인 API는 웹용 코드를 작성해 본 적이 없는 전문 내장 카메라 펌웨어 엔지니어가 작성한 것일 수 있습니다.그들은 JS보다 훨씬 덜 관대한 C++와 자바에 익숙합니다.

먼저 그들의 API는 HTTP 헤더를 다음과 같이 예상한다고 명시합니다.

Content-Type: application/json;charset=utf-8
Accept: application/json

그러나 보내는 스크린샷:

Content-Type: text/plain;charset=utf-8

이것은 당신이 보내는 내용이 JSON이 아닌 텍스트임을 서버에 알려줍니다.JSON을 사용하면 서버 측면의 JSON 구현이 실패할 수도 있습니다.

다음으로 시도해야 할 것은 실제로는 자바스크립트가 아닌 많은 JSON 파서가 유효한 JSON이라고 간주되는 것에 몇 가지 꽤 구체적인 규칙을 추가한다는 것입니다.

보내는 내용:

{name:camera._getLivePreview, parameters:{sessionId:SID_0001}}

이것은 유효한 JS이지만 엄격한 XML과 같은 규칙에 의해 실제로 유효한 JSON은 아닙니다. 왜냐하면 이 규칙들은 모든 것이 따옴표로 표시되기를 기대하기 때문입니다(따옴표로 표시하지 않는 값 유형은 부울과 숫자뿐입니다).

시도해 보십시오.

{
    "name": "camera._getLivePreview", 
    "parameters": {
        "sessionId": "SID_0001"
    }
}

시작 가이드를 보면 모든 요청을 이런 방식으로 포맷합니다. 속성을 인용하고 값을 인용합니다.

한 JSON을 한 한 JSON JS 입니다를 입니다.JSON.stringify다음과 같이 요청 본문을 설정합니다.

const content = {name:'camera._getLivePreview', parameters:{sessionId:'SID_0001'}};

const response = await fetch('.../osc/commands/execute', {
    method: 'POST', 
    body: JSON.stringify(content),
    headers:{ 'Content-Type': 'application/json' }
});

으로 에서 이를 fetch입니다에서 XMLHttpRequest이를 렌더링할 수 있는 파이핑합니다. .target_closed오류를 범실.

스트림을 통해 계속 반복해야 합니다.

// Get the fetch response as a stream 
const reader = await response.body.getReader();

// Async loop the stream
let chunk = await reader.read();
while (chunk && !chunk.done) {
    for (let index = 0; index < chunk.value.length; index++) {
         // parse the response in chunks       
    }
    chunk = await reader.read();
}

이미 수많은 JS MJPEG 구현이 나와 있습니다. 여기에 꽤 간단한 것이 있습니다.

언급URL : https://stackoverflow.com/questions/33518443/ricoh-theta-s-live-preview-in-javascript

반응형