JavaScriptでBasic認証を付けたPOSTリクエストを送る


JavaScriptでPOSTリクエストを送りたいです。  
サーバ側から要求されたヘッダー情報は以下の通りです。

  * Basic認証
  * 'Accept'は'application/json'
  * 'Content-Type'は'application/json'
  * 'Content-Length'は'*'
  * bodyとしてJSON形式のemail  
それで、自分のコードです。

[code]     var btn = document.getElementById('btn');

    
    btn.addEventListener( 'click' , function() {
    
        var clientId = "*自分のID*";
        var clientSecret = "*自分のPW*";
        var data = { email:"*自分のemail*" };
    
        var authorizationBasic = window.btoa(clientId + ':' + clientSecret);
    
        var request = new XMLHttpRequest();
        request.open('POST', '*サーバURL*');
        request.setRequestHeader('Authorization', 'Basic ' + authorizationBasic);
        request.setRequestHeader('Accept', 'application/json');
        request.setRequestHeader('Content-Type', 'application/json');
        //request.setRequestHeader('Content-Length', '*');
        request.send(JSON.stringify(data));
    
        request.onreadystatechange = function () {
            if (request.readyState === 4) {
                alert(request.responseText);
            }
        };
    
    } );
    
[/code]

HTMLで実行してもMACのターミナルで実行してもうまく行かないんですが、どこが間違っているんでしょうか？  
(HTMLで実行したときChromeではヘッダーとしてContent-Lengthを設定することはできないそうで、そこはコメントアウトしています。)

ちなみに、HTMLで実行したら以下のエラーでした。

[code]

    No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. The response had HTTP status code 404
    
[/code]




Basic認証は下記URIでリクエスト出来ます。

[code]

    http://user:password@example.com/
    
[/code]

click イベントハンドラ内で適切なURIを作成し、`XMLHttpRequest.prototype.open`
の第二引数に指定すれば実装可能だと思います。

