찾다
위챗 애플릿위챗 개발WeChat 제품 페이지에 대한 WeChat 매장 점프 인터페이스를 개발하는 방법

WeChat 스토어 인터페이스는 WeChat 인증 서비스 계정에 의해 승인되어야 합니다. 구독 계정에는 권한이 없습니다.

WeChat 스토어

WeChat 제품 페이지 인터페이스로 이동

wx.openProductSpecificView({

    productId: '', // 商品id

    viewType: '' // 0.默认值,普通商品详情页1.扫一扫商品详情页2.小店商品详情页

});

wx.openProductSpecificView({

productId: '', // Product id viewType: '' // 0. 기본값, 일반 상품 상세 페이지 1. 상품 상세 스캔 2 페이지 .스토어 제품 세부정보 페이지

});

<script> </script> 

먼저 새
jsp 페이지로 이동하여 js 라이브러리

<center><h3 id="欢迎来到微信jsapi测试界面-V型知识库">欢迎来到微信jsapi测试界面-V型知识库</h3></center>
    <p class="lbox_close wxapi_form">
     <h3 id="微信小店接口">微信小店接口</h3>
      <span class="desc">跳转微信商品页接口</span>
      <button class="btn btn_primary" id="openProductSpecificView">openProductSpecificView</button>
     </p>
jweixin-1.1.0.js는 WeChat jsapi를 호출하는 라이브러리이므로 import해야 합니다. 두 번째 줄은 이 경우에는 jquery를 사용하기 때문입니다. 둘째, jquery 라이브러리는 여러 섹션의 인터페이스 케이스 스타일이 너무 보기 흉하기 때문에 인터페이스를 아름답게 만듭니다.
wx.config({  
    debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。  
    appId: &#39;${appId}&#39;, // 必填,公众号的唯一标识  
    timestamp: &#39;${ timestamp}&#39; , // 必填,生成签名的时间戳  
    nonceStr: &#39;${ nonceStr}&#39;, // 必填,生成签名的随机串  
    signature: &#39;${ signature}&#39;,// 必填,签名,见附录1  
    jsApiList: [&#39;checkJsApi&#39;,
                &#39;chooseImage&#39;,
                &#39;previewImage&#39;,
                 &#39;uploadImage&#39;,
                 &#39;downloadImage&#39;,
                  &#39;getNetworkType&#39;,//网络状态接口
                  &#39;openLocation&#39;,//使用微信内置地图查看地理位置接口
                  &#39;getLocation&#39;, //获取地理位置接口
                  &#39;hideOptionMenu&#39;,//界面操作接口1
                  &#39;showOptionMenu&#39;,//界面操作接口2
                  &#39;closeWindow&#39; ,  ////界面操作接口3
                  &#39;hideMenuItems&#39;,////界面操作接口4
                  &#39;showMenuItems&#39;,////界面操作接口5
                  &#39;hideAllNonBaseMenuItem&#39;,////界面操作接口6
                  &#39;showAllNonBaseMenuItem&#39;,////界面操作接口7
                  &#39;scanQRCode&#39;,// 微信扫一扫接口
                  &#39;openProductSpecificView&#39;//微信小店
               ] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2  
});

셋째,

넷째, <script></script> 사이에 WeChat jsapi 라이브러리를 초기화하여 인터페이스

함수
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>


  
    
    
    微信jsapi测试-V型知识库
    
    
    
   
    
  
  
   <center><h3 id="欢迎来到微信jsapi测试界面-V型知识库">欢迎来到微信jsapi测试界面-V型知识库</h3></center>
    <p class="lbox_close wxapi_form">
     <h3 id="微信小店接口">微信小店接口</h3>
      <span class="desc">跳转微信商品页接口</span>
      <button class="btn btn_primary" id="openProductSpecificView">openProductSpecificView</button>
     </p>
     

微信扫一扫

调起微信扫一扫接口

界面操作接口


隐藏右上角菜单接口

显示右上角菜单接口

关闭当前网页窗口接口

批量隐藏功能按钮接口

批量显示功能按钮接口

隐藏所有非基础按钮接口

显示所有功能按钮接口

基础接口之判断当前客户端是否支持指定的js接口


地理位置接口-使用微信内置地图查看位置接口

地理位置接口-获取地理位置接口

获取网络状态接口

图像接口

拍照或从手机相册中选图接口

预览图片接口

上传图片接口

下载图片接口


显示图片

jsApiListarray에서 마지막 항목은 WeChat 스토어 인터페이스를 호출하는 데 사용하는 함수입니다. 이 함수는 jsapi 라이브러리에서 초기화되어야 합니다. 그렇지 않으면 WeChat 스토어의 함수를 사용하여 WeChat 제품 페이지로 이동합니다. 활성화할 수 없습니다. 여섯째, 완전한 jsp 페이지 코드, 독자가 직접 복사하여 실행할 수 있습니다. 위 jsp 코드에는 4개의 매개변수가 있는데, 이 4개의 매개변수는 호출에 성공합니다. WeChat jsapi 자격 증명은 appId(필수, 공식 계정의 고유 식별자), 타임스탬프(필수, 서명 생성을 위한 타임스탬프), nonceStr(필수, 서명 생성을 위한 임의 문자열), 서명(필수, 서명), 이 네 가지 매개변수를 생성하는 방법을 모르는 독자를 위해 자세한 소개가 있는 이 페이지 왼쪽 상단의 메뉴를 확인하세요. , 여기 자세히 설명할 필요가 없습니다.

위 내용은 WeChat 제품 페이지에 대한 WeChat 매장 점프 인터페이스를 개발하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

Video Face Swap

Video Face Swap

완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!

뜨거운 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

ZendStudio 13.5.1 맥

ZendStudio 13.5.1 맥

강력한 PHP 통합 개발 환경

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

Eclipse용 SAP NetWeaver 서버 어댑터

Eclipse용 SAP NetWeaver 서버 어댑터

Eclipse를 SAP NetWeaver 애플리케이션 서버와 통합합니다.