라이트 애플리케이션 H5 새 버전 JS


H5 버전 라이트 애플리케이션 컴포넌트 호출

H5 버전 라이트 애플리케이션 컴포넌트 는 라이트 애플리케이션 모바일 버전을 의미합니다. (Weibo 클라이언트에 내장됨) Weibo의 기본 기능을 호출하고 애플리케이션 액세스를 위해 제공되는 JavaScript 함수 패키지입니다.

을 사용하면 가벼운 애플리케이션이 현재 네트워크 상태 가져오기, 위치 정보 가져오기, 클라이언트 QR 코드 스캔 실행, 큰 이미지 보기 등과 같은 기능을 수행할 수 있습니다. 또한 액세스 당사자가 호출할 수 있는 일부 구성 요소도 제공합니다. 공유 주소록 구성 요소로.

사용 조건

Weibo Android 및 iPhone 공식 클라이언트 버전 5.3.0 이상 내장 브라우저.

보안 도메인 이름 설정

  • 상단의 내 앱을 클릭하여 구성해야 하는 라이트 앱을 엽니다# 🎜🎜##🎜🎜 #왼쪽 탐색에서 "애플리케이션 정보" 선택
  • 애플리케이션 기본 정보 수정, 보안 도메인 이름 입력 후 저장
  • # 🎜🎜#참고: 보안 도메인 이름의 하위 도메인 이름을 구성합니다. JSBridge


JS 파일 소개의 호출 권한도 얻게 됩니다.

JS API의 H5 버전을 사용하려면 먼저 JS 파일을 도입해야 합니다.

<script src="http://tjs.sjs.sinajs.cn/open/thirdpart/js/jsapi/ mobile.js" charset="utf-8"></script>
이 JS 파일은 전역 네임스페이스를 사용합니다. WeiboJS는 세 가지 JS 메소드를 제공합니다:

• WeiboJS.init() 목적: Bridge를 호출하기 전에 초기화

    • WeiboJS.invoke() 목적: Bridge의 Action 호출 또는 component
  • • WeiboJS.on() 목적: Bridge의 이벤트 듣기
  • 다음은 하나씩 설명합니다.# 🎜🎜## 🎜🎜#
WeiboJS.init()


`window.WeiboJS`의 `init` 메소드를 통해 초기화되었습니다.

- 매개변수 목록:

`appkey`: 필수, 가벼운 애플리케이션용 appkey

`debug`: 선택 사항, 디버그 스위치

    `timestamp`: 필수, 서명에 사용되는 타임스탬프
  • `noncestr`: 필수, 서명에 사용되는 임의 문자열
  • #🎜🎜 #`signature`: 필수 , 계산된 서명, 서명 방법은 문서 끝을 참조하세요.
  • `scope`: 필수, 조명 애플리케이션이 호출해야 하는 API 목록은 문자열 배열입니다
  • #🎜 🎜#`callback`: 필수, 초기화 성공 또는 실패 후 콜백 함수인 WeiboJS.invoke() 또는 WeiboJS.on()은
  • # 🎜🎜을 실행하기 전에 여기서 콜백이 성공할 때까지 기다려야 합니다. #
  • 예:


WeiboJS.invoke()

`window.WeiboJS`의 `invoke` 메소드를 통해 브릿지 액션을 호출하세요.

예:

WeiboJS.invoke("getNetworkType", {"param" : "value"}, function (params, Success, code) {
if (success) {
document.write(' 네트워크 상태는'+params.network_type);
} else {
if (code == weibojs.status_code.no_result) {
// 뭔가를 하세요.
}}})

첫 번째 매개변수는 호출할 액션, 두 번째는 매개변수 목록, 세 번째는 콜백 함수입니다.

작업 목록

getNetworkType 네트워크 상태 가져오기

- 매개변수 목록: 없음

- 반환 값: `{"network_type": "wwan"}`, `wwan`은 2G 또는 3G를 나타내고 `wifi`는 WIFI를 나타내고 `fail`은 네트워크 없음을 나타냅니다

# 🎜🎜#


getBrowserInfo 기본 브라우저 정보 가져오기

-매개변수 목록: 없음

- 반환 값: `{"clientVersion": "5.3.0", "isWeiboClient": true, "browserType": "normal"}` 그 중 `clientVersion`은 클라이언트 버전 번호를 나타내고 `isWeiboClient`는 현재 Weibo 클라이언트인지 여부를 나타내며 `browserType`은 브라우저 유형을 나타냅니다. 일반=일반 브라우저, topnav=바닥 없는 브라우저, infopage=객체 텍스트 페이지 탐색 장치#🎜 🎜#


checkAvailability API 가용성 확인

- 매개변수 목록: api_list 문자열 배열, 다음 목록을 나타냅니다. 확인해야 하는 API(예: ["getNetworkType", "setBrowserTitle"]

- 반환 값: `{"getNetworkType": true, "setBrowserTitle": true}` 여기서 true는 다음을 의미함) 권한 호출이 있습니다. false는 호출할 권한이 없음을 의미합니다.


setBrowserTitle 상단 가이드 제목 설정

# 🎜🎜#- 매개변수 목록:

`title`: 새 제목, 필수

  • - 반환 값: 없음
  • #🎜 🎜#- 비고: 이 방법으로 설정한 제목이 가장 우선순위가 높습니다. #

openMenu 브라우저 오른쪽 상단의 메뉴를 엽니다. 🎜🎜#

- 매개변수 목록: 없음
    # 🎜🎜#- 반환 값: `{"selected_code": 1001, "selected_title": Share to Weibo}` 여기서 selected_code는 코드를 나타냅니다. 사용자가 선택한 버튼에 해당하며, 알 수 없는 버튼은 0, 일반 버튼은 부록 2에 표시되어 있으며, selected_title은 사용자가 선택한 메뉴의 복사본

#🎜 🎜#
setMenuItems 브라우저 오른쪽 상단에 메뉴를 설정합니다. [공유, 팔로우]

#🎜🎜 #

- 메뉴: ["shareToWeibo","follow"], 이름 메뉴 중 최대 5개 항목 - 내용: 기본 복사본

- 반환 값: 없음

- 참고: 팔로우는 소유자입니다. 앱키

예:


WeiboJS.invoke("getNetworkType", {"param" : "value"}, 함수 (params, 성공, 코드) {
    if (성공) {
        document.write('网络状态是' + params.network_type);
    } else {
        if (코드==WeiboJS .STATUS_CODE.NO_RESULT) {
            // 뭔가를 하세요.
        }
    }
});
# 🎜🎜#

setSharingContent 공유 콘텐츠 설정

- 매개변수 목록: {"icon": "", "title": "", "desc": ""} 여기서 icon은 이미지의 URL을 나타내고 title은 제목을 나타내며 desc는 복사본을 나타냅니다

- 반환 값: 없음

- 참고: 여기에 설정되는 것은 타사 플랫폼에 공유되는 기본 복사본입니다

openImage 더 큰 이미지 보기

- 매개변수 목록:

  • `url `: 현재 선택된 이미지 src ;
  • `urls`: 현재 페이지에 있는 모든 이미지의 src, 가로 슬라이딩 보기를 지원하는 데 사용됨

- 반환 값: None

- 오류 코드:

  • `MISSING_PARAMS`: ` url` 및 `urls`는 최소한


scanQRCode를 전달하여 QR 코드를 스캔해야 합니다

- 매개변수 목록: 없음

- 반환 값: `{"result": "http:/ /weibo.com"}`

- 오류 코드:

  • `USER_CANCELLED`: 사용자가 스캔을 취소했습니다.
  • `SERVICE_FORBIDDEN`: 기기에 카메라가 없거나 사용자가 카메라를 사용할 수 없습니다


pickImage 사진 가져오기

- 매개변수 목록:

  • `source `: `camera`는 사진 촬영용이고 다른 것들은 앨범에서 선택용입니다

- 반환 값: `{"base64": "9sa1..."}`

- 오류 코드:

  • `USER_CANCELLED`: 사용자가 사진 선택을 취소했습니다
  • `SERVICE_FORBIDDEN`: 기기에 카메라가 없거나 사용자가 사진을 선택할 수 없습니다


pickContact 연락처 선택

- 매개변수 목록:

  • `count`: 1, 선택할 최대 인원 수를 나타냄

- 반환 값: `[{"uid": "1406758883", "screen_name": "Bencalie", "avatar_url" : "xxxx.jpg"}]`

- 오류 코드:

  • `USER_CANCELLED`: 사용자가 선택됨
  • `SERVICE_FORBIDDEN`: 서비스를 사용할 수 없음

getLocation 위치

- 매개변수 목록: 없음

- 반환 값: `{"lat": 100, "long": 100}`

- 오류 코드:

  • `SERVICE_FORBIDDEN`: 위치 서비스를 사용할 수 없습니다.
  • `NO_RESULT `: 위치를 가져오지 못했습니다.


login 호출 로그인 기능

- 매개변수 목록:

  • `redirect_uri`: 로그인 게시물 콜백 주소, 필수입니다. 그리고 URL은 http://apps.weibo.com으로 시작해야 하며, 다른 도메인 이름의 URL은 허용되지 않습니다

- 반환 값: 없음


WeiboJS.invoke("login", {
"redirect_uri" : encodeURIComponent("http://apps.weibo.com/test/1406758883/2I8KtA/demo/game/yangtuo")
}, 함수(매개변수, 성공) , 코드) {});


menuItemAvailable 사용 가능한 메뉴 항목 가져오기

WeiboJS.invoke("menuItemAvailable", {}, function(para ms){
 safeAlert( " 획득한 메뉴 항목: " + JSON.stringify(params.available_codes));
});

클라이언트 지원 버전: 5.4.5


invokeMenuItem 트리거 메뉴 항목

WeiboJS.invoke("invokeMenuItem", {code: 메뉴 코드, 부록 2 참조}, function(params){});

클라이언트 지원 버전: 5.4.5

audioMetersChange 마이크 볼륨 변경

WeiboJS.on("audioMetersChange", function(params){
SafeAlert("마이크 볼륨 변경: " + JSON.stringify(params));
});

클라이언트 지원 버전: 5.4.5


캐셔 웨이보 결제

매개변수 목록:

sign_type : 서명 유형, 현재 RSA만 지원

sign : 서명 유형

appkey: 판매자의 Appkey, 구별하다 가맹점의 다양한 업체

seller_id: 가맹점 Weibo ID

out_pay_id: 가맹점 주문번호, 가맹점 웹사이트 고유번호, 6~64자리

notify_url: 비동기 알림 주소

return_url: 결제 완료 후 콜백 페이지 주소

subject: 제품 이름

total_amount : 센트의 제품의 총 가격 : 바디 : 제품 설명

재림 값 : 없음



콜 예 :




weibojs.invoke ( "Cashier", {
sign_type : "RSA",
기호: "",
appkey: "",
Seller_id: ,
out_pay_id: "",
inform_url:"",
return_url:"",
제목:"",
body:""
 total_amount:,
}, function(params){
 safeAlert(JSON.stringify(params));
});

상태 코드 목록
상태 코드는 action操Ok: 성공적인 작업
Missing_params: 필요한 매개변수 부족
illegal_access: 불법 호출
Internal_error: 클라이언트 처리 오류
ACTION_NOT_FOUND: 클라이언트가 이를 인식하지 못함 Action
no_result: 클라이언트가 결과를 얻지 못함
USER_CANCELLED: The 사용자가 작업을 취소했습니다
SERVICE_FORBIDDEN: 관련 서비스가 활성화되거나 금지되지 않습니다(예: 위치 서비스, 사진 앨범 권한)

웹페이지에서 콜백 코드 값을 위 값과 비교하여 처리합니다



if (code == WeiboJS.STATUS_CODE.NO_RESULT) {
// 클라이언트가 결과를 얻지 못했습니다
}

WeiboJS.on()

때때로 네이티브는 일부 이벤트 알림을 웹 페이지에 보내고 웹 페이지는 이를 선택적으로 받을 수 있습니다.

WeiboJS.on('networkTypeChanged', function(params){
document.write('네트워크 상태가 변경되었습니다:' + params.network_type);
});

이벤트 목록

networkTypeChanged 네트워크 상태 변경

- 반환 결과:

  • `network_type`: 변경된 상태, `wwan` 또는 `wifi` 또는 `fail`


menuItemSelected 브라우저 메뉴 항목 선택

- 결과 반환 :

  • `selected_code`: 사용자가 선택한 버튼에 해당하는 코드입니다. 알 수 없는 버튼은 0입니다. 일반 버튼은 부록 2를 참조하세요.
  • `selected_title: 사용자가 선택한 버튼의 제목


orientationChange 화면 회전 이벤트

- 사용 조건: 없음

- 반환 결과:

  • `orientation`: 화면 방향 상태, 즉 window.orientation 값


공유 주소록 구성 요소 [화이트 신청 필요] 목록】

공유 주소록 구성 요소는 접속 당사자가 현재 Weibo 사용자의 Weibo 배송 주소를 얻기 위해 사용됩니다. 현재 내부 평가판 단계에 있으며 모든 액세스 당사자에게 공개되지 않습니다.

구성 요소는 두 가지 형태로 제공됩니다.

PC 버전:

address_web.png

H5 버전:

address (1).png


첫 번째 단계는 공유 주소록 구성 요소를 사용하는 것입니다. 이 구성 요소를 사용하려면 신청이 필요합니다.

두 번째 단계는 코드 개발입니다. 공유 주소록 구성 요소는 호출을 위한 두 가지 작업을 제공합니다:


PC 버전 호출 방법: (여기를 클릭할 수도 있습니다)

1 기본 배달 주소 가져오기

App.trigger('deliverAddress:default', function(addr) ){ /* 콜백 함수*/ });


2. 다른 배송 주소 선택(주소 추가, 삭제, 수정 가능)

App.trigger('deliverAddress:change', function(addr){ /* 콜백 함수*/ });


전체 웹 버전 호출 예:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" / >
  <title>공유 주소록 구성 요소 웹 버전</title>
</head>
<body>
  <div id="address">배송 주소를 읽는 중...< /div>;
                                                                                                                                 ; var address = $("address");
if(addr == NULL) {
address.innerhtml = "기본 수신 주소 없음";
} else {
address.innerhtml = addr.name+"+addr. mobile+" "+addr.address; // 현재 로그인한 사용자의 기본 배송 주소 가져오기
                                                                                        사용 using using ' ' s ' 사용            out out through off through off ‐ to ‐‐‐‐‐‐ 및
주소').Onclick = 함수() {
App.Trigger('배송주소:변경', 표시주소)
& & lt;/script & gt; /& Lt;/html & gt;


H5 버전 호출 방법:


1. 기본 배송 주소 가져오기

WeiboJS.invoke("deliverAddress:default", {}, function(addr){ /* 콜백 함수*/ });


2 , 다른 배송 주소 선택(주소 추가, 삭제, 수정 가능)

WeiboJS.invoke("deliverAddress:change", {}, function(addr){ /* 콜백 함수*/ });


Complete H5 에디션 호출 예시: l & lt;! html & gt;

& lt; head &
& lt; 공유 & gt; 주소록 구성 요소 H5 버전</title>
</head>
<body>
                                                           ~;
<script src="http://tjs.sjs.sinajs.cn/open/thirdpart/js/pageapp/mobile/jsapi.js" charset="utf-8"></script> ;
                                                                                                                                                           ; // 주소 구성 요소에서 반환된 주소를 표시합니다#🎜 🎜# function showAddress(addr){
var address = $("address");# 🎜🎜# if(addr == null ){
address .innerHTML = "기본 배송 주소 없음";
                                                           ~                                                                     현재 사용자의 기본 배송 주소에 로그인되어 있습니다
weibojs.invoke("배송 주소: DEFAUL T", {}, 쇼드레스 );
🎜🎜#🎜🎜 当前 当前 当前 当前 当前 当前 当前 当前, 지역 클릭, 지역 클릭, 지역 클릭, 지역 클릭, 지역 클릭, 지역 클릭 주소 구성 요소 선택 인터페이스 번영#🎜 🎜#$ ('주소'). Onclight = function () {
weibojs.invoke ("deliveraddress: Change", {}, showaddress);
};#🎜 🎜#                                                                           

Light App H5 하단 가이드 [화이트리스트 신청 필요]

Light App은 이제 Weibo 클라이언트 개체 텍스트 페이지의 내장 브라우저에 표시됩니다(하단에 좋아요 버튼이 있음). 다음과 같은 특정 결함:

  • 내부 페이지 공유를 지원하지 않습니다. 예를 들어, 애플리케이션에 개체가 있는 경우 개체의 링크를 클릭하면 iframe이 개체가 아닌 URL로 이동합니다. 이때 앞으로 클릭하면 해당 개체의 정보가 계속 공유됩니다. 방금 들어왔어.
  • 맞춤형 공유 카피라이팅은 지원되지 않습니다. 앞으로 클릭하여 호출된 게시자의 경우 복사본이 고정되어 수정할 수 없습니다.
  • 사용자 정의 가능성이 낮음

현재 Light App은 HTML+JavaScript로 구현된 H5 하단 탐색 구성 요소를 제공합니다. 현재 개체 텍스트 페이지 하단 탐색 UI와 거의 동일하지만 내부 페이지 공유 및 카피라이팅을 지원할 수 있습니다. 원하는 대로 사용자 정의할 수 있습니다. 현재 내부 평가판 단계에 있으며 모든 액세스 당사자에게 공개되지 않습니다.

h5nav.jpg

액세스 방법:


첫 번째 단계는 라이트 애플리케이션 H5 하단 가이드를 사용하는 것입니다. 이 구성 요소를 사용하려면 애플리케이션 키를 wanglei25@staff.weibo.com으로 보내주세요.

두 번째 단계는 내부 페이지 공유를 지원해야 하는 페이지에 모바일 버전의 Light 애플리케이션 구성 요소 JS를 도입하는 것입니다.

<script src="http://tjs.sjs.sinajs.cn/open/thirdpart/js/pageapp/mobile/jsapi.js" charset="utf-8"></ script>

이때 컴포넌트를 직접 보실 수 있습니다.

세 번째 단계는 기본 공유 복사본을 수정하는 것입니다.

WeiboJS.invoke('bottomNavigation:info', {
"title" : "내 공유 사본, 원하는 대로 쓰세요, 하하"
}, function(){});

전체 예:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title> </title>
</head>
<body>
<script src="http://tjs.sjs.sinajs.cn/open/thirdpart/js/pageapp/mobile/jsapi.js" 문자 집합 ="utf-8"<</script>
                                                                                                                                  
              }, 기능(){});
                                    ~                                                        ​ 


전체 호출 예:
함수 showWeiboRun(데이터){

문서.쓰기( JSON.stringify(data))}WeiboJS.invoke("weiboRun", {}, showWeiboRun);

Light 앱 보상 구성 요소


전체 호출 예:
WeiboJS.invoke("reward", {"display" : "oid","seller" : ""," oid" : "","show_url" : "","share" : ""}, function (params, 성공, 코드) {

if (성공) { // 뭔가를 하세요. } else { Alert(params .msg); }

});

Light Application H5 구성 요소 데모

Weibo 클라이언트를 사용하여 아래 QR 코드를 스캔하여 데모 데모를 확인하세요.


8aafa3b9jw1ex8m3pmehrj204k04j0t5.jpg


데모와 관련된 인터페이스에 대한 자세한 내용은 다음 문서를 참조하세요.


Weibo 결제 애플리케이션 액세스 가이드: http://open.weibo.com/wiki/Weibo 결제 애플리케이션 액세스 가이드


Weibo API 인터페이스 문서: http://open.weibo.com/wiki/%E5%BE % AE%E5%8D%9AAPI

Appendix 1. 서명 방법

참고: appsecret 및 티켓의 보안을 보장하려면 서버 측에서 다음 단계를 완료해야 합니다

오픈 플랫폼 인터페이스 호출 , appkey 및 appsecret을 전달하여 티켓 생성:

POST https://api.weibo.com/oauth2/js_ticket/generate?client_id=APPKEY&client_secret=APPSECRET
返回值:
{
    "result":true,
    "appkey":"",
    "js_ticket":"",     // 获取到的 ticket
    "expire_time":7199  // ticket 的有效时间(秒)
}

참고:

유효 기간 내에 이 인터페이스를 다시 호출하면 티켓이 새로 고쳐지고 이전 티켓은 직접 무효화됩니다. 따라서 제3자는 티켓이 만료되기 직전에 서버에 티켓을 캐시하고 인터페이스 변경을 다시 요청해야 합니다. 서명 문자열 생성:

签名字符串 = "jsapi_ticket=[TICKET]&noncestr=[NONCESTR]&timestamp=[TIMESTAMP]&url=[URL]"

참고: 로드된 실제 주소에 따라 URL 매개변수를 실시간으로 업데이트하세요. 현재 웹뷰 중:

[TICKET] : 이전 단계에서 얻은 티켓 [NONCESTR]: 임의 문자열, 구성 값과 일치해야 함 [TIMESTAMP]: 현재 UNIX 타임스탬프는 구성의 값과 일치해야 합니다. [URL]: 현재 페이지의 전체 URL(URL 인코딩 없음, # 및 조각 없음)

sha1 알고리즘을 사용하여 서명 생성

签名 = sha1(签名字符串)

부록 2, 메뉴 인코딩

Weibo: 1001친구 서클: 1002

비공개 메시지: 1003

WeChat 친구: 1004

순간: 1005

마이크로친구: 1006

마이크로서클: 1007

친구: 1008

뉴스: 1009

Q Q:1010

Qzone: 1011

SMS : 1101

이메일: 1102

시스템 브라우저: 2001

링크 복사: 2002

글꼴 크기 설정: 2003