クロスドメインのAjax通信でセッションを維持する - Qiita
xxxx.net と api.xxxx.net の間でアカウント認証を行い、セッションIDをクッキーで書き込んでもらう際にハマった話。 xxxx.net のログインページのフォームにアカウント名とパスワードを入力し、api.xxxx.net のWebAPIにAjaxを使用して送信する。 HKUser.signin = function(form, callback) { var postdata = form.serialize(); $.ajax({ type:"POST", async:true, dataType:"json", cache:false, url:"https://api.xxxx.net/1/user/signin", data:postdata, success:function(data) { ..... }, error:function(error) { .
XMLHttpRequestでBasic認証の付いているサーバーに対しapiを叩く | teratail
laravelで作成したapiをjsのXMLHttpRequestを使って叩こうとしています。 サーバー側とクライアント側は違うサーバーで運用しており、共にbasin認証がかけてあります。 サーバー側 laravelを使って作成しています。 Corsの許可をおこなっているmiddlewareは以下です。 php 1// middleware/Cors.php 2 public function handle($request, Closure $next) 3 { 4 return $next($request) 5 ->header('Access-Control-Allow-Origin','*') 6 ->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS') 7 ->header('Acce
post()：postメソッド(成功はdone、失敗はfail)による非同期通信 - jQuery無双
postメソッド(成功はdone、失敗はfail)による非同期通信の書式 $.post({ url: リクエスト送信先のURL, data: URLのクエリ（パラメータ）, }).done(function(data, textStatus, jqXHR){ // 成功の場合の処理 }).fail(function(jqXHR, textStatus, errorThrown){ // エラーの場合処理 }); postメソッド(成功はdone、失敗はfail)による非同期通信する場合は、 postメソッドを使用します。 具体例(postメソッド(成功はdone、失敗はfail)による非同期通信のサンプルコード) リクエストの送信先のテスト用のPHP １．受け取ったリクエストタイプの判定 ２．ajax通信にて受け取ったパラメータを各変数に代入 ３．このパラメータはmethod（非同期通信で
JavaScript入門者必見！Promiseの基礎の基礎を解説！(then, all, get) | 侍エンジニア塾ブログ | プログラミング入門者向け学習情報サイト
Promiseについての基礎から実践までをしっかりと理解することで、JavaScriptの非同期処理に対する不安を解消できますね。しかし、実際に使いこなすには、さらに多くの実践的なスキルが必要です。特にWeb制作の現場では、生成AIを活用した新しいスキルセットが求められています。実務で役立つノウハウを身につけたい方には、実践的な学びの場が重要です。 この機会に、生成AIとWeb制作を組み合わせたスキルを習得し、収益化の道を探ってみませんか？セミナーを通じて、即戦力となるスキルを手に入れ、将来のキャリアに活かせる方法を見つけてください。まずはセミナーの詳細を確認して、自分に合った学びの一歩を踏み出しましょう。 「Promise」とは？ まず最初に「Promise」を理解するための基本的な知識から学習していきましょう。 重要な概念である「同期処理・非同期処理」の理解と、「コールバック」について
GitHub - JakeChampion/fetch: A window.fetch JavaScript polyfill.
If you believe you found a bug with how fetch behaves in your browser, please don't open an issue in this repository unless you are testing in an old version of a browser that doesn't support window.fetch natively. Make sure you read this entire readme, especially the Caveats section, as there's probably a known work-around for an issue you've found. This project is a polyfill, and since all moder
fetch API でも POST したい！ - Qiita
fetch API でも POST したい！ ちなみに fetch API は WHATWG HTML Living Standard で定義されていて、W3C HTML 5.1 でもなければ ECMAScript2017 でもないです。 2017年現在 Safari や IE では未サポートなので https://github.com/github/fetch などの polyfill を使うと良いです。 post (application/x-www-form-urlencoded) const obj = {hello: "world"}; const method = "POST"; const body = Object.keys(obj).map((key)=>key+"="+encodeURIComponent(obj[key])).join("&"); const head
jQueryでJSONをPOSTしてJSONのレスポンスを受け取る
よくある要件だと思うんだけど、検索してもHTTPの仕様（主に上りと下りそれぞれのcontent-typeのこと）についてよく理解した上で書かれていそうな良い情報が上位に出てこないので自分用にメモしておく。 Tweet 2013年8月16日 嶋田大貴 <form class="form-horizontal"> <div class="control-group"> <label class="control-label" for="name">お名前</label> <div class="controls"> <input id="name" type="text" value="山田 太郎"/> </div> </div> <div class="control-group"> <label class="control-label" for="age">年齢</label> <div
お疲れさまXMLHttpRequest、こんにちはfetch - Qiita
Service Workersでプッシュ通知を受信できるようになったわけですが([1]: GCM)([2]: Web Push)、Chromeではバージョン48まではGCMで通知だけができるようになっただけで、メッセージ本体は通知を受けてからService Workerでサーバから改めて受け取るような実装をする必要があったりします。 ここで、Service Workersでは、XMLHttpRequestが使えません。その代わり、XMLHttpRequest (以下、XHR)に代わるWHATWGの仕様としてFetch APIがあり、Service WorkersではこのFetch APIを使うことになっていますので、その使い方を簡単に紹介します。 Fetch API自体は、Service Workers専用のものではなく、メインスレッドでもXHRの代わりに使うことが可能です。現時点で実装し
ファイルアップ時に進捗を表示する方法 | ScrapEngineer
ファイルアップ時に進捗を表示する方法を紹介致します。 UI的にかっこ良くなりますし、ファイルのアップロード状況がわかるのはとっても嬉しいですね 以前の記事の2つを応用した方法で可能となります。 ドラッグ & ドロップでファイルをアップロードする方法 HTML5 進捗状況を表示するプログレスバーを使ってみる 下の画像が完成した機能です。 HTML5 進捗状況を表示するプログレスバーを使ってみるから変更点があるのはJavascript、HTML側。 ちょこちょこ変わっていますが重要なところをハイライトにしています。 Javascript HTMLサンプル <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>ファイルのアップロード</title> <script src="http://ajax.googleapis.com/a
【PHP】Ajaxによる通信（リクエスト）かどうか判定する方法
リクエストのログを記録していくときにjQueryのajax通信を使う場合は除外したかったので、サーバー側で判別する方法を調べたメモ。 環境変数のHTTP_X_REQUESTED_WITHを見れば分かるみたい。サーバーサイド（PHP）のサンプルコードは下のような感じ。 /** * Ajaxによるリクエストかどうか * * @return boolean True or False */ public function isAjax() { if(isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest'){ return true; } return false; } これで判断できるのはjQueryがajax通信をするときのリクエス
Ajax - jQuery 入門
jQuery を利用することで Ajax (エイジャックス) のコードもかなり簡易化することが可能です。 一般には Ajax を利用するに際して jQuery を利用する動機としてはブラウザの違いを吸収するということに加えて、ネットワークを介する呼び出しとなることから煩雑になりがちなエラー処理をスマートに行うということがあげられます。 ここでは具体例を通して使い方をみていきます。 jQuery 1.8 以降でそれ以前の Ajax メソッド (success, error, complete) は deprecated というステータスになりました。 こちらの新しい Ajax 利用方法を参考にしてください。 サーバーから HTML を取得して、 div 要素にセットする ここではボタンをクリックした時に、バックエンドでサーバーから HTML 文書を取得し、その HTML をそのまま div
jQuery ValidationプラグインでAjaxを使ってremoteバリデーションする - morolicious開発日記
jQuery Validation Plugin jquery.validate.js フォームのバリデーションにとても便利なjQueryプラグインですが、Ajaxを使った時にちょっとハマったのでメモ。 例えばユーザー名が使われているかチェックする時にクライアントサイドのチェックだけでは実装出来ないのでサーバに問い合わせる必要があります。 jQuery Validation Pluginではremoteを設定する事でデフォルトではonkeyup（一文字入力するごと）毎にサーバ側にリクエストしてチェックしてくれます。 コードサンプル ※Bootstrapを使っているのでCSSへの適応も考慮されています。 HTML <form id="join-form"> <div class="control-group"> <input id="username" name="username" typ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
axiosのパラメータ指定方法まとめ - Qiita
[archived] axiosを乗りこなす機能についての知見集 - Qiita![[archived] axiosを乗りこなす機能についての知見集 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/8c424582d13409a522f9b41ee0f7b5111a38fdc3/backend=imagemagick;height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-1150d8b18a7c15795b701a55ae908f94.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark%3Dhttps%253A%252F%252Fqiita-user-contents.imgix.net%252F~text%253Fixlib%253Drb-4.0.0%2526w%253D840%2526h%253D380%2526txt%253D%25255Barchived%25255D%252520axios%2525E3%252582%252592%2525E4%2525B9%252597%2525E3%252582%25258A%2525E3%252581%252593%2525E3%252581%2525AA%2525E3%252581%252599%2525E6%2525A9%25259F%2525E8%252583%2525BD%2525E3%252581%2525AB%2525E3%252581%2525A4%2525E3%252581%252584%2525E3%252581%2525A6%2525E3%252581%2525AE%2525E7%25259F%2525A5%2525E8%2525A6%25258B%2525E9%25259B%252586%2526txt-color%253D%252523333%2526txt-font%253DHiragino%252520Sans%252520W6%2526txt-size%253D54%2526txt-clip%253Dellipsis%2526txt-align%253Dcenter%25252Cmiddle%2526s%253D9fd6ce4b873b0d9b4303be66ddf96230%26mark-align%3Dcenter%252Cmiddle%26blend%3Dhttps%253A%252F%252Fqiita-user-contents.imgix.net%252F~text%253Fixlib%253Drb-4.0.0%2526w%253D840%2526h%253D500%2526txt%253D%252540terrierscript%2526txt-color%253D%252523333%2526txt-font%253DHiragino%252520Sans%252520W6%2526txt-size%253D45%2526txt-align%253Dright%25252Cbottom%2526s%253Ded893b7eabdaa75da91d28680de5bf50%26blend-align%3Dcenter%252Cmiddle%26blend-mode%3Dnormal%26s%3Dd9427075b852d6cdee41a35d51f55c6f)
it-swarm.dev
https://tech.kurojica.com/archives/38740/
https://qiita.com/tyfkda/items/6d1cc91aec325491238c
https://qiita.com/tyfkda/items/5c82a4c28ae21c7c758d
http://www.jqueryhelp.net/
jQuery.Deferredを使って楽しい非同期生活を送る方法 - Qiita
