본문으로 건너뛰기
黯羽轻扬매일 조금씩

온라인에 올릴 �� 없는 미니프로그램

무료2017-05-20#Toy#小程序类目审核#小程序案例#小程序demo#小程序审核规则

미니프로그램이 소형 App 을 완벽하게 대체하고 플랫폼의 자연스러운 홍보에 의존할 수 있을 것 같지만, 개발 완료 후 온라인에 올릴 수 없다는 것을 발견했습니다

서론

여전히自用의 RSSHelper 입니다. 원래 미니프로그램으로 크로스플랫폼을 실현하고 ionic 을 버리려고 했지만, 나중에 온라인에 올릴 수 없다는 것을 발견했습니다

零.주의사항

온라인에 올리고 싶은 미니프로그램을 만들 준비가 있다면, 반드시 다음 몇 가지를자세히 확인하십시오:

1.콘텐츠가 카테고리 심사를 통과할 수 있는가

1 급 분류는 택배우정, 교육, 출행, 생활서비스, 외식, 관광, 도구, 상업서비스, 체육으로, 더 세분화되지만, 적절한 카테고리를 찾을 수 없다는 것을 발견합니다...

따라서 가능한 한 빨리 DEMO 를 만들어 심사에 제출하고 콘텐츠가 합법적인지 확인하십시오. 한 달 동안 열심히 일한 후에 온라인에 올릴 수 없다는 것을 발견해서는 안 됩니다

2.기능 및 상호작용이 요구를 만족시킬 수 있는가

예를 들어 사용자 정보 가져오기, 위치정보, 오디오비디오, 파일, 나침반 블루투스 가속기 등, 언급된 이것들은 모두 지원되지만, 어느 정도 지원되는지, 어떤 제한이 있는지는 문서 를 통해 이해해야 하며, DEMO 검증까지 필요합니다

절반까지 만든 후에 XXX 기능을 지원하지 않는다는 것을 발견하면, 번거로워집니다

예를 들어 현재H5 페이지 표시를 지원하지 않습니다. 미니프로그램에서 직접 표시 (webview 임베딩 등) 할 수도 없고, 브라우저로 점프하여 열 수도 없습니다. 정보류 App 에게는 극대한 제한입니다

自用의 미니프로그램을 만들고 싶어도 위의 문제를 고려해야 합니다. 온라인에 올리지 않으면自用도 허용되지 않기 때문입니다 (미리보기에는 유효기간 제한이 있으며, 30 분 정도입니다)

一.제한

1.인터페이스

미니프로그램 인터페이스는HTTPS를 강제 요구합니다:

设置/服务器域名

request 合法域名
socket 合法域名
uploadFile 合法域名
downloadFile 合法域名

서비스 인터페이스 화이트리스트는 HTTPS 도메인만 가능하며, 그렇지 않으면 IDE 개발 환경에서도 요청을 보낼 수 없습니다. 인터페이스가 아직 HTTP 라면, 임시로 가짜 데이터를 사용할 수밖에 없으며, 로컬 mock 서비스도 사용할 수 없습니다. 엄격한 도메인 검증이 있기 때문입니다

따라서 첫 번째 일은 인터페이스가 HTTPS 를 지원하는지 확인하는 것입니다. 지원하지 않는다면, 가능한 한 빨리 서비스를 이전하십시오. 그렇지 않으면 가짜 데이터로 각종 인터페이스를 시뮬레이션해야 하며, 비교적 번거롭고, 게다가 실제 요청과 다르므로 문제를 일찍 발견하는 데 불리합니다

P.S.무료 HTTPS 에 대해서는, [nginx HTTPS 역방향 프록시](/articles/nginx-https 反向代理/) 를 참조할 수 있습니다

2.bundle 크기

소스 코드 및 리소스 패킹 후 크기는2M를 초과할 수 없습니다. 이미지 리소스가 많지 않은 순수 수공 프로젝트라면 괜찮지만, 다음과 같은 경우:

  • 이미지 리소스가 매우 많음

  • 일부 서드파티 lib 에 의존

  • 프로젝트 규모가 큼 (코드량)

1 급 페이지 첫 스크린 이미지 리소스가 매우 많다면, 압축 외에는 더 좋은 방법이 없습니다. 비 1 급 페이지 첫 스크린 이미지는 서버側に 배치할 수 있습니다. 서드파티 lib 은 가능한 한 적게 사용하십시오. 2M 제한 하에서, 서드파티 lib 도입은 신중하게 고려해야 합니다. 프로젝트 자체가 매우 방대하여, 예를 들어 수십만 행 코드량이라면, gg, 이는 대프로그램입니다

P.S.bundle 크기가 2M 를 초과하면, 컴파일 패키지를 제출할 수 없으며, 파일을 삭제하고 재시도하라는 메시지가 표시됩니다

3.계정 타입 및 인증

公众号 관리 방식과 같으며, 개인호, 기업호, 인증 여부 등을 구분합니다:

卡券接口 要求認証
開放 플랫폼 바인딩 미니프로그램 개발자 자격 인증 요구

P.S.개인公众号든 개인 미니프로그램이든, 인증할 수 없습니다. 돈을 낼 기회조차 주지 않습니다

구독호와 기업호의 차이와 비교하여, 미니프로그램의 제한은 적어졌습니다. 카드 쿠폰 API 에만 제한이 있습니다. 公众号가 미니프로그램을 바인딩하는 것에 대해서는, 엄격한 제한이 없습니다 (계정 타입 및 인증 여부를 제한하지 않지만, 수량 제한이 있습니다)

또한, 개인公众号는 미니프로그램을 등록할 수 없습니다 (미니프로그램을 연결하고, 진입구를 제공할 수는 있습니다). 따라서 어쩔 수 없이 또 이메일 계정을 만들었습니다

暫不支持個人/미디어/정부/기타 조직의 빠른 미니프로그램 생성. 일반 프로세스에 따라 등록을 완료하십시오.

4.콘텐츠 심사

2 부분으로 나뉩니다. 카테고리 심사와 기능 심사입니다

온라인에 올리기 어려운 가장 주된 이유는카테고리 심사입니다. 현재 일부 App 타입만 지원하며, 제한은 상상보다 훨씬 크며, 현재는 정보 조회, 주문 등에 집중되어 있는 것 같습니다

카테고리 심사는 협의의 여지가 없습니다. 심사 결과가 해당 카테고리를暂时 개방하지 않는다고 명확히 지적하면, 먼저 포기할 수밖에 없습니다

기능 심사는 테스트 제출입니다. 상호작용이 우호적이지 않음, 기능을 사용할 수 없음, 너무 단순함 등은 모두 거절될 수 있는 이유이지만, 코드 수정으로 해결할 수 있는 문제는 당연히 문제가 아닙니다

5.재귀 템플릿을 지원하지 않음

템플릿을 선언하고 인용:

<template name="node">
  <text>{{node.text}}</text>
  <block wx:for="{{node.children}}">
    <template is="node" data="{{item}}"></template>
  </block>
</template>

<template is="node" data="{{node}}"></template>

트리형 데이터를 표시하고 싶음:

node: {
  text: 1,
  children: [{
    text: 2
  }, {
    text: 3,
    children: [{
      text: 4
    }]
  }]
}

결과는 1 만 표시되고, 재귀적으로 아래로 표시되지 않아, 무한 계층 구조를 표시해야 하는 시나리오를 만족시킬 수 없습니다

HTML 파싱 렌더링 문제를 해결하기 위해, 누군가가 어리석은 방법을 생각했습니다. n 개의 템플릿을 복사하여, 순서대로 중첩:

<template name="node-level0">
  <text>{{node.text}}</text>
  <block wx:for="{{node.children}}">
    <template is="node-level1" data="{{item}}"></template>
  </block>
</template>

// copy node-level1
// copy node-level2
// copy node-level3
// ...

이렇게 몇 부를 복사하느냐에 따라 몇 층까지 지원할 수 있습니다. 단점은 템플릿 파일이 거대해지고, 유지���수도 문제이지만, 현재는더 좋은 방법이 없습니다

二.프로젝트 Demo

시도 후 이러한 구조를 채택했습니다:

common/
  cache/        메모리 캐시, 영속 캐시
  components/   공용 컴포넌트
  pages/        공용 페이지
    detail/
    list/
  request.js    인터페이스 포장
config/         상수 설정
image/
pages/          각 독립 페이지
  tab1/
  tab2/
utils/
<3rdLib>/       서드파티 의존
app.js          엔트리
app.json        애플리케이션 레벨 설정
app.wxss        애플리케이션 레벨 스타일

페이지 선언 문제에 주의해야 합니다:

  • 모든 독립 페이지는, 반드시 app.json 의 pages 에 경로를 선언해야 합니다

  • pages 의 첫 항목은 홈 페이지이며, 후속으로 페이지를 증감할 때는 모두 pages 설정을 수정해야 합니다

  • tabBar 의 첫 항목은 반드시 홈 페이지와 일치해야 합니다. 그렇지 않으면 tabBar 가 표시되지도 않고 에러도 보고되지 않습니다

설정 관련 몇 가지 문제는, 에러 보고가 전혀 없어, 조사가 매우 어렵습니다

HTML 지원 라이브러리 (999 개의 별, HTML 표시 요구가 매우 왕성함을 나타냄) 를 사용했습니다. HTML 을 파싱하고, 미니프로그램 네이티브 컴포넌트로 변환하여 표시하는 책임이 있습니다

현재는 그다지 완벽하지 않으며, 파싱 결과 태그 수가 매우 많습니다 (iOS 에서 뚜렷한 성능 문제는 발견되지 않았지만, 분명 최적화 여지가 있습니다). 또한, pre, code, span 등의 지원 효과가 비교적 불량하여, 코드 표시 효과가 좋지 않습니다. 서비스 측에서 코드를 이미지로 변환할 수 있으며, 일노영일입니다. 또는 수동으로 해당 라이브러리를 완성할 수 있습니다 (구조는 매우 간단하여, 확장이 쉽습니다)

인터페이스가 HTTPS 가 된 후, 3 일 만에 개발 완료했습니다. 사진은 다음과 같습니다:

[caption id="attachment_1398" align="alignnone" width="625"]wx_RSSHelper_1 wx_RSSHelper_1[/caption]

[caption id="attachment_1399" align="alignnone" width="625"]wx_RSSHelper_2 wx_RSSHelper_2[/caption]

三.개발 체험

장점:

  • 일整套의 개발 디버그 도구가 매우 완비 (디버그 체험이 매우 좋음)

  • CSS 지원성이 매우 좋음 (H5 에서 가져온 스타일은, 기본적으로 직접 사용 가능)

  • ES6 개발 환경

  • 비즈니스 프레임워크가 받아들이기 쉬움 (데이터 바인딩 등의 템플릿 문법은 vue 와 유사)

단점:

  • IDE 가 매우 사용하기 어려움

  • 문서가 불완전 (누른 상태 스타일을 어떻게 구현하는지 등, 문서가 전혀 없음)

  • 온라인에 올리기 어려움 (이상한 카테고리 심사, 정확한 카테고리를 찾기 어려움, 심사 효율이 일반적)

  • 설정화가 너무 높아 유연성이 없음 (일부 기능은 설정 항목을 통해서만 완성 가능, 예를 들어 tab 조, 비교적 힘듦)

댓글

아직 댓글이 없습니다

댓글 작성