只要一天就可以搭建测年龄网站How-Old.net？内容详解

如何搭建测年龄网站How-Old.net？

下面是一个简单的步骤：

第一步：准备

首先，在你的个人电脑上安装Visual Studio 2015。

确保安装了.NET框架和IIS（Internet信息服务）。

第二步：创建新的ASP.NET Web项目

使用Visual Studio创建新的ASP.NET Web项目。

在项目类型选择ASP.NET Web Application，命名为HowOld。

选择Web Forms，再点击OK按钮进行选择。

第三步：添加代码

使用以下代码替换默认的.aspx文件。

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="HowOld.Default" %>

    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>How-Old Web Application</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                $("#btnClick").click(function (e) {
                    e.preventDefault();
                    var s = $("#txtUrl").val();
                    detectAge(s);
                });
                function detectAge(url) {
                    $.ajax({
                        url: "http://www.how-old.net/Home/Analyze",
                        dataType: "json",
                        data: {
                            'url': url
                        },
                        success: function (data) {
                            $("#imgResult").attr("src", url);
                            $("#result").html(data.Description);
                            $("#result-hidden img").attr("src", url);
                            $("#result-hidden strong").html(data.Description);
                            $("#myModal").modal('show');
                        },
                        failure: function (errMsg) {
                            alert(errMsg);
                        }
                    });
                }
            });
        </script>
    </head>
    <body>
        <div class="container">
            <h1>How-Old Web Application</h1>
            <p>请输入图片的网址，然后单击提交按钮。</p>
            <input id="txtUrl" type="text" class="form-control">
            <br />
            <button id="btnClick" class="btn btn-primary">提交</button>
            <!-- Modal -->
            <div id="myModal" class="modal fade" role="dialog">
                <div class="modal-dialog">
                    <!-- Modal content-->
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal">&times;</button>
                            <h4 class="modal-title">年龄检测结果</h4>
                        </div>
                        <div id="result-hidden" class="modal-body">
                            <img src="" id="imgResult" width="200"/>
                            <br /><br />
                            <strong></strong>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </body>
    </html>

使用以下代码替换默认的.aspx.cs文件。

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.Services;
    using Newtonsoft.Json.Linq;

    namespace HowOld
    {
        public partial class Default : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {

            }
        }
    }

第四步：测试

使用Visual Studio运行HowOld项目。

在Web表单中输入图片的URL，并单击“提交”按钮。

结果将在弹出框中显示。

示例说明1

比如说，你想预测猫咪的年龄，那么你需要一张猫咪的图片链接，比如 https://www.pethealthnetwork.com/sites/default/files/2018-11/5-ways-to-care-for-your-pets-teeth.jpg

接着，按照上述步骤，添加代码并运行项目，输入上述链接，点击“提交”按钮，就可以得到预测结果了。

示例说明2

比如说，你想预测一个明星的年龄，那么你需要一张明星的图片链接，比如 https://www.popsci.com/sites/popsci.com/files/styles/1000_1x_/public/angry-cat.jpg?itok=1i_xqzBl