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

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

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

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

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

Q&A

1回答

4348閲覧

JavaScript、PHP間の画像受け渡しについて

chie_y

総合スコア20

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

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

0グッド

1クリップ

投稿2016/12/26 05:29

いつもお世話になっております。

今、PHPスクリプトからGoogle Cloud Visionを呼び出す処理を作成しています。画像はWebページからJavaScriptでPHPに送信したいと思っています。しかし、encode周りではないかと思うのですが、Google Cloud Vision側から以下のエラーが返ってきてしまいます。

JSON

1{ 2 "responses": [ 3 { 4 "error": { 5 "code": 3, 6 "message": "image-annotator::Bad image data.: Image processing error!" 7 } 8 }] 9}

PHPに画像を送るJavaScriptプログラムは以下の通りです。

JavaScript

1 var b64 = ImageToBase64(img, "image/jpeg"); 2 $.ajax ({ 3 type: "POST", 4 url: "php/ocr.php", 5 data: "data=" + b64, 6 contentType: false, 7 processData: false, 8 9 // Method when calling ocr.php was successed. 10 success: function(data, dataType) 11 { 12 // Show the data 13 console.log(data); 14 $("#source_text").html(data); 15 var text = "It is snow today"; 16 translateText(text); 17 }, 18 // Method when calling ocr.php was failed. 19 error: function(XMLHttpRequest, textStatus, errorThrown) 20 { 21 // Display error message. 22 alert('Error : ' + errorThrown); 23 } 24 }); 25 26function ImageToBase64(img, mime_type) { 27 // New Canvas 28 var canvas = document.createElement('canvas'); 29 canvas.width = img.width; 30 canvas.height = img.height; 31 // Draw Image 32 var ctx = canvas.getContext('2d'); 33 ctx.drawImage(img, 0, 0); 34 // To Base64 35 return canvas.toDataURL(mime_type); 36}

そして、Google Cloud Vision APIを呼び出すPHPスクリプトは以下の通りです。

PHP

1$api_key = "my-api-key" ; 2 3$image_data = $_POST["data"]; 4$image = base64_decode($image_data); 5 6// Feature Type 7$feature = "TEXT_DETECTION"; 8 9$param = array("requests" => array()); 10// $item["image"] = array("content" => base64_encode($image)); 11$item["image"] = array("content" => $image_data); 12$item["features"] = array(array("type" => $feature, "maxResults" => 1)); 13$param["requests"][] = $item; 14 15$json = json_encode($param); 16 17$curl = curl_init() ; 18curl_setopt($curl, CURLOPT_URL, "https://vision.googleapis.com/v1/images:annotate?key=" . $api_key); 19curl_setopt($curl, CURLOPT_HEADER, true); 20curl_setopt($curl, CURLOPT_CUSTOMREQUEST, "POST"); 21curl_setopt($curl, CURLOPT_HTTPHEADER, array("Content-Type: application/json")); 22curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false); 23curl_setopt($curl, CURLOPT_RETURNTRANSFER, true); 24curl_setopt($curl, CURLOPT_TIMEOUT, 15); 25curl_setopt($curl, CURLOPT_POSTFIELDS, $json); 26$res1 = curl_exec($curl); 27$res2 = curl_getinfo($curl); 28curl_close($curl); 29 30$json = substr($res1, $res2["header_size"]); 31$array = json_decode($json, true); 32 33echo $json;

PHPスクリプトで固定の画像ファイルをGoogle Cloud Visionに送ったら正常に値が取得できたので、おそらく画像データが正しく処置できていないのではないかと思うのですが、行き詰まってしまいました。

お知恵を拝借できればと思います。
よろしくお願いします。

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

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

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

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

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

guest

回答1

0

いきなり img が使われていますが、どこから来ているのか分かりません。
$.ajax の送信データ、PHPでの $_POST を確認してみてはどうでしょうか?

投稿2016/12/26 15:41

退会済みユーザー

退会済みユーザー

総合スコア0

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

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

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

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問