手捧星光945 2023-03-27 22:46 采纳率: 85%
浏览 22

html数据本机接收不到

gin框架html绑定的表单数据发送不了

package main

import (
    "fmt"
    "net/http"

    "github.com/gin-gonic/gin"
)

func main() {
    r := gin.Default()
    r.LoadHTMLGlob("./*")
    defer r.Run()
    group := r.Group("user")
    {
        group.GET("/login", func(ctx *gin.Context) {
            ctx.HTML(http.StatusOK, "login.html", nil)
        })
        group.GET("/register", func(ctx *gin.Context) {
            ctx.HTML(http.StatusOK, "register.html", nil)

        })
    }
    r.POST("/submit-form", handleRegistter)
    fmt.Print("1")

}

func handleRegistter(ctx *gin.Context) {
    text := ctx.PostForm("text")
    password := ctx.PostForm("password")
    fmt.Printf("text: %v\n", text)
    fmt.Printf("password: %v\n", password)
}


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
    <title>用户注册页面</title>
    <style type="text/css">
        /* 整个boby页面的样式 */
        body {
            background:url(./login.a6245adb.png) no-repeat;
            background-size: 100% 100%;
            height: 100vh;
        }
        /* 盒子外围的样式设置 */
        .box2  {
            width: 100%;
            height: 100vh;
            /* 弹性布局 */
            display: flex;
            /* 上下居中对齐 */
            align-items: center;
            /* 左右居中对齐 */
            justify-content: center;
        }
        /* 整个注册界面的样式设置 */
        .register_mark {
            width: 600px;
            height: 550px;
            /* 圆角边框 */
            border-radius: 30px;
            text-align: center;
            background: white;
        }
        /* 注册标识文字的样式设置 */
        .user_register {
            font-size: 40px;
            color:#145dff;
            font-weight: bold;
            font-family: "microsoft yahei";
            line-height: 100px;
        }
        /* 提示语文字的样式设置 */
        .mark_files{
            font-size: 16px;
            margin-top: 10px;
            text-align: left;
            padding-left: 86px;
        }
        /* 输入框的样式设置 */
        .input_mark input {
            width: 70%;
            height: 40px;
            margin-bottom: 30px;     
        }
        /* 提交按钮的样式设置 */
        button {
            font-size:17px;
            color: white;
            background: #145dff;
            border: none;
            height: 50px;
            width: 71.5%;
        }
        /* 协议整体文字的样式设置 */
        .pact_mark{
            font-size: 16px;
            margin-top: 10px;
            text-align: left;
            padding-left: 86px;
        }
        /* 用户协议文字的样式设置 */
        .pact_mark a {
            color: #145dff;
            font-weight: bold;
        }
        /* 提示语文字的样式设置 */
        .mark{
            font-size: 16px;
            margin-top: 20px;
            line-height: 40px;
        }
        /* 立即登录的样式设置 */
        .mark a {
            color: #145dff;
        }
        /* 底部文字的样式设置 */
        .mark_mass{
            font-size: 20px;
            line-height: 30px;
            color: white;
            text-align: center;
            margin: 10px;
            /* 绝对定位 */
            position: absolute;
            bottom: 0;
            left: 49%;
            transform: translate(-49%, 0);
        }
        /* 图片的样式设置 */
        .login-form{
            height: auto;
            width: auto;
            text-align: top left;
            background-repeat: no-repeat;
        }
        /* 其他登录方式的样式设计 */
        .other_login p{
            font-size: 15px;
            line-height: 40px;
            text-align: center;
            
        }
        /* qq登录的样式设计 */
        .other_login .img_png img{
            width: 35px;
            height: 35px;
            background-repeat: no-repeat;
            margin-top: -100px;
            margin-left: -160px;
        }
        /* qq登录:当鼠标悬浮在元素上方时,给元素设定的样式 */
        .other_login .img_png img:hover{
            width: 35px;
            height: 35px;
            background-repeat: no-repeat;
            margin-top: -100px;
            margin-left: -160px;
            background: #1E90FF;
            cursor: pointer;
        }
        /* wx登录方式的样式设计 */
        .other_login .img_png1 img{
            width: 35px;
            height: 35px;
            background-repeat: no-repeat;
            margin-top: -100px;
            margin-right: -160px;
        }
        /* wx登录方式:当鼠标悬浮在元素上方时,给元素设定的样式 */
        .other_login .img_png1 img:hover{
            width: 35px;
            height: 35px;
            background-repeat: no-repeat;
            margin-top: -100px;
            margin-right: -160px;
            background: #1E90FF; 
            cursor: pointer;
        }
        .img_list {
            display: flex;
            justify-content: center;
        }
    </style>
</head>
<body>
    <form action="" method="get">
       <div class="box2">
           <div class="register_mark">
               <div class="user_register">注册Eolink</div>
               <div class="mark_files">
                   <p>手机号或者邮箱注册</p>
               </div>
               <form method="POST" action="/submit-form">
               <div class="input_mark" methode="POST">
                   <input type="text"  for="text" id="text" method placeholder="请输入手机号或邮箱" required>
               </div>    
               <div class="input_mark" method="POST">
                   <input type="password" for="password" id="password" placeholder="请输入密码" required>
               </div>
            
               <button type="submit" value="Submit"  onclick="tank()">完 成 注 册</button>
            </form>
               
              <div class="pact_mark">
                   <input type="checkbox" value="1">同意
                   <a href="https://shimo.im/docs/W8xUHmqpUvcf7I75/">用户服务协议</a>
               </div>
               <div class="mark">
                   <p>已有账号?<a href="login">立即Login</a></p>
               </div>
               <div class="other_login">
                   <div class="form-others-title">
                       <div class="mlr10 fs14">—————————  其他登录方式  —————————</div>
                       <div class="img_list">
                           
                           <div class="img_png1">
                               <p class="ut-02">
                                   <a href="https://shimo.im/docs/W8xUHmqpUvcf7I75/">
                                       <p>微信登录</p>
                                   </a>
                               </p>
                           </div>
                       </div>
                   </div>
               </div>
           </div>
       </div>
    </form>
    
    
<script type="text/javascript">
    function tank() {
        alert("欢迎登录!!!")
    }
</script>
</body>
</html>


![img](https://img-mid.csdnimg.cn/release/static/image/mid/ask/120843829976175.png "#left"
想请教各位是哪一步出现了问题并且如何解决呢

  • 写回答

2条回答 默认 最新

  • 花开丶醉玄月 2023-03-28 01:04
    关注

    根据提供的代码,您正在使用 Go 语言和 Gin 框架构建一个 Web 应用程序,该应用程序包含登录和注册页面。但是,您尝试提交表单数据时未能成功将数据发送到服务器。在这种情况下,可以尝试以下几个步骤来诊断问题:

    确认表单数据已正确设置:在您的 HTML 文件中,确保您已正确设置了表单的输入字段和提交按钮,并且您已将表单数据绑定到正确的名称。

    确认 POST 请求已正确设置:在您的 Go 代码中,确保您已正确设置了 POST 请求的路由,并且您已通过调用 ctx.PostForm 方法来获取表单数据。您的代码看起来已经正确地完成了这些步骤。

    检查网络请求是否已正确发送:如果您无法发送表单数据,可能是因为网络请求未能正确发送。您可以使用浏览器的开发者工具或网络嗅探工具(如 Wireshark)来检查网络请求是否已正确发送到服务器。如果请求未正确发送,则需要调试客户端代码。

    检查服务器是否已正确接收请求:如果您确认表单数据已正确设置,并且您已正确设置了 POST 请求的路由,但是服务器仍未接收到请求,则需要检查服务器端代码。您可以使用 fmt.Print 方法或日志工具来检查代码中是否存在错误或异常。

    希望这些提示可以帮助您进一步诊断和解决问题。

    评论
    1人已打赏

报告相同问题?

问题事件

  • 创建了问题 3月27日

悬赏问题

  • ¥20 有偿:在ubuntu上安装arduino以及其常用库文件。
  • ¥15 请问用arcgis处理一些数据和图形,通常里面有一个根据点划泰森多边形的命令,直接划的弊端是只能执行一个完整的边界,但是我们有时候会用到需要在有很多边界内利用点来执行划泰森多边形的命令
  • ¥30 在wave2foam中执行setWaveField时遇到了如下的浮点异常问题,请问该如何解决呢?
  • ¥20 看图片)删除这个自动化录屏脚本就一直报错找不到脚本文件,如何解决?(相关搜索:bat文件)
  • ¥750 关于一道数论方面的问题,求解答!(关键词-数学方法)
  • ¥200 csgo2的viewmatrix值是否还有别的获取方式
  • ¥15 Stable Diffusion,用Ebsynth utility在视频选帧图重绘,第一步报错,蒙版和帧图没法生成,怎么处理啊
  • ¥15 请把下列每一行代码完整地读懂并注释出来
  • ¥15 pycharm运行main文件,显示没有conda环境
  • ¥15 寻找公式识别开发,自动识别整页文档、图像公式的软件