????: ?? ???? ???? ?? ??, ???, ?????? ???? ???? ??? ? ?? ???? ?????. ? ????? ???? ??? ???? Golang ? Vue.js? ???? ???? ??? ???? ???? ???? ??, ????, ?? ???? ? ?? ???? ???? ????? ???? ????? ???? ??? ?? ??? ?????.

???? ??

Golang ???

• ???? ??? ???? ???? ???? ??? ???? ?????? ??? ?????.

Vue.js ?????

• ???? ???? ???? ?? ???? ??? ???? ??? ??? ? ? ?? ??? ?????? ?????.

?? ??

<code>TextConvert/

├── main.go          # Golang服務(wù)器代碼
├── go.mod           # Go依賴管理器
└── template/
    ├── index.html   # 用戶界面</code>

??? ??

?????? Golang? ???? ??? ??? ?? REST API? ?????. ??? ?? ???(???)? ? ?? ?? ???(???? ???? ?? ???? ???? ???)? ?? stringFormat ?????. ? ??? ???? ? ??? ???? ??? ??? ??? ??? ???? ???? ???? ?? ??? ???? ????.

func stringFormat(input string, upperOffset, lowerOffset int) string {
    var result strings.Builder
    for _, r := range input {
        if r >= 'A' && r <= 'Z' {
            result.WriteRune(rune(int(r) + upperOffset))
        } else if r >= 'a' && r <= 'z' {
            result.WriteRune(rune(int(r) + lowerOffset))
        } else {
            result.WriteRune(r)
        }
    }
    return result.String()
}

? ??? ???? ??? ???? ???? ??? ??? ???? ?? ??? ?????.

CORS ??

?????? ???? ??? ?? ? ??? enableCORS ??? ???? Go ???? CORS ????? ?????. ? ????????? ?????? ???? ?? ?? ????? ???? ??? ???? ? ??? ?????.

func enableCORS(next http.Handler) http.Handler {
    return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
        w.Header().Set("Access-Control-Allow-Origin", "*") // 允許所有來源
        w.Header().Set("Access-Control-Allow-Methods", "POST, GET, OPTIONS, PUT, DELETE")
        w.Header().Set("Access-Control-Allow-Headers", "Content-Type")
        if r.Method == http.MethodOptions {
            w.WriteHeader(http.StatusOK)
            return
        }
        next.ServeHTTP(w, r)
    })
}

??? ?? ????? ?? ??(CORS)?? ?? ??? ???? ??? ???.

Vue.js ?????

??? ??? Vue.js? ???? ???? ???? index.html??? ?? ??? ?????. ?? ?? ???? ???? ???? ?? API? ??? ???? ??? ??? ? ? ????. ??? Vue ?? ??? ????.

<div>
  <input v-model="inputText" placeholder="輸入文本">
  <button @click="convertText">轉(zhuǎn)換</button>
  <div v-if="isLoading">加載中...</div>
  <div v-else-if="results">{{ results }}</div>
  <div v-else>結(jié)果</div>
</div>

? ??? ??? Vue.js ???:

async convertText() {
    this.isLoading = true;
    try {
        const response = await fetch("https://convert-1tqr.onrender.com/convert", {
            method: "POST",
            headers: {
                "Content-Type": "application/json",
            },
            body: JSON.stringify({ text: this.inputText }),
        });

        if (!response.ok) {
            throw new Error("處理文本時(shí)出錯(cuò)。");
        }

        this.results = await response.json();
    } catch (error) {
        console.error("錯(cuò)誤：", error);
        alert("文本轉(zhuǎn)換出錯(cuò)。請(qǐng)重試。");
    } finally {
        this.isLoading = false;
    }
}

? ??????? Golang ? Vue.js? ???? ???? ???? ????, REST API? ????, ?? ??(?: CORS ??)? ?? ??? ???? ??? ?????.

?? ???? ??? ??:

??: ?????? ??? ?????

GitHub ???: MaiconGavino/TextConvert

? ??? ??? ???? ??? ???? ??? ???? ?????.

? ??? Go? Vue.js? ???? ??? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!