web-dev-qa-db-ja.com

HTMLフォームまたはAhrefで認証ヘッダーを設定する方法

私はこのコードを持っています:

            $.ajax({
                url: "http://localhost:15797/api/values",
                type: 'get',
                contentType: 'application/json',
                headers: {
                    "Authorization": "Bearer " + token
                }
            })

正常に動作しますが、Ajaxを使用せずにそれを実行したいので、次のようなものが必要です。

        <form action="http://localhost:15797/api/values" method="get">
            <input type="hidden" name="headers[Authorization]" value="Bearer token" />
            <input type="submit" />
        </form>

出来ますか?それとも、XMLHttpRequestなしでそのようなことをするだけですか?どうやって?

5
Andre

HTTPリクエストヘッダーでAuthorization引数を送信する必要があります。これは、OAuthフローによって課されます。もちろん、OAuthサーバーのコードですが、OAuthサーバーのコードを制御できない場合、それは不可能です。

したがって、質問に答えると、フォームに投稿されたデータと一緒に送信することはできません。ただし、明らかに、それらを非表示フィールドに配置し、JSコードを記述してフィールドから読み取り、リクエストヘッダーに配置することができます。

例えば.

HTML:

<input id="tokenField" type="hidden" />
<input id="submitButton" type="button" />

Javascript:

$('#submitButton').on('click',function(){
    $.ajax({
          url: "http://localhost:15797/api/values",
          type: 'GET',
          contentType: 'application/json',
          headers: {
                    "Authorization": "Bearer " + $('#tokenField').val()
                 },
          async: false
            }});

async: falseは、送信と同じように、呼び出しを同期させることに注意してください。また、他のデータをサーバーに送信する必要がある場合は、type: 'GET'type: 'POST'に変更し、dataという名前の別のフィールドを追加して、フォームデータをその値に渡すことができます。

<input id="firstName" type="text" />
<input id="lastName" type="text" />
<input id="tokenField" type="hidden" />
<input id="submitButton" type="button" />

$('#submitButton').on('click',function(){
    $.ajax({
          url: "http://localhost:15797/api/values",
          type: 'POST',
          data: { 
                  firstName: $('#firstName').val(),
                  lastName: $('#lastName').val()
                },
          contentType: 'application/json',
          headers: {
                    "Authorization": "Bearer " + $('#tokenField').val()
                 },
          async: false
            }});
8
akazemis