2017-10-09 28 views
6

apiには、認証のためにjwtが使用されています。私はこのアプリをvuejsアプリに使っています。私はimg srcリンクの承認ヘッダー

<img src="my/api/link" /> 

を使用してアプリで画像を表示しようとしています。しかしapiはそれでjwt tokenAuthorizationヘッダーを期待しています。

このようなブラウザリクエストにヘッダーを追加することはできますか(ここでのいくつかの質問への回答は、それが不可能だと思っています)?

jsを使用する方法はありますか?api自体を変更する必要がありますか?

+0

APIは画像を静的アセットとして配信する必要があります。これは、JWT認可を必要とすべきではありません。 –

+2

@MaKobiこれは、ユースケースについての大きな前提です。 OP、この質問のいくつかの関連する読書と潜在的な解決策:https://stackoverflow.com/questions/34096744/how-should-i-load-images-if-i-use-token-based-authentication – CodingIntrigue

+0

私はjwt認可が必要です画像は非公開で認証されたユーザだけが見ることができるはずです – Ragas

答えて

3

imgタグでhrefとして直接使用されている画像に対して認証を実行することはできません。このタイプの認証をイメージに実際に使用するには、ajaxを使用して取得し、htmlに埋め込む方がよいでしょう。

+0

これはまだですか?もしそうなら、この答えが受け入れられます。 –

-2

はあなたのimg

<img src="my/api/icon/my-icon.png" /> 

にstaciсパッチを使用する必要があるか、あなたのサーバーにパスを取得し、<img src= $ {} pathInServer />を使用する必要があります。それはすべてあなたのサーバーの設定に依存します。

0
<img src="/api/images/yourimage.jpg?token=here-your-token"> 

バックエンドでは、queryparamからJWTを検証します。

+0

しかし、あなたのトークンは平文で送られますね。 –