Quantcast
Channel: プログラム の個人的なメモ
Viewing all 860 articles
Browse latest View live

【Ajax】【jQuery】jQueryを使ったAjax通信 ~基本編~

$
0
0

■ Ajaxに関する予備知識

クロスドメイン制約について

http://blogs.yahoo.co.jp/dk521123/35603506.html
より

 * Ajaxは、セキュリティ上の理由から、別ドメインのサーバとは通信できない制約がある

■jQueryを使ったAjax通信時のAPI

 (1) $.ajax()  : Ajax通信を行う

参考文献

上記以外のAPIについても、以下のサイトが参考になる
http://sterfield.co.jp/designer/jquery%E3%81%AE%E3%82%88%E3%81%8F%E4%BD%BF%E3%81%84%E3%81%9D%E3%81%86%E3%81%AAajax%E9%96%A2%E4%BF%82%E3%81%AEapi%E3%82%92%E3%81%BE%E3%81%A8%E3%82%81%E3%81%A6%E3%81%BF%E3%81%BE%E3%81%97%E3%81%9F.html

■jQueryを使ったAjax通信時のコールバック関数

http://blog.toshimaru.net/jquery-ajaxdeferredajax/
http://www.tohoho-web.com/js/jquery/ajax.htm
が参考になる

jQuery 1.8未満

 (1) success  : Ajax通信成功時のコールバック関数
 (2) error    : Ajax通信失敗時のコールバック関数
 (3) complete : 成功・失敗に関わらず、Ajax通信完了時のコールバック関数

jQuery 1.8以上

 (1) done  :成功時のコールバック関数(successに相当)
 (2) fail  :失敗時のコールバック関数(errorに相当)
 (3) always:通信完了時のコールバック関数(completeに相当)

 => それ以前の Ajax メソッド (success, error, complete) は非推奨になった

関連記事

Ajax あれこれ

http://blogs.yahoo.co.jp/dk521123/35577527.html

Ajaxにおけるセキュリティ

http://blogs.yahoo.co.jp/dk521123/35603506.html

ASP.NET MVC関連

ASP.NET MVC において、 Ajax でやり取りする [1]
http://blogs.yahoo.co.jp/dk521123/35578725.html
ASP.NET MVC において、 Ajax でやり取りする [2]
http://blogs.yahoo.co.jp/dk521123/35611906.html
ASP.NET MVC において、 Ajax通信中 にローディング中を表示するには...
http://blogs.yahoo.co.jp/dk521123/35781593.html

【ASP.NET MVC】【VB】【Ajax】ASP.NET MVC において、 Ajax通信中 にローディング中を表示するには...

$
0
0

■ポイント

http://blogs.yahoo.co.jp/dk521123/35577527.html
より

 * ポイントは以下の2点。
  (1) Ajax通信前に、ローディング中の処理を行い
  (2) 通信完了時のコールバック関数「always()」で消す。

 * always()について、以下の関連記事を参照のこと。
http://blogs.yahoo.co.jp/dk521123/35781333.html

■サンプル

コントローラ側

/Controllers/DemoAjaxController.vb
Imports System.Web.Mvc

Namespace Controllers
    Public Class DemoAjaxController
        Inherits Controller

        Function DemAjaxView() As ActionResult
            Return View()
        End Function

        <AcceptVerbs(HttpVerbs.Post)>
        Public Function SayHelloWorld() As ActionResult
            '3秒間(3000ミリ秒)停止する
            System.Threading.Thread.Sleep(3000)

            Return Json(New With {Key .result = "Hello World!"},
                        JsonRequestBehavior.AllowGet)
        End Function
    End Class
End Namespace

ビュー側

/Views/DemoAjax/DemAjaxView.vbhtml
<script src="@Url.Content("~/Scripts/jquery-1.10.2.js")" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
    $('#loadingHere').hide();

    $(".ajaxDemo").on("click", function () {
        // ★ローディング中★
        $('#loadingHere').show();
        $.ajax({
            type: 'POST',
            dataType: "json",
            url: '/DemoAjax/SayHelloWorld', // アクセス先のURL
        })
        .done(function (returnData) {
            $("#result").text(" Result : " + returnData.result).html();
        })
        .always(function (returnData) {
            // ★ローディング完了★
            $('#loadingHere').hide();
        });
    })
});
</script>
<style type="text/css">
.loading {
 width: 100%;
 height: 100%;
 z-index: 9999;
 position: fixed;
 opacity: 0.5;
 top: 50%;
 left: 50%;
}
</style>
@Code
    ViewData("Title") = "DemAjaxView"
End Code

<h2>Ajax Demo In ASP.NET MVC</h2>
<button id="demo" class="ajaxDemo">Click Me!</button>
<div>
    <p id="result">Result : </p>
</div>
<div id="loadingHere" class="loading">
    <img src="@Url.Content("~/Images/loading.gif")" />
</div>

関連記事

jQueryを使ったAjax通信 ~Ajax あれこれ編~

http://blogs.yahoo.co.jp/dk521123/35577527.html

jQueryを使ったAjax通信 ~基本編~

http://blogs.yahoo.co.jp/dk521123/35781333.html

【トラブル】【JavaScript】C3.jsのTooltipがXSSに対応していないので対応する

$
0
0

TooltipがXSSに対応していない

https://github.com/masayuki0812/c3/issues/1536
にあるように、グラフについては、XSSに対応しているようだが
Tooltipに関しては未対応の模様。

サンプル : XSS未対応版

alert("XSS" )が表示する
<html>
<head>
<meta charset="UTF-8">
<!-- Load c3.css -->
<link href="./c3/c3.css" rel="stylesheet" type="text/css">
<!-- Load d3.js and c3.js -->
<script src="http://d3js.org/d3.v3.js" charset="utf-8"></script>
<script src="./c3/c3.js"></script></head>
</head>
<body>
<div id="chartToDrow"></div>
<script>
var chart = c3.generate({
  bindto: '#chartToDrow',
  data: {
      columns: [
          ['data1"><img src="dummy.jpg" onerror="alert(\'XSS\')" />"', 130, 100],
          ['data2', 150, 50],
      ],
      type: 'bar'
  },
});
</script>
</body>
</html>

解決案

 * 以下の関連記事の「■ 独自のTooltipを実装するには」と「JavaScript でのサニタイジング(エスケープ)」
   を使って、修正してみる
独自のTooltipを実装するには
http://blogs.yahoo.co.jp/dk521123/35526974.html
JavaScript でのサニタイジング(エスケープ)
http://blogs.yahoo.co.jp/dk521123/35778596.html

解決案サンプル : XSS対応版

エスケープした
<script>
var chart = c3.generate({
  bindto: '#chartToDrow',
  data: {
      columns: [
          ['data1"><img src="dummy.jpg" onerror="alert(\'XSS\')" />"', 130, 100],
          ['data2', 150, 50],
      ],
      type: 'bar'
  },
  // ★ここ★
  tooltip: {
      contents: function (d, defaultTitleFormat, defaultValueFormat, color) {
        var $$ = this,
            titleFormat = defaultTitleFormat,
            nameFormat = function (name) { return name; },
            valueFormat = defaultValueFormat,
            text, i, title, value, name, bgcolor;
        for (i = 0; i < d.length; i++) {
            if (! (d[i] && (d[i].value || d[i].value === 0))) { continue; }

            if (! text) {
                title = titleFormat ? titleFormat(d[i].x) : d[i].x;
                text = "<table class='c3-tooltip" + "'>" + (title || title === 0 ? "<tr><th colspan='2'>" + title + "</th></tr>" : "");
            }

            value = valueFormat(d[i].value, d[i].ratio, d[i].id, d[i].index);
            if (value !== undefined) {
                name = nameFormat(d[i].name, d[i].ratio, d[i].id, d[i].index);
                bgcolor = $$.levelColor ? $$.levelColor(d[i].value) : color(d[i].id);
                
                var targetId = escape(d[i].id);
                text += "<tr class='c3-tooltip-name" + "-" + targetId + "'>";
                text += "<td class='name'><span style='background-color:" + bgcolor + "'></span>" + escape(name) + "</td>";
                text += "<td class='value'>" + escape(value) + "</td>";
                text += "</tr>";
            }
        }
        return text + "</table>";
      }
  },
});

function escape(targetValue) {
  if (targetValue === null || targetValue === undefined) {
     return "";
  }
  return String(targetValue)
     .replace(/&/g, "&")
     .replace(/"/g, """)
     .replace(/'/g, "'")
     .replace(/`/g, "`")
     .replace(/</g, "<")
     .replace(/>/g, ">");
}
</script>
</body>
</html>

関連記事

C3.js ~ C3.jsあれこれ ~

http://blogs.yahoo.co.jp/dk521123/35527809.html

C3.jsの見切れる問題について対応する

http://blogs.yahoo.co.jp/dk521123/35787443.html

【トラブル】【JavaScript】C3.jsの見切れる問題について対応する

$
0
0

【1】X軸のラベルが見切れる

 * 以下のC3.jsの公式ページでも発生しているのだが、
   X軸のラベルが見切れ(Cut off)てしまっている
http://c3js.org/samples/timeseries.html

サンプル

右端に注目すると、X軸のラベルが見切れてしまっている
<html>
<head>
<meta charset="UTF-8">
<!-- Load c3.css -->
<link href="./c3/c3.css" rel="stylesheet" type="text/css">
<!-- Load d3.js and c3.js -->
<script src="http://d3js.org/d3.v3.js" charset="utf-8"></script>
<script src="./c3/c3.js"></script></head>
</head>
<body>
<div id="chartToDrow"></div>
<script>
var chart = c3.generate({
  bindto: '#chartToDrow',
  data: {
      x: 'x',
      columns: [
          ['x', '2013-01-01', '2013-01-02', '2013-01-03', '2013-01-04', '2013-01-05', '2013-01-06'],
          ['data1', 30, 200, 100, 400, 150, 250],
          ['data2', 130, 340, 200, 500, 250, 350]
      ]
  },
  axis: {
      x: {
          type: 'timeseries',
          tick: {
              format: '%Y-%m-%d'
          }
      }
  }
});
</script>
</body>
</html>

解決案

解決案1 : 「padding.right」を利用する
var chart = c3.generate({
  bindto: '#chartToDrow',
  // ★ここ★
  padding: {
     right: 20
  },
  data: {
  ・・・略・・・
解決案2 : 「rotate」を利用する
http://blogs.yahoo.co.jp/dk521123/35526974.html
・・・略・・・
axis: {
    x: {
        type: 'timeseries',
        tick: {
            format: '%Y-%m-%d',
            // ★ここ★
            rotate: 85,
        }
    }
}


【2】Y軸のラベルが見切れる

 * Y軸のラベルが見切れ(Cut off)てしまうことがある
http://jsfiddle.net/DanielApt/bq17Lp02/1/

サンプル

<html>
<head>
<meta charset="UTF-8">
<!-- Load c3.css -->
<link href="./c3/c3.css" rel="stylesheet" type="text/css">
<!-- Load d3.js and c3.js -->
<script src="http://d3js.org/d3.v3.js" charset="utf-8"></script>
<script src="./c3/c3.js"></script></head>
</head>
<body>
<div id="chartToDrow"></div>
<script>
var chart = c3.generate({
  bindto: '#chartToDrow',
  data: {
      json: [{'date': '2014-11-1', 'metric1': 300.2},
          {'date': '2014-11-2', 'metric1': 297},
          {'date': '2014-11-3', 'metric1': 250},
          {'date': '2014-11-4', 'metric1': 250}],

      keys: {
          x: 'date',
          value: ['metric1']
      },
      types: {
          metric1: 'spline'
      }
  },
  axis: {
      x: {
          type: 'timeseries',
          tick: {
              format: '%d-%m'
          }
      },
      y: {
          label: 'Metric is cut off yygg',
          tick: {
              count:3,
              format: function(){return''}
          }
      }
  }
});
</script>
</body>
</html>

解決案

解決案1 : 「label.position: 'xxxx-xxxxx'」を利用する
http://c3js.org/samples/axes_label_position.html
y: {
    // ★ここ★
    label: {
       text: 'Metric is cut off yygg',
       position: 'outer-middle'
    },
    tick: {
    ・・・略・・・
解決案2 : 「tick.format」を設定する
y: {
    label: 'Metric is cut off yygg',
    tick: {
        count:1,
        format: function() {return '0'}
    }
}

参考文献

http://stackoverflow.com/questions/27294144/c3js-how-to-hide-ticks-on-y-axis-y-axis-label-is-cut-off

関連記事

C3.js ~ ツールチップあれこれ ~

http://blogs.yahoo.co.jp/dk521123/35526974.html

【JavaScript】【JQuery】 JavaScript で数値のカンマ区切りを実装するには...

$
0
0

実装案

[1] toLocaleString()で実装
[2] 正規表現で実装
[3] ループで実装(他のサイト参照)
http://qiita.com/zawascript/items/922b5db574ef2b126069
http://so-zou.jp/web-app/tech/programming/javascript/grammar/data-type/string/comma-formatting.htm
[4] JavaScriptフレームワークで実装
http://www.buildinsider.net/web/angularjstips/0019
 => メリット・デメリットを踏まえて、選択した方がいい
 => ここでは、[1]と[2]を考える。

[1] toLocaleString()で実装

メリット

 * 簡単に実装できる

デメリット

 * ブラウザやバージョンによって、対応していないものや動きが変わることがあるらしい
 * 小数の場合、オプションを指定しないと小数部が3桁になる
 * Localeに基づき表示を変えるので、パソコンの設定によっては結果が変わる
http://am-yu.net/2014/11/09/number_tolocalestring/
より

このメソッド自体は昔から(IE6にも)あったようなのですが、IE10以前だと結果は下記のように、
小数点以下2桁まで記述した文字列になってしまいます。

var num = 123456789;
num.toLocaleString(); //=> "123,456,789.00"
http://qiita.com/BEMU/items/93769e7ab84f6199b23f
SafariやOpera、古いブラウザは対応していないものもあるので注意してください。

[2] 正規表現で実装

メリット

 * ブラウザ依存がなく実装できる

デメリット

 * [1]と比較すると難易度が高く、考慮する事が多い(サイトをコピペしただけでは痛い目に合う)

[考慮する事]
 数値は...

 * マイナス(-)も許容する or しない
 * 整数 or 小数
 * その他別要素(単位など)が含まるか?

サンプル

<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
</head>
<body>
<form>
<div id="sample1">[1] toLocaleString()で実装</div>
<div id="sample2">[2] 正規表現で実装</div>
Input data:<input id="textValue" type="text" size="50" value="-1234567890.1234567890">
<input id="fire" type="button" value="click me!">
</form>
<script type="text/javascript">
$("#fire").click(function(event){
  var numberValue = document.getElementById("textValue").value;
  
  // [1] toLocaleString()で実装
  document.getElementById("sample1").innerHTML = 
    Number(numberValue).toLocaleString();;
  
  // [2] 正規表現で実装
  document.getElementById("sample2").innerHTML =
    numberValue.replace(/^(-?[0-9]+)(?=\.|$)/, function(s){ return s.replace(/([0-9]+?)(?=(?:[0-9]{3})+$)/g, '$1,');});
});

</script>
</body>
</html>

出力結果

IE11 の場合
-1,234,567,890.123
-1,234,567,890.1234567890

【CSS】z-indexプロパティ / positionプロパティ

$
0
0

■z-index

 * ボックスの重なりの順序を指定する
 * 0を基準として、値が大きいものほど上になる。

注意

 [1] z-indexが効かない場合がある
http://d.hatena.ne.jp/masomi79/20131125/1385392242
より
~~~~~~~
1) 親要素がposition:static;もしくはpositionが設定されてない
2) ほかにz-indexが設定されている
3) overflow:hidden;が設定されている
~~~~~~~

 実際に経験したのは、
1) で「一方の要素には、postion:absoluteが設定されていたが、もう一方の要素には何も設定されていなかった」
若干はまってしまった。

【対策】
 * 何も設定されていない要素に対して、「postion:relative」を設定し、z-indexを設定したところ
   z-indexが効くようになった。

 [2] 重なりは、親のz-indexとも密接に関わっている。
     # 意図しない重なりがある場合は親要素を調査するといいかも。
     # 詳細な説明は以下のサイトが非常に参考になる。
https://app.codegrid.net/entry/z-index-1

■position

 * absolute : 絶対位置
 * relative : 相対位置(通常の位置を基準とした相対位置)
 * fixed : 絶対位置 + 固定(ウィンドウを基準とした絶対位置)
 * static : 通常配置(デフォルト)

参考文献

z-index

 * すごくためになった
https://app.codegrid.net/entry/z-index-1

関連記事

要素を重ねるには...

http://blogs.yahoo.co.jp/dk521123/34534679.html

【JavaScript】 可変長引数

$
0
0

可変長引数

 * arguments で行う

補足:argumentsについて

 * arguments は、配列ではなく、オブジェクト
 * Java/C#などの可変長引数とは異なり、arguments には、すべての引数の値が含まれている。
   (以下のサンプルで「if (index == 0) { continue; }」しているのは、第一引数"sample1"まで含まれてしまっている)

サンプル

<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
</head>
<body>
<form>
<div id="sample1">Result</div>
<input id="fire" type="button" value="click me!">
</form>
<script type="text/javascript">
$("#fire").click(function(event){
  sampleFunction("sample1", 1, 2, 3, 4, 5);
  
});

function sampleFunction(id) {
  var result = "";

  for (var index in arguments) {
    if (index == 0) {
      continue;
    }
    result += arguments[index] + " ";
  }
  document.getElementById(id).innerHTML = result;
}
</script>
</body>
</html>

出力結果

1 2 3 4 5 

【トラブル】【JavaScript】 scriptタグ内に "...</script>" があるとエラーになってしまう

$
0
0

現象

以下のサンプルのように、scriptタグ内に "...</script>" があると。
たとえ、ダブルクォートで囲っていても、閉じたタグとして扱われ、エラーになってしまう

# まず、静的なHTMLでわざわざこんな事しないが、
# 動的なサイトで悪意があるデータを入れられる可能性もあるので、、、

サンプル

<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<button onClick="sample()">Click me!</button>
<script>
function sample() {
   var msg = "<script>alert('Hello');</script>"
   alert(msg);
}
</script>
</body>
</html>

対処策

案1 : <\/script> でエスケープ処理する

var msg = '...... <\/script>';

案2 : (無理矢理)分割する

var msg = '...... </' + 'script>';

案3 : Unicode の\uXXXX形式にエスケープ処理する

var msg = '...... \u003c/script\u003e";;


【ASP.NET MVC】【VB】【Ajax】ASP.NET MVCのAjax通信時にValidateAntiForgeryToken を使用する [1]

$
0
0

ASP.NET MVCのAjax通信時にValidateAntiForgeryToken を使用する

 * Ajax.BeginForm()を使用する
 * 設定については、以下の関連記事を参照のこと。
http://blogs.yahoo.co.jp/dk521123/35611906.html

サンプル

コントローラ

SampleAjaxController.vb
Imports System.Web.Mvc

Namespace Controllers
    Public Class SampleAjaxController
        Inherits Controller

        ' GET: SampleAjax
        Function Index() As ActionResult
            Return View()
        End Function

        // ★ここ★
        <ValidateAntiForgeryToken()>
        Public Function SayHello(name As String) As ActionResult
            ' リクエストがAjax通信(非同期通信)である場合値を返す
            If Request.IsAjaxRequest() Then

                Return Json(New With {Key .ResultMessage = "Hello, " & name &"!"},
                        JsonRequestBehavior.AllowGet)
            Else
                ' リクエストがAjax通信以外の場合、何もしない
                Return New EmptyResult()

            End If
        End Function

    End Class
End Namespace

ビュー

Index.vbhtml
@Code
    ViewData("Title") = "Index"
End Code
<script src="~/Scripts/jquery-1.10.2.js" type="text/javascript"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.js" type="text/javascript"></script>
<script src="~/Scripts/MicrosoftAjax.js" type="text/javascript"></script>
<script src="~/Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script>
<-- ★ここ★ -->
@Using Ajax.BeginForm("SayHello",
                New AjaxOptions With {
                .HttpMethod = "POST",
                .UpdateTargetId = "result",
                .OnSuccess = "onSuccess",
                .OnFailure = "onFail"})
    @Html.TextBox("Name", "")
    @Html.AntiForgeryToken()
    @<input type="submit" value="Say Hello" />
End Using

<div id="result"></div>

<script type="text/javascript">
    function onSuccess(data) {
        $('#result').html(data.ResultMessage);
    }
    function onFail() {
        $('#result').html("Fail...");
    }
</script>



関連記事

Html.AntiForgeryToken() / ValidateAntiForgeryToken

http://blogs.yahoo.co.jp/dk521123/35641403.html

ASP.NET MVC において、 Ajax でやり取りする [2]

http://blogs.yahoo.co.jp/dk521123/35611906.html

【Excel VBA】Excelマクロで、Dictionaryを使うには...

$
0
0

設定

~~~~
Dim dic As New Dictionary
~~~~
のように使うには、「ツール」→「参照設定」で、「Microsoft Scripting Runtime」を参照設定する

それ以外は、
~~~~
Dim dic As Object
Set dic = CreateObject("Scripting.Dictionary")
~~~~

サンプル

Sub ボタン1_Click()
    ' 定数
    Const MaxRow As Integer = 5000
    Dim sheet As Worksheet
    Set sheet = Worksheets("Sheet1")
    
    ' ★注目★
    Dim countDictionary As New Dictionary
            
    For i = 1 To MaxRow
        
        If IsEmpty(sheet.Cells(i, 1).value) Then
            ' 値がない時は処理を中断
            Exit For
        End If
        
        If Not countDictionary.Exists(sheet.Cells(i, 1).value) Then
            ' 値がない時はAdd
            countDictionary.Add sheet.Cells(i, 1).value, 1
        Else
            countDictionary(sheet.Cells(i, 1).value) = countDictionary(sheet.Cells(i, 1).value) + 1
        End If
    Next
    
    Dim valueDictionary As Variant
    Dim index As Integer: index = 1
    For Each keyDictionary In countDictionary
        sheet.Cells(index, 4).value = keyDictionary
        sheet.Cells(index, 5).value = countDictionary(keyDictionary)
        index = index + 1
    Next keyDictionary
End Sub

入力データ

Tom
Tom
Mike
Tom
Mike
Smith
Kevin
Smith
Tom

出力結果

Tom	4
Mike	2
Smith	2
Kevin	1

浮動小数点と誤差

$
0
0

はじめに

 * Excel、Excelマクロ、JavaScriptなどの小数で使用すされている浮動小数で誤差が出て、
   困ったのでメモ。

浮動小数点(floating-point number)とは?

 * コンピューターで小数を扱う方式のひとつ

利点

 * 扱える範囲が広い

欠点

 * 計算時の誤差は生じやすい(詳細は下記を参照)

誤差について

 * 上記の「浮動小数点とは?」の「欠点」でも書いたが誤差が生じる

サンプル:JavaScript

* 「0.1+0.2」=>「0.30000000000000004」と表示
<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
</head>
<body>
<form>
<div id="sample1">Result</div>
Input data1:<input id="textValue1" type="text" size="50" value="0.1">
Input data2:<input id="textValue2" type="text" size="50" value="0.1">
<input id="fire" type="button" value="click me!">
</form>
<script type="text/javascript">
$("#fire").click(function(event){
  var numberValue1 = document.getElementById("textValue1").value;
  var numberValue2 = document.getElementById("textValue2").value;
  
  // [1] toLocaleString()で実装
  document.getElementById("sample1").innerHTML = parseFloat(numberValue1) + parseFloat(numberValue2);
});

</script>
</body>
</html>

参考文献

* 浮動小数点に関する説明
http://itpro.nikkeibp.co.jp/members/ITPro/ITBASIC/20020624/1/?rt=nocnt
* JavaScriptによる小数計算の誤差を無くす
http://blog.asial.co.jp/1191
* 理解度チェック
http://www.ap-siken.com/kakomon/22_haru/q2.html

【トラブル】【C3.js】Y軸のラベルが浮動小数点の誤差で表示がおかしくなる

$
0
0

■現象

 * Y軸のラベルが浮動小数点の誤差で表示がおかしくなる

サンプル

現象発生時
<html>
<head>
<meta charset="UTF-8">
<!-- Load c3.css -->
<link href="./c3/c3.css" rel="stylesheet" type="text/css">

<!-- Load d3.js and c3.js -->
<script src="http://d3js.org/d3.v3.js" charset="utf-8"></script>
<script src="./c3/c3.js"></script></head>

</head>
<body>
<div id="chartToDrow"></div>
<script>
var chart = c3.generate({
  bindto: '#chartToDrow',
  data: {
    x: 'x',
    columns: [
    ['x', 'Mike', 'Tom', 'Kevin', 'Sam', 'Ken'],
      ['score', -0.0002, -0.0002, -0.0002, -0.0002, -0.0003],
    ],
    type: 'bar',
  },
  grid: {
    y: {
      lines: [{value:0}],
    }
  },
  axis: {
    x: {
      type: 'category',
      tick: {
        multiline: false,
        rotate: 75,
      },
      height: 130
    },

  },
});
</script>
</body>
</html>
現象発生時:出力結果(Y軸)
-3.552713678800501e-20

-0.000050000000000000036

-0.00010000000000000003

-0.00015000000000000004

-0.00020000000000000004

-0.00025000000000000006

-0.00030000000000000003

解決方法

解決策1

 * axis.y.tick.values を指定する
http://stackoverflow.com/questions/32447077/how-to-format-the-values-of-c3-js-y-axis

解決策2

http://stackoverflow.com/questions/32457291/how-to-format-number-in-d3-js-c3-js
 * axis.y.tick.formatとd3.format(",.Xf")を利用する(X:数字)

~~~~~
    y: {
      tick: {
         format: function (d) {
            return d3.format(",.4f")(d).replace(/,/g, ' ');
         }
      },
    },
~~~~~

サンプル

* 解決策2
<html>
<head>
<meta charset="UTF-8">
<!-- Load c3.css -->
<link href="./c3/c3.css" rel="stylesheet" type="text/css">

<!-- Load d3.js and c3.js -->
<script src="http://d3js.org/d3.v3.js" charset="utf-8"></script>
<script src="./c3/c3.js"></script></head>

</head>
<body>
<div id="chartToDrow"></div>
<script>
var chart = c3.generate({
  bindto: '#chartToDrow',
  data: {
    x: 'x',
    columns: [
    ['x', 'Mike', 'Tom', 'Kevin', 'Sam', 'Ken'],
      ['score', -0.0002, -0.0002, -0.0002, -0.0002, -0.0003],
    ],
    type: 'bar',
  },
  grid: {
    y: {
      lines: [{value:0}],
    }
  },
  axis: {
    x: {
      type: 'category',
      tick: {
        multiline: false,
        rotate: 75,
      },
      height: 130
    },
    y: {
      tick: {
         format: function (d) {
            var val = d3.format(",.4f")(d).replace(/,/g, ' ');
            var numValue = new Number(val);
            if (numValue == 0) {
               return 0;
            } else {
               return val;
            }
         }
      },
    },
  },
});
</script>
</body>
</html>
修正後:出力結果(Y軸)
0

-0.00001

-0.00002

-0.00003

-0.00004

-0.00005

-0.00006

【JavaScript】JavaScriptにおける数値の誤差

$
0
0

誤差パターン1:64ビット倍精度の数字範囲を超える場合

 * JavaScriptの数値は「IEEE754」という規格に従って「64ビット倍精度」で行っている
  => 「64ビット倍精度」の数値範囲は、「-1.79769×10の308乗~1.79769×10の308乗」

var result1 = Math.pow(2, 55);

誤差パターン2:小数点を含む計算を行う場合

 * 浮動小数点での計算誤差

var result1 = 4.321 * 100;
var result2 = 67 - 66.9;

サンプル

<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<form>
<div id="result1_1">result1_1</div>
<div id="result1_2">result1_2</div>
<div id="result2_1">result2_1</div>
<div id="result2_2">result2_2</div>
<input id="fire" type="button" value="click me!" onClick="sample()">
</form>
<script>
function sample() {
   var result1_1 = Math.pow(2, 55);
   var result1_2 = 76287755398823936;
   var result2_1 = 4.321 * 100;
   var result2_2 = 67 - 66.9;
   
   document.getElementById("result1_1").innerHTML = result1_1;
   document.getElementById("result1_2").innerHTML = result1_2;
   document.getElementById("result2_1").innerHTML = result2_1;
   document.getElementById("result2_2").innerHTML = result2_2;
}
</script>
</body>
</html>

出力結果

Firefox / Chrome
36028797018963970
76287755398823940
432.09999999999997
0.09999999999999432
IE11
36028797018963970
76287755398823930
432.09999999999996
0.09999999999999431

対策

端数処理を行う

 * 端数処理(四捨五入、切り上げ、切り下げ)を行う

ツールを使用する

 * 以下のサイトを参照のこと。
http://laxmi759.blog.fc2.com/blog-entry-92.html
http://qiita.com/coa00@github/items/0226a6b2e1188729521b


関連記事

浮動小数点と誤差

http://blogs.yahoo.co.jp/dk521123/35833686.html

Y軸のラベルが浮動小数点の誤差で表示がおかしくなる

http://blogs.yahoo.co.jp/dk521123/35833804.html

【ASP.NET MVC】【VB】【Ajax】ASP.NET MVCでknockout.js を使った際に ValidateAntiForgeryToken を使用する

$
0
0

ASP.NET MVCでknockout.js を使った際に ValidateAntiForgeryToken を使用する

http://blogs.yahoo.co.jp/dk521123/35669223.html
をベースに、セキュリティ強化の一環で、ValidateAntiForgeryToken を使用するサンプルを考える。
ValidateAntiForgeryToken については、以下の関連記事を参照のこと。
http://blogs.yahoo.co.jp/dk521123/35641403.html

サンプル

http://stackoverflow.com/questions/2906754/how-can-i-supply-an-antiforgerytoken-when-posting-json-data-using-ajax
http://stackoverflow.com/questions/4074199/jquery-ajax-calls-and-the-html-antiforgerytoken
で記載されている方法で、とりあえず実装できた。
ただこれで本当にいいのかって疑問が残るが、ひとまず、記録として残しておく。

モデル

* SampleKnockoutModel.vb
Namespace Models
    Public Class SampleCompanyModel
        Public Property CountryId As String
        Public Property CompanyNames As List(Of ListItem)
        Public Property CompanyIds As List(Of String)
    End Class
End Namespace

ビュー

* Index.vbhtml
@ModelType WebAppli.Models.SampleCompanyModel

@Code
    ViewData("Title") = "Index"
End Code

<h2>Index</h2><br />
@Using (Html.BeginForm(
                "SendResult",
                "SampleKnockout",
                FormMethod.Post,
                New With {.id = "comForm"}))
    @Html.AntiForgeryToken()
    @Html.RadioButtonFor(Function(model) model.CountryId, "JP")
    @Html.Label("Japan")@<br />
    @Html.RadioButtonFor(Function(model) model.CountryId, "US")
    @Html.Label("USA")@<br />
    @<select multiple="multiple" name="@Html.NameFor(Function(model) model.CompanyIds)"
             data-bind="options: items, optionsText: 'Text', optionsValue: 'Value'"
             size="7" width="200"></select>
            @<input type="submit" value="Send" />
End Using

<script src="@Url.Content("~/Scripts/jquery-1.10.2.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/knockout-3.4.0.debug.js")" type="text/javascript"></script>
<script type="text/javascript">
    function ViewModel() {
        var self = this;
        self.items = ko.observableArray();
    }

    var viewModel = new ViewModel();
    ko.applyBindings(viewModel);

    var token = $('input[name="__RequestVerificationToken"]').val();
    $('input[name="CountryId"]:radio').change(function () {
        $.ajax({
            type: 'POST',
            url: '@Url.Action("GetList")', // アクセス先のURL
            data: {
                __RequestVerificationToken: token,
                id: $(this).val(),
            },
        })
       .done(function (returnData) {
           viewModel.items(returnData.results);
       });
    });
</script>
* SendResult.vbhtml
@ModelType WebAppli.Models.SampleCompanyModel

@Code
    ViewData("Title") = "SendResult"
End Code

<h2>SendResult</h2>

<p>ID : @Model.CountryId </p>

@For Each companyId In Model.CompanyIds
    @<p>Company ID : @companyId</p>@<br />
Next

コントローラ

* CompanyController.vb
Imports System.Web.Mvc
Imports WebAppli.Models

Namespace Controllers
    Public Class CompanyController
        Inherits Controller

        Private CompanyInfoDictinary As Dictionary(Of String, List(Of ListItem))

        Public Sub New()
            CompanyInfoDictinary = New Dictionary(Of String, List(Of ListItem)) From
                {
                {"JP", New List(Of ListItem) From
                {
                New ListItem() With {.Value = "J01", .Text = "Sony"},
                New ListItem() With {.Value = "J02", .Text = "Hitachi"},
                New ListItem() With {.Value = "J03", .Text = "Toshiba"},
                New ListItem() With {.Value = "J04", .Text = "Fujitsu"}
            }
            },
                        {"US", New List(Of ListItem) From
            {
               New ListItem() With {.Value = "U01", .Text = "Google"},
               New ListItem() With {.Value = "U02", .Text = "Yahoo"},
               New ListItem() With {.Value = "U03", .Text = "Microsoft"}
            }
            }
            }
        End Sub

        Function Index() As ActionResult
            Dim model = New SampleCompanyModel()
            model.CountryId = "JP"
            Return View(model)
        End Function

        <ValidateAntiForgeryToken()>
        <HttpPost>
        Function GetList(ByVal id As String) As ActionResult
            Dim sendingValues = CompanyInfoDictinary(id)
            Return Json(New With {
                        .results = sendingValues},
                        JsonRequestBehavior.AllowGet)
        End Function

        Function SendResult(ByVal model As SampleCompanyModel) As ActionResult
            Return View(model)
        End Function

    End Class
End Namespace

関連記事

ASP.NET MVCのAjax通信時にValidateAntiForgeryToken を使用する

http://blogs.yahoo.co.jp/dk521123/35813912.html

ASP.NET MVC で、 knockout.js を使う ~基本編~ [1]

http://blogs.yahoo.co.jp/dk521123/35669223.html

Html.AntiForgeryToken() / ValidateAntiForgeryToken

http://blogs.yahoo.co.jp/dk521123/35641403.html

【jQuery】jQueryプラグインを自作する

$
0
0

はじめに

 * 最近、JavaScriptばっかり書いてたので、共通処理をjQueryプラグイン化する事を考える

構文

基本

(function($) {
  $.fn.【プラグイン名】 = function() {
    
    // ここに実装する
    
    return this;
  };
})(jQuery);

引数を受け取る

(function($) {
  $.fn.【プラグイン名】 = function(params) {
    
    // (1) デフォルト値を準備
    var defaults = {
      【パラメータ名】: 【デフォルト値】,
    };
    // (2) デフォルト値に引数をマージ
    var config = $.extend(defaults, params);
    
    // ここに実装する
    
    return this;
  };
})(jQuery);

サンプル

HelloWorld.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Sample</title>
</head>
<body>
<div id="result">Here</div>
<button id="fire" />Click me!</button>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="jQuery.sample.js"></script>
<script>
$("#fire").click(function(event){
  $("#result").sample({
    text: 'Hello, World!!!!',
  });
});
</script>
</body>
</html>

jQuery.sample.js

(function($) {
  $.fn.sample = function(params) {
    
    // (1) デフォルト値を準備
    var defaults = {
      text: "Hello World!",
    };
    // (2) デフォルト値に引数をマージ
    var config = $.extend(defaults, params);
    
    this.text(config.text);
    
    return this;
  };
})(jQuery);


【ASP.NET MVC】【VB】ASP.NET MVCでknockout.js を使った際に ValidateAntiForgeryToken を使用する [2] ~決定版~

$
0
0

はじめに

http://blogs.yahoo.co.jp/dk521123/35841982.html
にて、ASP.NET MVCでknockout.js を使った際に ValidateAntiForgeryToken を使用するサンプルを作成したが
もうちょいいいサンプルができたので、メモっとく。

サンプル

http://blogs.yahoo.co.jp/dk521123/35813912.html
のサンプルをベースに作成。(コントローラは同じ。ビューだけ違う)

コントローラ

SampleAjaxController.vb
Imports System.Web.Mvc

Namespace Controllers
    Public Class SampleAjaxController
        Inherits Controller

        ' GET: SampleAjax
        Function Index() As ActionResult
            Return View()
        End Function

        ' ★ここ★
        <ValidateAntiForgeryToken()>
        Public Function SayHello(name As String) As ActionResult
            ' リクエストがAjax通信(非同期通信)である場合値を返す
            If Request.IsAjaxRequest() Then

                Return Json(New With {Key .ResultMessage = "Hello, " & name &"!"},
                        JsonRequestBehavior.AllowGet)
            Else
                ' リクエストがAjax通信以外の場合、何もしない
                Return New EmptyResult()

            End If
        End Function

    End Class
End Namespace

ビュー

Index.vbhtml
@Code
    ViewData("Title") = "Index"
End Code
<script src="@Url.Content("~/Scripts/jquery-1.10.2.js")" type="text/javascript"></script>
<script src = "@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script>
<script src = "@Url.Content("~/Scripts/MicrosoftMvcAjax.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/knockout-3.4.0.debug.js")" type="text/javascript"></script>

@Using Ajax.BeginForm("SayHello",
                            New AjaxOptions With {
                            .HttpMethod = "POST",
                            .OnSuccess = "onSuccess",
                            .OnFailure = "onFail"})
    @Html.TextBox("Name", "")
    @Html.AntiForgeryToken()
    @<input type="submit" value="Say Hello" />
End Using
<div id="result" data-bind="text: message"></div>

<script type="text/javascript">
    function SampleViewModel() {
        var self = this;
        self.message = ko.observable('Here');
    }

    var viewModel = null;
    $(function () {
        // 初期化
        viewModel = new SampleViewModel();
        ko.applyBindings(viewModel);
    });

    function onSuccess(data) {
        viewModel.message(data.ResultMessage);
    }

    function onFail() {
        viewModel.message("Fail...");
    }
</script>

関連記事

ASP.NET MVCでknockout.js を使った際に ValidateAntiForgeryToken を使用する [1] ~試作編~

http://blogs.yahoo.co.jp/dk521123/35841982.html

ASP.NET MVCのAjax通信時にValidateAntiForgeryToken を使用する

http://blogs.yahoo.co.jp/dk521123/35813912.html

Html.AntiForgeryToken() / ValidateAntiForgeryToken

http://blogs.yahoo.co.jp/dk521123/35641403.html

【ASP.NET MVC】 ASP.NET MVCで、ブラウザに、JavaScript/CSS/画像をキャッシュさせないためには...

$
0
0

はじめに

 * 開発時 や リリース後のアップデート などで、ブラウザに古いJavaScript/CSSなどがキャッシュとして
   残っていることがあり、それにより、最新版のモジュールが正しく動作しない事がある。
 * キャッシュを抑制するために、Cache-Control : no-cacheなどで対策してもダメな時が多々ある

って事で対策を考える

対策案

* 大きく分けて2点
[1] ファイル名にバージョンを付加させて管理。(例:<script src="./jquery-1.10.2.js"></script>)
  => ただし、この方法だと、リリースバージョンを切らない開発時だとキャッシュに残ってしまう
  => ソース管理している場合、バージョンごとにファイルができるのはイヤ

[2] クエリー文字列を付加する(例:<script src="./jquery.js?v=xxxxx"></script>)
  => こっちがいいかと
  => クエリー文字列に付加させる情報としては、以下のようなものが考えられる

【クエリー文字列に付加させる情報候補】
 2-1) ファイル更新日時 (例:<script src="./jquery.js?date=201602252201413111"></script>)
 2-2) 現在日付
 2-3) バージョン(例:<script src="./jquery.js?ver=1_10_2"></script>)
 2-4) ランダム数・ハッシュ値
などなど

  => 個人的には、必要時にはファイルを更新し、それ以外はキャッシュを使う方が、
     効率がいいわけなので、「2-1) ファイル更新日時」がいいと思う

 * 何故、クエリー付加させたらキャッシュクリアになるのかは以下のサイトを参照。
http://www.koikikukan.com/archives/2011/08/29-015555.php

ASP.NET MVCで実装するには?

[1] クエリー文字列にファイル更新日時を付加させる
 1-1) ビュー内で実装する
 1-2) ビュー以外(BundleConfigクラスなど)で実装する

[2] Bundles.ResolveBundleUrlメソッドを使う
    # API仕様については、以下のサイトを参照。ハッシュ値を使うらしい。
https://msdn.microsoft.com/ja-jp/library/system.web.optimization.bundlecollection.resolvebundleurl.aspx

サンプル

■ 実装1:ビュー内で実装する

@Code
    ViewData("Title") = "Index"

    ' ★ここ★
    Dim filePath = Server.MapPath(Url.Content("~/Scripts/jquery-1.10.2.js"))
    Dim fileDate = System.IO.File.GetLastWriteTime(filePath).ToString("yyyyMMddHHmmssfff")
End Code
<script src="@Url.Content("~/Scripts/HelloWorld.js?date=" & fileDate)" type="text/javascript"></script>
・・・略・・・

出力結果

<script src="/Scripts/HelloWorld.js?date=20160104220752149" type="text/javascript"></script>

■ 実装2:ビュー以外で実装する

Imports System.Web.Optimization

Public Module BundleConfig
    Public Sub RegisterBundles(ByVal bundles As BundleCollection)


        bundles.Add(New ScriptBundle("~/bundles/jquery").Include(
                "~/Scripts/jquery-{version}.js"))

        ' ★ここ★
        Dim filePath = Hosting.HostingEnvironment.MapPath("~/Scripts/HelloWorld.js")
        Dim fileDate = System.IO.File.GetLastWriteTime(filePath).ToString("yyyyMMddHHmmssfff")
        bundles.Add(New ScriptBundle("~/bundles/jsHello").Include(
                "~/Scripts/HelloWorld.js?date=" & fileDate))
    End Sub
End Module

■ 実装3:Bundles.ResolveBundleUrlメソッドを使う

Bundleについては、以下の関連記事を参照のこと
http://blogs.yahoo.co.jp/dk521123/35704775.html
<script src="@System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/bundles/jsHello")" type="text/javascript"></script>

出力結果

* 軽く実験したが毎回違うハッシュ値ではなく、中身のJSに変更になったら変わるが、変更がなかったら同じハッシュ値だった
<script src="/bundles/jsHello?v=BZGaXsRK3rFdbpY0k8ak1Ls0nJDWwbTUS4hURH1dUIo1" type="text/javascript"></script>


関連記事

Minify & BundleをASP.NET MVC で使う

http://blogs.yahoo.co.jp/dk521123/35704775.html

【ASP.NET】URLなどの扱いあれこれ(取得など)

http://blogs.yahoo.co.jp/dk521123/26988494.html

【ASP.NET MVC】【IIS】セッション状態モード

$
0
0

■セッション状態モード

https://msdn.microsoft.com/ja-jp/library/ms178586.aspx
より

[1] InProc モード(インプロセス モード)
[2] StateServer モード
[3] SQLServer モード(インプロセス モード)
[4] Custom モード(カスタム モード)
[5] Off モード

[1] InProc モード

 * デフォルト
 * セッション状態が Web サーバーのインメモリで管理

【利点】
 * 最速

【欠点】
 * サーバーをクラスター構成にした場合、セッションを共有できない
 * アプリケーションの再起動時にセッションがクリアされてしまう★ここに注目★

[2] StateServer モード

 * 別サービス(つまり別プロセス)でセッション状態を管理
 * 設定方法は以下のサイトを参照のこと
http://www.projectgroup.info/tips/Microsoft.NET/aspx_0006.html
http://www.atmarkit.co.jp/fdotnet/dotnettips/183aspsesout/aspsesout.html
 * シリアライズが必要なオブジェクトに関しては、Serializable属性を予め付けておく必要がある

[3] SQLServer モード

 * セッション状態を、SQL Server データベースで管理

[4] Custom モード

 * 独自のデータストア(MySQL, NoSQL etc)にセッション状態を格納
 * 以下のサイトなどを参照
* SQLServer2014のインメモリ
http://tech.sanwasystem.com/entry/2015/05/26/143145
* Memcached / Redis
http://kendik.hatenablog.com/entry/2013/05/01/224707

[5] Off モード

 * セッション状態を無効にする

■問題点

 * 上記の通り、「InProc モード」が「デフォルト」で、
   欠点は「アプリケーションの再起動時にセッションがクリアされてしまう」
 * 下記「Webアプリケーションの再起動するタイミング」の条件でWebアプリケーションは再起動し、
   セッションはクリアされてしまう
  => もし、簡単に起こってしまう場合、「InProc モード」を変更することも検討する必要がある
 * 以下のサイトも参照
http://www.ilovex.co.jp/Division/SRD/archives/2007/07/aspnet_inproc.html
http://terutomi.seesaa.net/article/14060479.html

Webアプリケーションの再起動するタイミング

http://www.atmarkit.co.jp/fdotnet/bookpreview/learnaspnet_0701/learnaspnet_0701_03.html
https://technet.microsoft.com/ja-jp/library/ee431628.aspx
より

 * Global.asaxやWeb.configが変更された場合
 * 設定されたリサイクル時間が経過した場合(デフォルトは「29 時間」)
 * サーバーメモリが大量に消費された場合(大量にアクセスされた場合など)
 * アプリケーション配下のBinフォルダーが変更された場合

# イベントログに出力するようにした方がよさそう

【トラブル】【ASP.NET MVC】 Bundle機能を使った最小化(Minify)が失敗する際のトラブルシューティング

$
0
0

はじめに

 * ASP.NET MVCにおいて、Bundle機能を使って、外部CSS/JavaScript を最小化(Minify)する際に、
   外部CSS/JavaScriptのフォーマットに不備があった場合、警告やエラーにより、
   以下の「エラー内容」が出力され、最小化できない時があるので、その際のトラブルシューティングをメモ。

エラー内容

最小化できませんでした。
最小化されていないコンテンツを返します。

[1]エラー「run-time error CSS1062」が出力される

 * 以下のエラー内容が表示され、最小化できない。

エラー内容

(xxxx,xx): run-time error CSS1062: Expected semicolon or closing curly-brace, found ':'

原因

* 「;」がなかった
.sample-css {
font-size: 20px;
color: blue;
height: 100px /* 「;」がなかった */
width: 100px;
}

解決案

* 「;」を付加する
.sample-css {
font-size: 20px;
color: blue;
height: 100px; /* 「;」を付加 */
width: 100px;
}

[2]警告「run-time error CSS1062」が出力される

 * 以下の警告内容が表示される。なお、警告でも容赦なく、最小化できない。
 * 以下のサイトだと「識別子または文字列が必要です。」とあり、
  「"プロパティ : 値のペア"の形式で記述し、コンマ区切りのリストにして、全体をかっこで囲んで指定します。」
   とあるが、JSONの文法としては問題なさそう。
https://msdn.microsoft.com/library/0bkysafx.aspx

警告内容

(xxxx,xx): run-time warning JS1028: Expected identifier or string: class

原因

* 予約語「class」を使用していた
{ class : 'xxxx'}

解決案

* classを「"」or「'」で囲む
{ "class" : 'xxxx'}

参考文献

http://stackoverflow.com/questions/2149762/possible-cases-for-javascript-error-expected-identifier-string-or-number

関連記事

Minify & BundleをASP.NET MVC で使う

http://blogs.yahoo.co.jp/dk521123/35704775.html

【ASP.NET MVC】【IIS】ASP.NET を ローカルIIS にデプロイする

$
0
0

手順・概要

[1] IISを設定する
 => これは一回行えばいい
[2] デプロイするモジュールを作成する
[3] 作成したモジュールをIISにデプロイ(配置)し、サーバをスタートさせる

[1] IISを設定する

これは一回行えばいい
http://www.wannko.net/windows10/iis/iis_00.html
を見ながらやるといい。

1) デスクトップ左下のWindowsボタンを右クリックし、
   [コントロールパネル]-[プログラムと機能]-[Windowsの機能の有効化または無効化]を選択
2) 「インターネットインフォメーションサービス」にチェック(※)を入れて、「OK」ボタンを押下

 ※ 以下にチェックを入れておく必要がある
  + [インターネットインフォメーションサービス]-[World Wide Webサービス]-[アプリケーション開発機能]
      -[.NET拡張機能 4.6]
      -[ASP.NET 4.6]
 ※ 以下にチェックを入れておいた方がいいかも
  + [インターネットインフォメーションサービス]-[Web管理ツール]-[IIS管理サービス]

 => 後は、完了を待つだけ

[2] デプロイするモジュールを作成する

1) VisualStudio を立ち上げて、対象プロジェクトを開く
2) 

[3] 作成したモジュールをIISにデプロし、サーバをスタートさせる

Viewing all 860 articles
Browse latest View live


<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>