LoginSignup
0
0

More than 1 year has passed since last update.

【JavaScript】Ajaxでメソッドを呼び出せない!【MVC】

Last updated at Posted at 2022-09-01

はじめに

どうも、ATLのヴィリアスです。

ある日、 JavaScript から MVC のコントローラーのメソッドを呼び出そうとしたところ…
image.png
メソッドが見つからないから、404エラーだよー!!」と怒られてしまいました。

それに対して、私は該当のコードを確認しましたが…

HomeController.cs
    public class HomeController : Controller
    {
        public async Task<string> GetNewTokenAsync()
        {
            .
            .
            .
        }
    }
スニペット.js
async function updateToken() {
    $.ajax({
        type: 'POST',
        url: location.origin + '/Home/GetNewTokenAsync',
        .
        .
        .
    })
}

「ん?メソッド名あってね??」となり、一悶着してしまいました。

そこでいろいろ調べた結果、最終的に私が悪かったことが判明したので、
戒めと反省と謝罪として、そのときの解決策をここに記します。

※免責事項(必ず、ご一読ください)
  本記事の情報により生じた、いかなる損害や損失についても、当社は一切の責任を負いかねます。
  また、誤情報が入り込んだり、情報が古くなったりすることもありますので、
  必ずしも正確性を保証するものではありません。ご了承ください。

まずは結論

こちらが正しい書き方でした。

スニペット.js
async function updateToken() {
    $.ajax({
        type: 'POST',
        // url: location.origin + '/Home/GetNewTokenAsync',
        url: location.origin + '/Home/GetNewToken'
        .
        .
        .
    })
}

Ajaxで指定するメソッド名 (アクション名) にAsyncはいらなかったのです!

なぜAsyncが必要ないのか?

以下によると、MVC 3.0以降では
コントローラーのメソッド名の後ろに付随するAsyncは内部で削除される仕様になっているとのこと。

これに気が付かず、
GetNewTokenAsyncが見つからないよ!」ということで404エラーが出てしまっていたんですね。

補足1: Asyncが削除されないようにするには

MVC のスタートアップ設定で、以下のコードを記述します。

Program.cs
services.AddMvc(options =>
{
   options.SuppressAsyncSuffixInActionNames = false; 
});

SuppressAsyncSuffixInActionNamesは直訳すると、
「アクション名のAsyncサフィックスを抑える」です。

つまり、「アクション名の後ろに付随するAsyncを削除する」かどうかを設定できます。
それをfalseに設定することで、Asyncの削除を無効化できるということですね。

補足2: なぜこの仕様になったのか?

Asynchronous .NET methods, by convention, end with the Async suffix. However, when a method defines an MVC action, it is generally not desirable to have the Async suffix.

「慣習的には、非同期 .NET メソッドはAsyncサフィックスをつけます。
ですが、MVC アクション名としてはAsyncサフィックスは望ましくないのです。

とのことでした。

おわりに

うーん、これは初見殺しの罠ですね。さすがに許せない。

……

冗談はさておき、
JavaScript などの外部からメソッドを呼び出す時、Asyncには要注意!」ですね。

それではまた、次の記事で。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0