WeChat 제품 페이지에 대한 WeChat 매장 점프 인터페이스를 개발하는 방법

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

WeChat 스토어

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

wx.openProductSpecificView({

    productId: '', // 商品id

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

});

wx.openProductSpecificView({

---

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

});

 

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

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

< /td >

jweixin-1.1.0.js는 WeChat jsapi를 호출하는 라이브러리이므로 import해야 합니다. 두 번째 줄은 이 경우에는 jquery를 사용하기 때문입니다. 둘째, jquery 라이브러리는 여러 섹션의 인터페이스 케이스 스타일이 너무 보기 흉하기 때문에 인터페이스를 아름답게 만듭니다.

wx.config({  
    debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。  
    appId: '${appId}', // 必填，公众号的唯一标识  
    timestamp: '${ timestamp}' , // 必填，生成签名的时间戳  
    nonceStr: '${ nonceStr}', // 必填，生成签名的随机串  
    signature: '${ signature}',// 必填，签名，见附录1  
    jsApiList: ['checkJsApi',
                'chooseImage',
                'previewImage',
                 'uploadImage',
                 'downloadImage',
                  'getNetworkType',//网络状态接口
                  'openLocation',//使用微信内置地图查看地理位置接口
                  'getLocation', //获取地理位置接口
                  'hideOptionMenu',//界面操作接口1
                  'showOptionMenu',//界面操作接口2
                  'closeWindow' ,  ////界面操作接口3
                  'hideMenuItems',////界面操作接口4
                  'showMenuItems',////界面操作接口5
                  'hideAllNonBaseMenuItem',////界面操作接口6
                  'showAllNonBaseMenuItem',////界面操作接口7
                  'scanQRCode',// 微信扫一扫接口
                  'openProductSpecificView'//微信小店
               ] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2  
});

셋째, <🎜 사이의 HTML 코드 >

넷째, <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+"/";
%>


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

     
微信扫一扫
      调起微信扫一扫接口
      scanQRCode(微信处理结果)
      scanQRCode(直接返回结果)
     
界面操作接口


      隐藏右上角菜单接口

      hideOptionMenu

      显示右上角菜单接口

      showOptionMenu

      关闭当前网页窗口接口

      closeWindow

      批量隐藏功能按钮接口

      hideMenuItems

      批量显示功能按钮接口

      showMenuItems

      隐藏所有非基础按钮接口

      hideAllNonBaseMenuItem

      显示所有功能按钮接口

      showAllNonBaseMenuItem

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

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

      openLocation

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

      getLocation

     获取网络状态接口

      getNetworkType

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

      chooseImage

      预览图片接口

      previewImage

      上传图片接口

      uploadImage

      下载图片接口

      downloadImage

  

  显示图片
  

  
  

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

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