Tidak dapat mensirikan borang dengan betul kepada json-Golang-php.cn

Rumah

pembangunan bahagian belakang

Golang

Tidak dapat mensirikan borang dengan betul kepada json

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Feb 14, 2024 pm 08:36 PM

无法正确地将表单序列化为 json

PHP Editor Banana akan memperkenalkan anda kepada masalah biasa: borang tidak boleh bersiri ke json dengan betul. Dalam pembangunan, kita selalunya perlu menghantar data borang ke bahagian belakang untuk diproses dalam format json. Walau bagaimanapun, kadangkala kami menghadapi beberapa masalah, seperti data yang diserahkan tidak boleh ditukar dengan betul ke dalam format json. Ini mungkin disebabkan oleh aksara khas dalam bentuk atau pemformatan yang salah. Dalam artikel ini, kami akan meneroka beberapa punca dan penyelesaian biasa untuk membantu anda menyelesaikan masalah ini dan memastikan data borang disirikan ke json dengan betul.

Kandungan soalan

Saya cuba mencipta aplikasi web dalam golang yang membolehkan anda memasukkan butiran resit ke dalam bentuk yang berbeza, dan kemudian input borang ini disirikan ke dalam objek json. Walau bagaimanapun, saya menghadapi masalah untuk mensiri borang kerana setiap kali saya cuba "menyerahkan" resit, saya mendapat mesej ralat.

Ini main.go

package main

import (
    "encoding/json"
    "html/template"
    "log"
    "net/http"
    "strconv"

    "github.com/gorilla/mux"
)

type item struct {
    shortdescription string `json:"shortdescription"`
    price            string `json:"price"`
}

type receipt struct {
    retailer     string `json:"retailer"`
    purchasedate string `json:"purchasedate"`
    purchasetime string `json:"purchasetime"`
    items        []item `json:"items"`
    total        string `json:"total"`
    receiptid    int    `json:"receiptid"`
}

var receiptidcounter int

var receipts = make(map[int]receipt)

func main() {
    r := mux.newrouter()

    r.handlefunc("/", homehandler).methods("get")
    r.handlefunc("/submit", submithandler).methods("post")
    r.handlefunc("/receipt/{id}", receipthandler).methods("get")

    http.handle("/", r)

    log.fatal(http.listenandserve(":8080", nil))
}

func homehandler(w http.responsewriter, r *http.request) {
    t, err := template.parsefiles("templates/home.html")
    if err != nil {
        log.println(err)
        http.error(w, "internal server error", http.statusinternalservererror)
        return
    }

    err = t.execute(w, nil)
    if err != nil {
        log.println(err)
        http.error(w, "internal server error", http.statusinternalservererror)
    }
}

func submithandler(w http.responsewriter, r *http.request) {
    decoder := json.newdecoder(r.body)

    var receipt receipt
    err := decoder.decode(&receipt)
    if err != nil {
        log.println(err)
        http.error(w, "bad request", http.statusbadrequest)
        return
    }

    receiptidcounter++
    receipt.receiptid = receiptidcounter
    receipts[receipt.receiptid] = receipt

    jsonresponse, err := json.marshal(map[string]int{"receiptid": receipt.receiptid})
    if err != nil {
        log.println(err)
        http.error(w, "internal server error", http.statusinternalservererror)
        return
    }

    w.header().set("content-type", "application/json")
    w.write(jsonresponse)
}

func receipthandler(w http.responsewriter, r *http.request) {
    vars := mux.vars(r)
    id, err := strconv.atoi(vars["id"])
    if err != nil {
        log.println(err)
        http.error(w, "bad request", http.statusbadrequest)
        return
    }

    receipt, exists := receipts[id]
    if !exists {
        http.notfound(w, r)
        return
    }

    t, err := template.parsefiles("templates/receipt.html")
    if err != nil {
        log.println(err)
        http.error(w, "internal server error", http.statusinternalservererror)
        return
    }

    err = t.execute(w, receipt)
    if err != nil {
        log.println(err)
        http.error(w, "internal server error", http.statusinternalservererror)
    }
}

Ini rumah saya.html, ini adalah html halaman utama saya

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>receipt input form</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
    <h1 id="receipt-input-form">receipt input form</h1>
    <form id="receipt-form">
        <label>retailer:</label>
        <input type="text" name="retailer" required><br><br>
        
        <label>purchase date:</label>
        <input type="date" name="purchasedate" required><br><br>
        
        <label>purchase time:</label>
        <input type="time" name="purchasetime" required><br><br>
        
        <div id="items">
            <div class="item">
                <label>short description:</label>
                <input type="text" name="shortdescription[]" required>
                
                <label>price:</label>
                <input type="number" name="price[]" step="0.01" min="0" required>
            </div>
        </div>
        <button type="button" id="add-item-btn">add item</button><br><br>
        
        <label>total:</label>
        <input type="number" name="total" step="0.01" min="0" required><br><br>
        
        <button type="submit">submit</button>
    </form>

    <script>
        $(document).ready(function() {
            var itemcount = 1;
            $('#add-item-btn').click(function() {
                itemcount++;
                var newitem = '<div class="item"><label>short description:</label>' +
                    '<input type="text" name="shortdescription[]" required>' +
                    '<label>price:</label>' +
                    '<input type="number" name="price[]" step="0.01" min="0" required>' +
                    '<button type="button" class="remove-item-btn">remove item</button>' +
                    '</div>';
                $('#items').append(newitem);
            });
            
            $(document).on('click', '.remove-item-btn', function() {
                $(this).parent().remove();
                itemcount--;
            });
            
            $('#receipt-form').submit(function(event) {
                event.preventdefault();
                var form = $(this).serializearray();
                var items = [];
                $('.item').each(function() {
                    var item = {};
                    item.shortdescription = $(this).find('input[name="shortdescription[]"]').val();
                    item.price = $(this).find('input[name="price[]"]').val();
                    items.push(item);
                });
                form.push({ name: "items", value: json.stringify(items) });
                $.ajax({
                    type: "post",
                    url: "/submit",
                    data: form,
                    success: function(response) {
                        window.location.href = "/receipt?id=" + response.receiptid;
                    },
                    error: function(xhr, status, error) {
                        console.log(xhr.responsetext);
                    }
                });
            });
        });
    </script>
</body>
</html>

Ini resit saya.html, ini adalah html halaman resit selepas menyerahkan resit.

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Receipt Details</title>
</head>
<body>
    <h1 id="Receipt-Details">Receipt Details</h1>
    <ul>
        <li>Retailer: {{.Retailer}}</li>
        <li>Purchase Date: {{.PurchaseDate}}</li>
        <li>Purchase Time: {{.PurchaseTime}}</li>
        <li>Items:</li>
        <ul>
            {{range .Items}}
            <li>{{.ShortDescription}} - {{.Price}}</li>
            {{end}}
        </ul>
        <li>Total: {{.Total}}</li>
    </ul>
</body>
</html>

Saya mencuba kaedah bersiri yang berbeza tetapi tiada apa yang berkesan. Apabila saya mengisi borang resit dan klik hantar, saya menjangkakan bahawa saya akan dibawa ke halaman resit yang menunjukkan butiran unik resit tersebut. Tetapi saya baru sahaja mendapat ralat, ralat terbaru saya ialah ini: aksara "r" tidak sah mencari permulaan nilaiin无效字符“r”寻找值的开头

解决方法

请按如下方式更新您的 home.html。我将提交请求内容类型更改为 application/json 因为服务器中的 submithandler 正在寻找 json

Penyelesaian🎜🎜Sila kemas kini home.html anda seperti berikut. Saya menukar jenis kandungan permintaan serah kepada application/json kerana submithandler dalam pelayan sedang mencari json. 🎜

$('#receipt-form').submit(function(event) {
    event.preventDefault();
    
    var form = $(this).serializeArray();

    var formObject = {};
    $.each(form,
        function(i, v) {
            if (v.name != "price[]" && v.name != "shortDescription[]") {
                formObject[v.name] = v.value;
            }
        });

    var items = [];
    $('.item').each(function() {
        var item = {};
        item.shortDescription = $(this).find('input[name="shortDescription[]"]').val();
        item.price = $(this).find('input[name="price[]"]').val();
        items.push(item);
    });

    formObject["items"] = items;

    $.ajax({
        type: "POST",
        url: "/submit",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        data: JSON.stringify(formObject),
        success: function(response) {
            window.location.href = "/receipt?id=" + response.receiptID;
        },
        error: function(xhr, status, error) {
            console.log(xhr.responseText);
        }
    });
});

Atas ialah kandungan terperinci Tidak dapat mensirikan borang dengan betul kepada json. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan

Artikel ini dikembalikan pada:stackoverflow. Jika ada pelanggaran, sila hubungi admin@php.cn Padam

Artikel Berkaitan

Taipkan pernyataan dan jenis suis dengan antara mukaMay 02, 2025 am 12:20 AM

Gohandlesinterfacesandtypeassertionsefectively, enhancingcodeflexabilityandrobustness.1) snossersertionsallowruntimetypechecking, asseenwiththeshaphapeinterfaceandcircletype.2) typeWitchhandLemultipypeseficeMemently, gunaurvariousshapePhipeMemently, gunaurvariousshapePhipeMemently, gunaurvariousshapePhipeMemently, bermanfaat untuk

Menggunakan ralat.is dan ralat.as untuk pemeriksaan ralat di GOMay 02, 2025 am 12:11 AM

GO pengendalian kesilapan bahasa menjadi lebih fleksibel dan boleh dibaca melalui kesilapan dan kesilapan.as fungsi. 1.errors.is digunakan untuk memeriksa sama ada ralat adalah sama dengan ralat yang ditentukan dan sesuai untuk pemprosesan rantaian ralat. 2.Errors.as bukan sahaja boleh menyemak jenis ralat, tetapi juga menukar ralat kepada jenis tertentu, yang mudah untuk mengekstrak maklumat ralat. Menggunakan fungsi ini dapat memudahkan logik pengendalian ralat, tetapi perhatikan penyampaian rantaian ralat yang betul dan mengelakkan kebergantungan yang berlebihan untuk mencegah kerumitan kod.

Penalaan Prestasi Di GO: Mengoptimumkan Aplikasi AndaMay 02, 2025 am 12:06 AM

Tomakeoapplicationsrunfasterandmoreeficiently, useprofilingtools, leverageconcurrency, andmanagememoryeffectively.1) usepprofforcpuandmemoryprofiloidentificybottlenecks.2)

Masa Depan GO: Trend dan PerkembanganMay 02, 2025 am 12:01 AM

Go'sfutureisBrightWithTrendsLikeImprovedTooling, Generik, Cloud-NativeadOption, PerformanceEnhancements, dan WebassemblyIntegration, ButchallengesincludemaintainingsImplicityandImprovingErrorHandling.

Memahami Goroutine: menyelam mendalam ke go's concurrencyMay 01, 2025 am 12:18 AM

Goroutinesarefunctionsormethodsthatrunconcurlyingo, enablingefficientandlightweightconcurrency.1) theareManagedBygo'sruntimeusingmultiplexing, membolehkanThousthyandstorunonfewerthreads.2) goroutinesimproveprovperformancethoaseaseaseasyfaskmismenteFf

Memahami fungsi init di GO: Tujuan dan PenggunaanMay 01, 2025 am 12:16 AM

Thepurposeoftheinitfunctioningoistoinitializevariables, setupconfigurations, orperformnessarysetupbeforethemainfunctionExecutes.useinitby: 1) Placingitinyourcodetorunautomaticallybeforemain, 2) penyimpanan

Memahami Antara muka: Panduan KomprehensifMay 01, 2025 am 12:13 AM

Gointerfacesaremethodsignaturesetsthattypesmustimplement,enablingpolymorphismwithoutinheritanceforcleaner,modularcode.Theyareimplicitlysatisfied,usefulforflexibleAPIsanddecoupling,butrequirecarefulusetoavoidruntimeerrorsandmaintaintypesafety.

Pulih dari panik di Go: Bila dan Cara Menggunakan Pulih ()May 01, 2025 am 12:04 AM

Gunakan fungsi pulih () dalam GO untuk pulih dari panik. Kaedah khusus adalah: 1) Gunakan pulih () untuk menangkap panik dalam fungsi penangguhan untuk mengelakkan kemalangan program; 2) rekod maklumat ralat terperinci untuk debugging; 3) memutuskan sama ada untuk meneruskan pelaksanaan program berdasarkan keadaan tertentu; 4) Gunakan dengan berhati -hati untuk mengelakkan mempengaruhi prestasi.

See all articles