uniappでは画像をアップロードする機能をよく使いますが、デフォルトではアップロードした画像のファイル名が変更されたり、プラットフォームが異なるとパフォーマンスが異なり、バックエンド処理とフロントエンド表示の両方に影響を与えます。 . かなりの問題を引き起こします。したがって、開発中は、アップロードされたイメージの名前を変更しない必要があることがよくあります。
この記事では、uniappでアップロードした画像の名前を変更しない方法を紹介します。
1. はじめに
uniapp では、画像のアップロードには主に uni.uploadFile() の API インターフェースを使用します。このインターフェイスを通じて、画像をサーバーにアップロードできます。ただし、uni.uploadFile() はさまざまなプラットフォームや特別なファイル命名規則に従って画像ファイルに名前を付けるため、アップロードされた画像を適切に処理できなくなります。では、uni.uploadFile() を使用するときに、アップロードされた画像の名前を変更しないようにするにはどうすればよいでしょうか?
2. アップロードされた画像の元の情報を取得する
画像の元の情報を取得し、uni.chooseImage() API を通じて画像を選択するときにファイル名とサフィックスを取得できます。インターフェース。
uni.chooseImage({ count: 1, success: function(res) { uni.getImageInfo({ src: res.tempFilePaths[0], success: function(infoRes) { //文件名 var fileName = res.tempFilePaths[0].substring(res.tempFilePaths[0].lastIndexOf('/') + 1); //后缀名 var extName = fileName.substring(fileName.lastIndexOf('.')); } }); } });
3. formData オブジェクトを使用して画像をアップロードします
以前は uni.uploadFile() インターフェイスを使用して画像をアップロードしていましたが、このインターフェイスの file パラメーターはファイル パスとファイル パスのみを受け入れることができます。 FormData オブジェクトを受信できません。 this.formData では、FormData オブジェクトを作成し、アップロードされた画像のファイル名をファイル データとともにアップロードできます。
uni.chooseImage({ count: 1, success: function(res) { uni.getImageInfo({ src: res.tempFilePaths[0], success: function(infoRes) { //文件名 var fileName = res.tempFilePaths[0].substring(res.tempFilePaths[0].lastIndexOf('/') + 1); //后缀名 var extName = fileName.substring(fileName.lastIndexOf('.')); // 将文件数据赋值到formData对象中 this.formData = new FormData(); this.formData.append('file', res.tempFiles[0].path, fileName + extName); console.log('开始上传文件') uni.uploadFile({ url: '上传文件的url', filePath: res.tempFilePaths[0], name: 'file', formData: this.formData, success: function (res) { console.log(res); } }); } }); } });
上記の方法により、アップロードした画像の名前を変更しないで済みます。
4. まとめ
uniappで画像をアップロードする際、画像の元情報を取得することでファイル名と拡張子を取得し、ファイル名とデータを一緒にアップロードすることができます。これにより、さまざまなプラットフォームや特別な命名規則によって引き起こされる問題が解決され、アップロードされた画像をより適切に処理できるようになります。
以上がuniapp によってアップロードされた画像の名前は変更されません。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

この記事では、モバイルプラットフォームとWebプラットフォームのデバッグ戦略について説明し、Android Studio、Xcode、Chrome Devtoolsなどのツールを強調し、OSとパフォーマンスの最適化全体で一貫した結果を得るためのテクニックについて説明します。

この記事では、Hbuilderx、Wechat開発者ツール、Chrome Devtoolsなどのツールに焦点を当てたUniapp開発のためのデバッグツールとベストプラクティスについて説明します。

この記事では、複数のプラットフォームにわたるUNIAPPアプリケーションのエンドツーエンドテストについて説明します。テストシナリオの定義、Appiumやサイプレスなどのツールの選択、環境のセットアップ、テストの書き込みと実行、結果の分析、インテグラートをカバーします

この記事では、ユニット、統合、機能、UI/UX、パフォーマンス、クロスプラットフォーム、セキュリティテストなど、UNIAPPアプリケーションのさまざまなテストタイプについて説明します。また、クロスプラットフォームの互換性を確保し、JESのようなツールを推奨しています

この記事では、過剰なグローバルデータの使用や非効率的なデータバインディングなど、UNIAPP開発における一般的なパフォーマンスアンチパターンについて説明し、これらの問題を特定して緩和してアプリのパフォーマンスを向上させる戦略を提供します。

この記事では、プロファイリングツールを使用して、Uniappのパフォーマンスボトルネックを識別および解決し、セットアップ、データ分析、最適化に焦点を当てています。

この記事では、Uniappでネットワーク要求を最適化するための戦略について説明し、遅延の削減、キャッシュの実装、および監視ツールを使用してアプリケーションのパフォーマンスを向上させることに焦点を当てています。

この記事では、圧縮、レスポンシブデザイン、怠zyなロード、キャッシング、およびWebP形式の使用を通じて、Webパフォーマンスを向上させるために、Uniappの画像の最適化について説明します。


ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

PhpStorm Mac バージョン
最新(2018.2.1)のプロフェッショナル向けPHP統合開発ツール

SAP NetWeaver Server Adapter for Eclipse
Eclipse を SAP NetWeaver アプリケーション サーバーと統合します。

MinGW - Minimalist GNU for Windows
このプロジェクトは osdn.net/projects/mingw に移行中です。引き続きそこでフォローしていただけます。 MinGW: GNU Compiler Collection (GCC) のネイティブ Windows ポートであり、ネイティブ Windows アプリケーションを構築するための自由に配布可能なインポート ライブラリとヘッダー ファイルであり、C99 機能をサポートする MSVC ランタイムの拡張機能が含まれています。すべての MinGW ソフトウェアは 64 ビット Windows プラットフォームで実行できます。

VSCode Windows 64 ビットのダウンロード
Microsoft によって発売された無料で強力な IDE エディター

ホットトピック









