クレデンシャル(Cookie)を利用してCORSエラーを解決したい

Question

ScrapboxというサービスのAPIに，AjaxのGET通信でアクセスしたいのですが，CORSエラーによってうまくいきません．

こちらの記事によると，ScrapboxはCookieにクレデンシャル(認証情報)がセットされるため，それを利用すればデータを取得できるとのことでした．
Cookie自体は取得できたのですが，これをAjaxでどのように渡せば良いのかがわかりません．
Ajaxでのクレデンシャルの渡し方について，ご教授いただけると大変助かります．

今の所，以下のようなコードを書いて実行してみましたが，通信に失敗しています．

const api_url = '***';

$.ajax({
    type: "GET",
    url: api_url,
    xhrFields: {
        withCredentials: true
    }
}).done(function (data, textStatus, jqXHR) {
    console.log("done");
}).fail(function (jqXHR, textStatus, errorThrown){
    console.log("failed");
});

Answer 1

参照されている記事の方法は、JavaScriptでは使えない方法です。
記事のやり方は、認証状態のCookieを取得して、Pythonのスクリプトソース上に埋め込んでいます。
JavaScriptの場合、Cookieはスクリプトから指定することはできません（参考）。質問文のコードに記載されたwithCredentials: trueは、ブラウザに元々セットされているCookieをAJAXでも送信するという指定ですが、仮にCookieがブラウザ側にセットされていても、API側で許可がなければ使えません。
ということで、この方法は諦めるしかないと思います。他の方法ではできるかもしれませんが、JavaScript用に用意されたAPIでないと難しいと思います。

Comments

[mi_ho]

ご回答ありがとうございます！大変助かります！
CookieはAjaxで送信できないのですね…．
axiosを使用してCookieを送信するという事例( https://scrapbox.io/meganii/Scrapbox_API%E3%81%A7Private_Project%E3%81%AE%E3%83%87%E3%83%BC%E3%82%BF%E3%82%92%E5%8F%96%E5%BE%97%E3%81%99%E3%82%8B )をみたことがあったので，てっきりAjaxでも可能なのかと思っていました????

[ockeghem]

参照されている記事は、JavaScriptではありますが、ブラウザからではなく、node.jsのような端末から直接起動する場合を想定しているのだと思います。このままではAjaxでは使えませんが、しかるべき認証をブラウザ側で行ってCookieがブラウザにセットされた状態であればできるかもしれません。但し、その場合でも、API側でCORS上の許可が必要です。詳しくはAPIのマニュアルを参照ください。