質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Cordova

Cordovaは様々なデバイスで使うことができるオープンソースなモバイル用開発プラットフォームです。開発者に各デバイスの元のプラットフォームで開発する必要をなくし、HTML・JavaScript・CSSなどの一般的なウェブのテクノロジーを使ってすべてのデバイスで展開することができるモバイルのアプリケーションを生成することを可能にします。

iOS

iOSとは、Apple製のスマートフォンであるiPhoneやタブレット端末のiPadに搭載しているオペレーションシステム(OS)です。その他にもiPod touch・Apple TVにも搭載されています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Monaca

「Monaca」はiOS、Android、Windows向けのアプリ開発に対応した、Cordovaベースのモバイルアプリ開発プラットフォームです。HTML5、JavaScriptといったWeb標準技術を用いてモバイルアプリ開発を行うことができます。

Q&A

0回答

1023閲覧

【cordova-plugin-camera】【ios】フォトライブラリからPNG画像またはJPG画像を選択したときに拡張子を判別してencodingTypeを変更したい

todayyy

総合スコア31

Cordova

Cordovaは様々なデバイスで使うことができるオープンソースなモバイル用開発プラットフォームです。開発者に各デバイスの元のプラットフォームで開発する必要をなくし、HTML・JavaScript・CSSなどの一般的なウェブのテクノロジーを使ってすべてのデバイスで展開することができるモバイルのアプリケーションを生成することを可能にします。

iOS

iOSとは、Apple製のスマートフォンであるiPhoneやタブレット端末のiPadに搭載しているオペレーションシステム(OS)です。その他にもiPod touch・Apple TVにも搭載されています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Monaca

「Monaca」はiOS、Android、Windows向けのアプリ開発に対応した、Cordovaベースのモバイルアプリ開発プラットフォームです。HTML5、JavaScriptといったWeb標準技術を用いてモバイルアプリ開発を行うことができます。

0グッド

0クリップ

投稿2021/06/10 23:47

編集2022/01/12 10:55

実現させたいこと

フォトライブラリから画像を選択したときに拡張子を判別してencodingTypeを変更することは可能でしょうか?
.jpgならencodingTypeをCamera.EncodingType.JPEGに変更、.pngならencodingTypeをCamera.EncodingType.JPEGに切り替えできるようにしたいです。

該当のソースコード

javascript

1function button_click(){ 2 //カメラプラグインのオプション 3 var camera_option = { 4 //画質のクオリティ 5 quality : 100, 6 //データURLで取得 7 destinationType : Camera.DestinationType.FILE_URL, 8 //デバイスの画像フォルダを開く 9 sourceType : Camera.PictureSourceType.PHOTOLIBRARY, 10 //静止画像のみ 11 mediaType : 0, 12 } 13 //カメラフォルダを起動 14 navigator.camera.getPicture(photo_library_onsuccess, photo_library_onerror , camera_option); 15 } 16 //カメラプラグイン成功時に呼び出されるコールバック関数 17 function photo_library_onsuccess(data_url){ 18 19 //FILE_URL 20 text.textContent = data_url.slice(88, 999); 21 var url = (cordova.platformId == "ios") ? window.WkWebView.convertFilePath(data_url) : data_url; 22 console.log(url); 23 image.src = url; 24 25 //DATA_URL 26 /* 27 url = "data:image/png;base64," + data_url; 28 text.textContent = url.slice(0, 50); 29 image.src = url; 30 */ 31 } 32 //カメラプラグイン失敗時に呼び出されるコールバック関数 33 function photo_library_onerror(error){ 34 alert(error); 35 } 36

試したこと

encodingTypeを設定せずデフォルトのJPEGになるとしてライブラリからPNG画像を選択し試したところ、FILE_URL、DATA_URL両方ともjpgとして表示されました。成功時のコールバック関数が実行される前に判別する必要があるのでしょうか?

イメージ説明イメージ説明

全体のコード

HTML

1<!DOCTYPE HTML> 2<html> 3<head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover"> 6 <meta http-equiv="Content-Security-Policy" content="default-src * data: gap: content: monaca-app: https://ssl.gstatic.com; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'"> 7 <script src="components/loader.js"></script> 8 <script src="lib/onsenui/js/onsenui.min.js"></script> 9 10 <link rel="stylesheet" href="components/loader.css"> 11 <link rel="stylesheet" href="lib/onsenui/css/onsenui.css"> 12 <link rel="stylesheet" href="lib/onsenui/css/onsen-css-components.css"> 13 <link rel="stylesheet" href="css/style.css"> 14 15 <script> 16 function button_click(){ 17 //カメラプラグインのオプション 18 var camera_option = { 19 //画質のクオリティ 20 quality : 100, 21 //データURLで取得 22 destinationType : Camera.DestinationType.FILE_URL, 23 //デバイスの画像フォルダを開く 24 sourceType : Camera.PictureSourceType.PHOTOLIBRARY, 25 //静止画像のみ 26 mediaType : 0, 27 } 28 //カメラフォルダを起動 29 navigator.camera.getPicture(photo_library_onsuccess, photo_library_onerror , camera_option); 30 } 31 //カメラプラグイン成功時に呼び出されるコールバック関数 32 function photo_library_onsuccess(data_url){ 33 34 //FILE_URL 35 text.textContent = data_url.slice(88, 999); 36 var url = (cordova.platformId == "ios") ? window.WkWebView.convertFilePath(data_url) : data_url; 37 console.log(url); 38 image.src = url; 39 40 //DATA_URL 41 /* 42 url = "data:image/png;base64," + data_url; 43 text.textContent = url.slice(0, 50); 44 image.src = url; 45 */ 46 } 47 //カメラプラグイン失敗時に呼び出されるコールバック関数 48 function photo_library_onerror(error){ 49 alert(error); 50 } 51 52 if (ons.platform.isIPhoneX()) { 53 document.documentElement.setAttribute('onsflag-iphonex-portrait', ''); 54 document.documentElement.setAttribute('onsflag-iphonex-landscape', ''); 55 } 56 </script> 57</head> 58<body> 59 <ons-navigator id="nav" page="page1.html"></ons-navigator> 60 <template id="page1.html"> 61 <ons-page id="page1"> 62 <button class="button" onclick="button_click();">file url</button> 63 <div><img style="width:90%; margin: 14px; object-fit:contain" id="image"></div> 64 <p id="text"></p> 65 </ons-page> 66 </template> 67</body> 68</html> 69

### 概要
開発環境は Monaca
Cordovaのバージョン:10.0.0
端末: iPhoneX 14.6です

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問