Imgur APIをAngular4で使用する

Imgur APIを使用しているWebアプリケーションを開発中ですが、問題があります。私の目標は、ユーザーが写真を選択してimgurにアップロードし、画像が保存されたリンクを保存するというフォームを作成することです。Imgur APIをAngular4で使用する

しかし、私は2つの問題があります：画像を「保存」するにはどうすればよいですか？現在、私は、「変更」プロパティを使用していると私はこれでそれを格納しています：

this.file = event.srcElement.files

が、これは正しい方法ですか？

次に、イメージをAPIに送信する際に問題が発生しています。

var headers = {'Authorization': 'Client-ID {{id-here}}'}; 
this.http.post(url, payload, headers) 
        .toPromise() 
        .then(response => { 
         console.log(response); 
         response.json() as string; 
        }) 
        .catch(this.handleError);

サーバーは401 - 未承認です。私はおそらく間違った方法でクライアントIDを読み込んでいますが、どうすればいいのかわかりません。

ペイロードと同じですが、どのように宣言しますか？

ありがとうございました！

出典

2017-08-24 Caramelo

承認ヘッダーが実際に送信されているかどうか確認しましたか？そうでない場合は、開発者パネル（ctrl + shift + i）に移動し、[ネットワーク]タブに切り替えて呼び出します。 [ヘッダー]タブを見て、あなたのリクエストを見つけて、API呼び出しの 'リクエストヘッダー'を調べ、 'Authorization'ヘッダーが含まれているはずです。それがなければ、さらにコード分析を行う必要があります。 – pcarrara

まだAPIドキュメントに達していない場合はこちらをご覧ください。 https://apidocs.imgur.com/ご覧のとおり、クライアントIDをお持ちの場合は、公開されている読み取り専用リソースへのAPI呼び出しを既に行うことができます。 – pcarrara

ええ、許可が送信されていませんでした。既にそれを修正しました、ありがとう！ – Caramelo

pcarraraのおかげで、私は何が間違っていたかを並べ替えることができました。

このようなヘッダを宣言する必要があります：

var headers = new Headers({'authorization': 'Client-ID clientid'});

次に、このようにそれを送信：私は解決策を掲載

<input type="file" name="image" id="image" #fileInput> 

    @ViewChild('fileInput') inputEl: ElementRef; 
    let inputEl: HTMLInputElement = this.inputEl.nativeElement; 
    this.file = inputEl.files.item(0);

を使用して写真を読み込む

this.http.post(imgurl, photo, {headers: headers})

を誰かが同じ問題を抱えている場合に備えて。 :)

出典

2017-08-27 22:45:17 Caramelo

Imgur APIをAngular4で使用する

答えて

関連する問題