Prise en charge du navigateur Golang : créer un Web interactif

Allez créer des applications Web interactives qui s'exécutent dans le navigateur. Étapes : Créez un projet Go et un fichier main.go, ajoutez un gestionnaire HTTP pour afficher les messages. Ajoutez des formulaires utilisant HTML et JavaScript pour la saisie et la soumission des utilisateurs. Ajoutez la gestion des requêtes POST dans votre application Go, recevez les messages des utilisateurs et renvoyez les réponses. Utilisez l'API Fetch pour envoyer des requêtes POST et gérer les réponses du serveur.

Créez des applications Web interactives avec Go : prise en charge du navigateur

Go est un langage de programmation polyvalent qui ne se limite pas au développement back-end. Dans cet article, nous allons vous montrer comment créer facilement des applications Web interactives en utilisant Go pour les exécuter dans le navigateur.

Créer une application Web Go

Tout d'abord, créez un nouveau projet Go :

go mod init myapp

Ensuite, créez un fichier appelé main.go et ajoutez le code suivant : main.go 的文件并添加以下代码：

package main

import (
    "fmt"
    "net/http"
)

func main() {
    // 定义一个处理程序函数，它将在浏览器中渲染一个简单的消息
    http.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {
        fmt.Fprintf(w, "Hello from Go!")
    })

    // 启动 HTTP 服务器侦听端口 8080 上的请求
    http.ListenAndServe(":8080", nil)
}

浏览 Web 应用程序

使用以下命令运行 Go 应用程序：

go run main.go

然后，在浏览器中打开 http://localhost:8080。你应该会看到 "Hello from Go!" 消息显示在页面上。

添加交互性

要添加交互性，我们可以使用 HTML 和 JavaScript。将以下内容添加到 main.go 文件中，在 http.HandleFunc 闭包内：

    // 创建一个简单表单，包含一个输入字段和一个提交按钮
    fmt.Fprintf(w, "<form method='POST'><input type='text' name='message'/><input type='submit' value='Send'/></form>")

这将在页面上创建一个表单，用户可以在其中输入消息并按 "Send" 按钮提交。

接下来，添加以下 JavaScript 代码到 HTML 页面的底部，在

const form = document.querySelector('form');

form.addEventListener('submit', (e) => {
    e.preventDefault();
    const message = e.target.querySelector('input[name="message"]').value;

    // 使用 Fetch API 发送 POST 请求
    fetch('/', {
        method: 'POST',
        body: JSON.stringify({ message }),
        headers: {
            'Content-Type': 'application/json'
        }
    })
    .then(res => res.json())
    .then(data => {
        // 处理服务器响应
        console.log(data);
    })
    .catch(error => {
        // 处理错误
        console.log(error);
    });
});

Parcourez l'application Web

Lancez l'application Go à l'aide de la commande suivante :

func main() {
    http.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {
        if r.Method == "POST" {
            // 解析 JSON 请求正文
            var msg Message
            decoder := json.NewDecoder(r.Body)
            if err := decoder.Decode(&msg); err != nil {
                http.Error(w, err.Error(), http.StatusBadRequest)
                return
            }

            // 处理消息并返回响应
            fmt.Fprintf(w, "Got your message: %s", msg.Message)
        } else {
            // 处理其他请求方法
        }
    })

    // 定义一个用于保存消息的类型
    type Message struct {
        Message string `json:"message"`
    }

    http.ListenAndServe(":8080", nil)
}

Ensuite, ouvrez http://localhost:8080 dans votre navigateur. Vous devriez voir le message « Hello from Go ! » affiché sur la page.

Ajouter de l'interactivité

Pour ajouter de l'interactivité, nous pouvons utiliser HTML et JavaScript. Ajoutez ce qui suit au fichier main.go, à l'intérieur de la fermeture http.HandleFunc :

rrreee

Cela créera un formulaire sur la page où l'utilisateur pourra saisir un message et appuyer sur le bouton "Envoyer" pour soumettre. 🎜🎜Ensuite, ajoutez le code JavaScript suivant au bas de la page HTML, après la balise  : 🎜rrreee🎜Ce code JavaScript écoutera les soumissions de formulaire et collectera les messages saisis par l'utilisateur. et utilisez l'API Fetch pour envoyer des requêtes POST au serveur Go. 🎜🎜Dans votre application Go, ajoutez le code suivant pour gérer les requêtes POST : 🎜rrreee🎜Avec ces changements, notre application Web peut désormais recevoir les entrées de l'utilisateur et y afficher une réponse. 🎜🎜Conclusion🎜🎜Créer des applications Web interactives à l'aide de Go est simple et puissant. En combinant la puissance de traitement backend de Go avec les capacités frontend de HTML et JavaScript, vous pouvez créer des expériences utilisateur riches qui s'exécutent directement dans le navigateur. 🎜

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!