WeChat アプレットが画像をサーバーにアップロードするためのコードについて

この記事では主に、サーバーに写真をアップロードする WeChat アプレットのサンプル コードを紹介します。また、1 つまたは複数の写真をアップロードする WeChat アプレットも紹介します。 この記事では、その方法を詳しく紹介します。必要な友達は参照してください。

画像をサーバーにアップロードします。 まず、フロントエンドに画像を選択するための領域を書き込みます。 wx をトリガーするには、chooseImage インターフェイスを使用し、wx.setStorage インターフェイスを使用してイメージ パスを保存します。

-wxml
 <view class="shangchuan" bindtap="choose">
  <image style="width:100%;height:100%;" src="{{tempFilePaths}}"></image>
 </view>
 <button formType=&#39;submit&#39; class="fabu">发布项目</button>
 /**选择图片 */
 choose: function () {
  var that = this
  wx.chooseImage({
   count: 1,
   sizeType: [&#39;original&#39;, &#39;compressed&#39;], // 可以指定是原图还是压缩图，默认二者都有
   sourceType: [&#39;album&#39;, &#39;camera&#39;], // 可以指定来源是相册还是相机，默认二者都有
   success: function (res) {
    var tempFilePaths = res.tempFilePaths
    that.setData({
     tempFilePaths: res.tempFilePaths
    })
    console.log(res.tempFilePaths)
    wx.setStorage({ key: "card", data: tempFilePaths[0] })
   }
  })
 },

2. wx.uploadFile を使用して、サーバーにアップロードした画像をアップロードします

 formSubmit2: function (e) {
    var that = this
    var card = wx.getStorageSync('card')
    wx.uploadFile({
     url: app.globalData.create_funds,
     filePath: card,
     name: 'card',
     formData: {
      'user_id': app.globalData.user_id,
      'person': e.detail.value.person,
      'company': e.detail.value.company,
     },
     success: function (res) {
      console.log(res)
     }
    })
   }
  }
 },

PS: WeChat アプレットは 1 つ以上の画像をアップロードします

1重要なポイント

1. 写真を選択

2. 画像をアップロード

2.

wx.chooseImage({
   sizeType: [], // original 原图，compressed 压缩图，默认二者都有
   sourceType: [], // album 从相册选图，camera 使用相机，默认二者都有
   success: function (res) {
    console.log(res);
    var array = res.tempFilePaths, //图片的本地文件路径列表
   }
  })

以上この記事の内容はすべて、皆さんの学習に役立つことを願っています。その他の関連コンテンツについては、PHP 中国語 Web サイトに注目してください。

関連する推奨事項

WeChatアプレットは、ボタンをクリックしてフォントの色を変更する機能を実装します

WeChatアプレットは、現在位置、経度、緯度を取得し、地図を表示します

WeChatアプレット複数のファイルをダウンロードするためのシンプルなパッケージです

以上がWeChat アプレットが画像をサーバーにアップロードするためのコードについての詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。