>  기사  >  웹 프론트엔드  >  uniapp은 어떻게 공유 매개변수를 얻나요?

uniapp은 어떻게 공유 매개변수를 얻나요?

PHPz
PHPz원래의
2023-04-19 14:13:583060검색

소셜 트래픽이 점진적으로 증가함에 따라 공유 기능은 현대 APP의 필수 기능 중 하나가 되었습니다. APP를 개발하는 과정에서 공유 매개변수를 얻는 방법은 공유 기능 개발의 중요한 단계입니다. 유니앱 개발자의 경우 공유 매개변수를 얻는 방법은 두 가지가 있는데, 이에 대해 아래에서 자세히 소개하겠습니다.

1. uni-app mpx(미니 프로그램)에 포함된 공유 기능을 통해 매개변수 가져오기

uniapp 개발 시 mpx에는 작은 프로그램 공유에 포함된 기능을 포함하여 작은 프로그램 개발에 필요한 많은 기능이 포함되어 있습니다. 기능. uniapp 개발자는 이 기능을 사용하여 공유 매개변수를 빠르고 쉽게 얻을 수 있습니다.

  1. pages.json 파일에 공유해야 할 페이지를 추가하세요

pages.json 파일에 공유해야 할 페이지의 경로를 아래와 같이 추가하세요.

 "pages": [
        {
            "path": "pages/index/index",
            "style": {}
        },
        {
            "path": "pages/share/share",
            "style": {},
            "navigationBarTitleText": "分享页面"
        }
    ],
  1. 미니 프로그램 설정 각각의 공유 구성

페이지에서는 onShareAppMessage 기능을 통해 미니 프로그램의 공유 매개변수를 설정할 수 있습니다. 샘플 코드는 다음과 같습니다.

onShareAppMessage: function () {
  return{
    title:"分享标题",
    path:"/pages/share/share",
    imageUrl:"分享图片地址",
    success:function(res){
      console.log('分享成功')
    },
    fail:function(res){
      console.log('分享失败')
    }
  }
}

이 샘플 코드를 통해 공유 제목, 공유 경로, 공유 이미지 주소를 설정할 수 있고, 공유 성공 또는 실패 후에도 해당 작업을 수행할 수 있음을 알 수 있습니다.

  1. 공유 페이지에서 공유 매개변수 가져오기

공유 페이지에서는 uni.mp의 API를 통해 공유 매개변수를 가져올 수 있습니다. 샘플 코드는 다음과 같습니다.

import uni from 'uni.mp'

export default {
  created() {
    uni.getShareInfo(function(res) {
      console.log(res)
    })
  }
}

이 샘플 코드에서는 uni.mp.getShareInfo() API를 사용하여 공유 매개변수를 얻는 것을 확인할 수 있습니다.

2. 미니 프로그램의 wx 객체를 통해 공유 매개변수 얻기

uniapp에서는 공유 매개변수를 직접 얻기 위해 미니 프로그램의 API를 사용할 수 있습니다. 마찬가지로 미니 프로그램의 wx 객체를 사용하여 공유 매개변수를 얻을 수도 있습니다. 사용 방법에 대한 자세한 소개는 다음과 같습니다.

  1. pages.json 파일에 공유해야 하는 페이지의 경로를 추가합니다

위 방법과 비슷하게, 공유해야 하는 페이지의 경로를 Pages.json 파일에 추가해야 하고, 예:

    "pages": [
        {
            "path": "pages/index/index",
            "style": {}
        },
        {
            "path": "pages/share/share",
            "style": {},
            "navigationBarTitleText": "分享页面"
        }
    ],
  1. 공유 매개변수를 다음으로 설정하세요. onShareAppMessage() 함수에서

공유해야 하는 페이지에서 onShareAppMessage() 함수를 사용하여 아래와 같이 공유 매개변수를 설정하세요.

onShareAppMessage: function () {
    return {
        title: '分享标题',
        path: '/pages/share/share',
        imageUrl: '分享图片地址'
    }
}

In 이 예에서는 공유 제목, 공유 경로 및 공유 지도 주소도 설정할 수 있습니다.

  1. wx.getShareInfo()를 통해 공유 매개변수 가져오기

공유 페이지에서 wx.getShareInfo()를 사용하여 공유 중 암호화된 데이터를 얻은 후 미니 프로그램의 복호화 기능을 사용하여 데이터를 복호화합니다.

// 获取分享参数
onLoad: function(options) {
   var that = this;
   //获取分享加密数据
   wx.getShareInfo({
      shareTicket: options.shareTicket,
      success: function(res) {
         //解密数据
         wx.request({
            url: '',
            data: {
              "encryptedData": res.encryptedData,
              "iv": res.iv,
              "sessionKey": that.data.sessionKey
            },
            success: function(res) {
              console.log(res.data);
            }
         })
      }
   })
}

이 샘플 코드에서는 wx.getShareInfo()를 사용하여 암호화된 공유 데이터를 얻은 다음 공식을 사용하여 이를 해독하여 공유 매개변수를 얻습니다.

요약

위의 두 가지 방법을 통해 우리는 쉽게 공유 매개변수를 얻고, 우리만의 공유 기능을 구현할 수 있습니다. 구체적인 구현 과정에서 공유 기능의 정상적인 사용을 보장하기 위해 몇 가지 세부 사항에 주의를 기울여야 합니다. 동시에 uniapp은 개발 프로세스 중 언제든지 보고 사용할 수 있는 매우 포괄적인 API 문서도 제공합니다.

위 내용은 uniapp은 어떻게 공유 매개변수를 얻나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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